From 88a5a7e0ef50eda9c5921c5735a5b400d1c324fa Mon Sep 17 00:00:00 2001 From: Chris Blanquera Date: Mon, 9 Sep 2024 21:39:39 +0800 Subject: [PATCH] documentation with temple-ui preview --- docs/500.html | 51 +- docs/build/client/055f1a2f37d39d4fe92a.css | 220 +- docs/build/client/055f1a2f37d39d4fe92a.html | 51 +- docs/build/client/055f1a2f37d39d4fe92a.js | 1212 +------- docs/build/client/13781afd4fbd704a9789.css | 182 ++ docs/build/client/13781afd4fbd704a9789.html | 321 +- docs/build/client/13781afd4fbd704a9789.js | 78 +- docs/build/client/1bf701a55aaad047771e.css | 216 ++ docs/build/client/1bf701a55aaad047771e.html | 289 +- docs/build/client/1bf701a55aaad047771e.js | 95 +- docs/build/client/269f8b60f20cebb43be6.css | 244 +- docs/build/client/269f8b60f20cebb43be6.html | 683 ++-- docs/build/client/269f8b60f20cebb43be6.js | 555 ++-- docs/build/client/2d721d6aed73f41f4e72.css | 216 ++ docs/build/client/2d721d6aed73f41f4e72.html | 289 +- docs/build/client/2d721d6aed73f41f4e72.js | 95 +- docs/build/client/3550a936d66e61695120.css | 217 ++ docs/build/client/3550a936d66e61695120.html | 339 +- docs/build/client/3550a936d66e61695120.js | 85 +- docs/build/client/38ccffadc3c6e8b93d28.css | 191 ++ docs/build/client/38ccffadc3c6e8b93d28.html | 209 +- docs/build/client/38ccffadc3c6e8b93d28.js | 422 ++- docs/build/client/3e6a90cc5da3e950a902.css | 200 ++ docs/build/client/3e6a90cc5da3e950a902.html | 309 +- docs/build/client/3e6a90cc5da3e950a902.js | 93 +- docs/build/client/57e37fa233b38c87fe71.css | 233 ++ docs/build/client/57e37fa233b38c87fe71.html | 1193 +++---- docs/build/client/57e37fa233b38c87fe71.js | 189 +- docs/build/client/75ff7698b5db04ad540c.css | 271 ++ docs/build/client/75ff7698b5db04ad540c.html | 1055 ++++--- docs/build/client/75ff7698b5db04ad540c.js | 449 ++- docs/build/client/8f2ff6d48aec3c3f0dc4.css | 217 ++ docs/build/client/8f2ff6d48aec3c3f0dc4.html | 291 +- docs/build/client/8f2ff6d48aec3c3f0dc4.js | 198 +- docs/build/client/a52462b5d1f8879f7b73.css | 300 ++ docs/build/client/a52462b5d1f8879f7b73.html | 376 +++ docs/build/client/a52462b5d1f8879f7b73.js | 427 +++ docs/build/client/a67341498153885a2fc0.css | 274 ++ docs/build/client/a67341498153885a2fc0.html | 1950 ++++++------ docs/build/client/a67341498153885a2fc0.js | 557 ++-- docs/build/client/f01cefc94e8ee605f3f5.css | 404 ++- docs/build/client/f01cefc94e8ee605f3f5.html | 523 ++-- docs/build/client/f01cefc94e8ee605f3f5.js | 286 +- docs/build/client/f859bf7a335e9eba03e0.css | 215 ++ docs/build/client/f859bf7a335e9eba03e0.html | 189 +- docs/build/client/f859bf7a335e9eba03e0.js | 534 ++-- docs/build/manifest.json | 2 +- docs/build/server/055f1a2f37d39d4fe92a.js | 768 +---- docs/build/server/13781afd4fbd704a9789.js | 426 ++- docs/build/server/1bf701a55aaad047771e.js | 396 ++- docs/build/server/269f8b60f20cebb43be6.js | 785 +++-- docs/build/server/2d721d6aed73f41f4e72.js | 396 ++- docs/build/server/3550a936d66e61695120.js | 450 ++- docs/build/server/38ccffadc3c6e8b93d28.js | 316 +- docs/build/server/3e6a90cc5da3e950a902.js | 410 ++- docs/build/server/57e37fa233b38c87fe71.js | 1220 ++++---- docs/build/server/75ff7698b5db04ad540c.js | 1052 ++++--- docs/build/server/8f2ff6d48aec3c3f0dc4.js | 398 ++- docs/build/server/a52462b5d1f8879f7b73.js | 438 +++ docs/build/server/a67341498153885a2fc0.js | 1895 +++++------ docs/build/server/f01cefc94e8ee605f3f5.js | 698 ++--- docs/build/server/f859bf7a335e9eba03e0.js | 298 +- docs/docs/client-api.html | 189 +- docs/docs/compiler-api.html | 209 +- docs/docs/component-publisher.html | 291 +- docs/docs/component-strategy.html | 1055 ++++--- docs/docs/developer-tools.html | 321 +- docs/docs/getting-started.html | 1950 ++++++------ docs/docs/index.html | 309 +- docs/docs/markup-syntax.html | 1193 +++---- docs/docs/single-page.html | 339 +- docs/docs/state-management.html | 683 ++-- docs/docs/static-site.html | 289 +- docs/docs/template-engine.html | 289 +- docs/index.html | 523 ++-- docs/styles/global.css | 513 --- docs/template-1.html | 376 +++ packages/temple-ui-src/scripts/json.ts | 51 - .../src/{data => assets}/components.json | 4 - .../src/{common => assets}/reset.css | 4 - .../src/{common => assets}/theme.css | 18 +- packages/temple-ui-src/src/block/alert.css | 3 - packages/temple-ui-src/src/block/alert.tml | 104 +- packages/temple-ui-src/src/block/badge.css | 3 - packages/temple-ui-src/src/block/badge.tml | 197 +- packages/temple-ui-src/src/block/icon.tml | 10 + packages/temple-ui-src/src/block/loader.tml | 6 + packages/temple-ui-src/src/block/tab.tml | 67 + .../temple-ui-src/src/common/utilities.css | 2770 ----------------- .../temple-ui-src/src/data/utilities.json | 1 - packages/temple-ui-src/src/form/button.css | 30 - packages/temple-ui-src/src/form/button.tml | 308 +- packages/temple-ui-src/src/form/control.css | 7 - packages/temple-ui-src/src/form/control.tml | 43 +- packages/temple-ui-src/src/helpers.ts | 204 ++ packages/temple-ui-src/src/index.ts | 175 +- packages/temple-ui-src/src/panel/foot.tml | 25 + packages/temple-ui-src/src/panel/head.tml | 25 + packages/temple-ui-src/src/panel/layout.tml | 54 + packages/temple-ui-src/src/panel/left.tml | 18 + packages/temple-ui-src/src/panel/main.tml | 50 + packages/temple-ui-src/src/panel/right.tml | 30 + packages/temple-ui-src/src/types.ts | 24 + packages/temple-ui-src/src/utilities.ts | 447 +++ packages/temple-web/src/build.ts | 10 +- .../temple-web/src/components/api/docs.tml | 8 + .../temple-web/src/components/api/types.json | 2240 +++++++++++++ packages/temple-web/src/components/api/ui.tml | 115 + .../temple-web/src/components/html/aside.tml | 130 + .../temple-web/src/components/html/head.tml | 26 + .../temple-web/src/components/html/header.tml | 44 + .../temple-web/src/components/i18n/index.ts | 13 + .../src/components/i18n/translate.tml | 40 + .../temple-web/src/components/ide/app.tml | 16 + .../src/components/ide/app/head.tml | 11 + .../src/components/ide/app/left.tml | 12 + .../src/components/ide/app/main.tml | 12 + .../temple-web/src/components/ide/code.tml | 147 + .../temple-web/src/components/ide/preview.tml | 5 + packages/temple-web/src/index.ts | 4 +- packages/temple-web/src/modules/api/docs.tml | 5 + packages/temple-web/src/modules/api/ui.tml | 305 +- .../temple-web/src/modules/html/aside.tml | 130 + packages/temple-web/src/modules/html/head.tml | 2 +- .../temple-web/src/modules/html/header.tml | 44 + packages/temple-web/src/modules/ide/app.tml | 21 +- .../temple-web/src/modules/ide/app/head.tml | 6 + .../temple-web/src/modules/ide/app/left.tml | 6 + .../temple-web/src/modules/ide/app/main.tml | 6 + packages/temple-web/src/modules/ide/code.tml | 11 +- .../temple-web/src/modules/ide/preview.tml | 18 +- .../temple-web/src/modules/panel/head.tml | 31 +- .../temple-web/src/modules/panel/left.tml | 149 +- .../temple-web/src/modules/panel/panel.tml | 28 + .../temple-web/src/modules/tui/button.tml | 264 +- .../temple-web/src/modules/tui/panel/foot.tml | 25 + .../temple-web/src/modules/tui/panel/head.tml | 25 + .../src/modules/tui/panel/layout.tml | 54 + .../temple-web/src/modules/tui/panel/left.tml | 18 + .../temple-web/src/modules/tui/panel/main.tml | 50 + .../src/modules/tui/panel/right.tml | 30 + packages/temple-web/src/pages/500.dtml | 58 +- .../temple-web/src/pages/docs/client-api.dtml | 99 +- .../src/pages/docs/compiler-api.dtml | 117 +- .../src/pages/docs/component-publisher.dtml | 243 +- .../src/pages/docs/component-strategy.dtml | 1185 ++++--- .../src/pages/docs/developer-tools.dtml | 229 +- .../src/pages/docs/getting-started.dtml | 2027 ++++++------ packages/temple-web/src/pages/docs/index.dtml | 219 +- .../src/pages/docs/markup-syntax.dtml | 1106 +++---- .../src/pages/docs/single-page.dtml | 326 +- .../src/pages/docs/state-management.dtml | 601 ++-- .../src/pages/docs/static-site.dtml | 240 +- .../src/pages/docs/template-engine.dtml | 240 +- packages/temple-web/src/pages/index.dtml | 710 ++--- packages/temple-web/src/pages/template-1.dtml | 335 ++ 156 files changed, 29623 insertions(+), 22321 deletions(-) create mode 100644 docs/build/client/a52462b5d1f8879f7b73.css create mode 100644 docs/build/client/a52462b5d1f8879f7b73.html create mode 100644 docs/build/client/a52462b5d1f8879f7b73.js create mode 100644 docs/build/server/a52462b5d1f8879f7b73.js create mode 100644 docs/template-1.html delete mode 100644 packages/temple-ui-src/scripts/json.ts rename packages/temple-ui-src/src/{data => assets}/components.json (92%) rename packages/temple-ui-src/src/{common => assets}/reset.css (82%) rename packages/temple-ui-src/src/{common => assets}/theme.css (66%) delete mode 100644 packages/temple-ui-src/src/block/alert.css delete mode 100644 packages/temple-ui-src/src/block/badge.css create mode 100644 packages/temple-ui-src/src/block/icon.tml create mode 100644 packages/temple-ui-src/src/block/loader.tml create mode 100644 packages/temple-ui-src/src/block/tab.tml delete mode 100644 packages/temple-ui-src/src/common/utilities.css delete mode 100644 packages/temple-ui-src/src/data/utilities.json delete mode 100644 packages/temple-ui-src/src/form/button.css delete mode 100644 packages/temple-ui-src/src/form/control.css create mode 100644 packages/temple-ui-src/src/helpers.ts create mode 100644 packages/temple-ui-src/src/panel/foot.tml create mode 100644 packages/temple-ui-src/src/panel/head.tml create mode 100644 packages/temple-ui-src/src/panel/layout.tml create mode 100644 packages/temple-ui-src/src/panel/left.tml create mode 100644 packages/temple-ui-src/src/panel/main.tml create mode 100644 packages/temple-ui-src/src/panel/right.tml create mode 100644 packages/temple-ui-src/src/types.ts create mode 100644 packages/temple-ui-src/src/utilities.ts create mode 100644 packages/temple-web/src/components/api/docs.tml create mode 100644 packages/temple-web/src/components/api/types.json create mode 100644 packages/temple-web/src/components/api/ui.tml create mode 100644 packages/temple-web/src/components/html/aside.tml create mode 100644 packages/temple-web/src/components/html/head.tml create mode 100644 packages/temple-web/src/components/html/header.tml create mode 100644 packages/temple-web/src/components/i18n/index.ts create mode 100644 packages/temple-web/src/components/i18n/translate.tml create mode 100644 packages/temple-web/src/components/ide/app.tml create mode 100644 packages/temple-web/src/components/ide/app/head.tml create mode 100644 packages/temple-web/src/components/ide/app/left.tml create mode 100644 packages/temple-web/src/components/ide/app/main.tml create mode 100644 packages/temple-web/src/components/ide/code.tml create mode 100644 packages/temple-web/src/components/ide/preview.tml create mode 100644 packages/temple-web/src/modules/api/docs.tml create mode 100644 packages/temple-web/src/modules/html/aside.tml create mode 100644 packages/temple-web/src/modules/html/header.tml create mode 100644 packages/temple-web/src/modules/ide/app/head.tml create mode 100644 packages/temple-web/src/modules/ide/app/left.tml create mode 100644 packages/temple-web/src/modules/ide/app/main.tml create mode 100644 packages/temple-web/src/modules/panel/panel.tml create mode 100644 packages/temple-web/src/modules/tui/panel/foot.tml create mode 100644 packages/temple-web/src/modules/tui/panel/head.tml create mode 100644 packages/temple-web/src/modules/tui/panel/layout.tml create mode 100644 packages/temple-web/src/modules/tui/panel/left.tml create mode 100644 packages/temple-web/src/modules/tui/panel/main.tml create mode 100644 packages/temple-web/src/modules/tui/panel/right.tml create mode 100644 packages/temple-web/src/pages/template-1.dtml diff --git a/docs/500.html b/docs/500.html index f37fc82..a4abae8 100644 --- a/docs/500.html +++ b/docs/500.html @@ -18,42 +18,47 @@ - + - -
- - - Temple Logo - -

Temple

-
- -
-

Oops...

-

- + + +

+

Oops...

+ Something went wrong. Please try again later. -

- 

-      

-    
+          
+            
Unknown Error

+          
+        

+      
+    
   
 
\ No newline at end of file
diff --git a/docs/build/client/055f1a2f37d39d4fe92a.css b/docs/build/client/055f1a2f37d39d4fe92a.css
index ee6e600..5c57e83 100644
--- a/docs/build/client/055f1a2f37d39d4fe92a.css
+++ b/docs/build/client/055f1a2f37d39d4fe92a.css
@@ -1,9 +1,211 @@
-.container { padding: 20px; }
-  .error pre {
-    border: 1px solid #222222;
-    font-family: Courier, monospace;
-    line-height: 22px;
-    padding: 20px;
-    white-space: pre-wrap;
-    word-wrap: break-word;
-  }
\ No newline at end of file
+html, body {
+  height: 100%;
+  margin: 0;
+  padding: 0;
+  width: 100%;
+}
+
+h1, h2, h3, h4, h5, h6, p {
+  margin: 0;
+  padding: 0;
+}
+
+a {
+  text-decoration: none;
+}
+  html-head:not(:defined) { opacity: 0; }
+html-header:not(:defined) { opacity: 0; }
+panel-layout:not(:defined) { opacity: 0; }
+panel-head:not(:defined) { opacity: 0; }
+panel-main:not(:defined) { opacity: 0; }
+tui-button:not(:defined) { opacity: 0; }
+ide-app:not(:defined) { opacity: 0; }
+ide-code:not(:defined) { opacity: 0; }
+ide-preview:not(:defined) { opacity: 0; }
+i18n-translate:not(:defined) { opacity: 0; }
+  :root {
+  --black: #000000;
+  --white: #FFFFFF;
+  --info: #1474FC;
+  --error: #DC3545;
+  --warning: #FF7B07;
+  --success: #28A745;
+  --muted: #999999;
+}
+
+.light {
+  --bg-0: #EFEFEF;
+  --bg-1: #CFCFCF;
+  --bg-2: #AFAFAF;
+  --bg-3: #8F8F8F;
+  --bg-4: #6F6F6F;
+  --bd-0: #EFEFEF;
+  --bd-1: #CFCFCF;
+  --bd-2: #AFAFAF;
+  --bd-3: #8F8F8F;
+  --bd-4: #6F6F6F;
+  --bg-inverse: #242424;
+  --tx-0: #000000;
+  --tx-1: #242424;
+  --tx-inverse: #CFCFCF;
+}
+
+.dark {
+  --bg-0: #121212;
+  --bg-1: #222222;
+  --bg-2: #323232;
+  --bg-3: #424242;
+  --bg-4: #525252;
+  --bd-0: #121212;
+  --bd-1: #222222;
+  --bd-2: #323232;
+  --bd-3: #424242;
+  --bd-4: #525252;
+  --bg-inverse: #DBDBDB;
+  --tx-0: #FFFFFF;
+  --tx-1: #CFCFCF;
+  --tx-inverse: #222222;
+}
+  html-head { display: block; }
+html-header { display: block; }
+panel-layout { display: block; }
+panel-head { display: block; }
+panel-main { display: block; }
+tui-button { display: block; }
+ide-app { display: block; }
+ide-code { display: block; }
+ide-preview { display: block; }
+i18n-translate { display: block; }
+  .arial { font-family: Arial, sans-serif; }
+.courier { font-family: 'Courier New', Courier, monospace; }
+.none { display: none; }
+.block { display: block; }
+.flex { display: flex; }
+.inline { display: inline; }
+.inline-block { display: inline-block; }
+.transparent { opacity: 0; }
+.relative { position: relative; }
+.absolute { position: absolute; }
+.static { position: static; }
+.bottom-0 { bottom: 0px; }
+.bottom-60 { bottom: 60px; }
+.left-0 { left: 0px; }
+.left-226 { left: 226px; }
+.left-0 { left: 0px; }
+.left-226 { left: 226px; }
+.right-0 { right: 0px; }
+.right-200 { right: 200px; }
+.right-0 { right: 0px; }
+.right-200 { right: 200px; }
+.top-0 { top: 0px; }
+.top-60 { top: 60px; }
+.flex-grow { flex-grow: 1; }
+.flex-center { align-items: center; justify-content: center; }
+.flex-center-y { align-items: center; }
+.gap-10 { gap: 10px; }
+.scroll-auto { overflow: auto; }
+.scroll-hidden { overflow: hidden; }
+.scroll-x-auto { overflow-x: auto; }
+.h-full { height: 100%; }
+.h-26 { height: 26px; }
+.h-7289 { height: 7289px; }
+.h-905496362982981723 { height: 905496362982981723px; }
+.h-60 { height: 60px; }
+.h-999999 { height: 999999px; }
+.h-10 { height: 10px; }
+.h-22 { height: 22px; }
+.vh { height: 100vh; }
+.w-full { width: 100%; }
+.w-0 { width: 0px; }
+.w-10 { width: 10px; }
+.w-calc-full-40 { width: calc(100% - 40px); }
+.bg-primary { background-color: var(--primary) !important; }
+.bg-secondary { background-color: var(--secondary) !important; }
+.bg-black { background-color: var(--black) !important; }
+.bg-white { background-color: var(--white) !important; }
+.bg-info { background-color: var(--info) !important; }
+.bg-error { background-color: var(--error) !important; }
+.bg-warning { background-color: var(--warning) !important; }
+.bg-success { background-color: var(--success) !important; }
+.bg-muted { background-color: var(--muted) !important; }
+.bg-t-1 { background-color: var(--bg-1) !important; }
+.bg-t-0 { background-color: var(--bg-0) !important; }
+.bg-h-cb3837 { background-color: #cb3837; }
+.bg-h-7289da { background-color: #7289da; }
+.bg-h-999999 { background-color: #999999; }
+.tx-5 { font-size: 5px; }
+.tx-16 { font-size: 16px; }
+.tx-lg { font-size: 16px; }
+.tx-5xl { font-size: 26px; }
+.tx-center { text-align: center; }
+.tx-uppercase { text-transform: uppercase; }
+.tx-word-wrap { word-wrap: break-word; }
+.tx-prewrap { white-space: pre-wrap; }
+.tx-nodecor { text-decoration: none; }
+.tx-lh-22 { line-height: 22px; }
+.tx-primary { color: var(--primary) !important; }
+.tx-secondary { color: var(--secondary) !important; }
+.tx-black { color: var(--black) !important; }
+.tx-white { color: var(--white) !important; }
+.tx-info { color: var(--info) !important; }
+.tx-error { color: var(--error) !important; }
+.tx-warning { color: var(--warning) !important; }
+.tx-success { color: var(--success) !important; }
+.tx-muted { color: var(--muted) !important; }
+.tx-t-1 { color: var(--tx-1) !important; }
+.bd-solid { border-style: solid; }
+.bd-primary { border-color: var(--primary) !important; }
+.bd-secondary { border-color: var(--secondary) !important; }
+.bd-info { border-color: var(--info) !important; }
+.bd-error { border-color: var(--error) !important; }
+.bd-warning { border-color: var(--warning) !important; }
+.bd-success { border-color: var(--success) !important; }
+.bd-muted { border-color: var(--muted) !important; }
+.curved { border-radius: 4px; }
+.rounded { border-radius: 12px; }
+.pill { border-radius: 10000px; }
+.m-0 { margin: 0px; }
+.m-0 { margin: 0px; }
+.m-60 { margin: 60px; }
+.ml-10 { margin-left: 10px; }
+.ml-5 { margin-left: 5px; }
+.mr-10 { margin-right: 10px; }
+.p-5 { padding: 5px; }
+.p-0 { padding: 0px; }
+.p-60 { padding: 60px; }
+.p-10 { padding: 10px; }
+.p-10 { padding: 10px; }
+.p-20 { padding: 20px; }
+.pb-20 { padding-bottom: 20px; }
+.pr-10 { padding-right: 10px; }
+.pt-10 { padding-top: 10px; }
+.px-20 { padding-left: 20px; padding-right: 20px; }
+.px-4 { padding-left: 4px; padding-right: 4px; }
+.px-8 { padding-left: 8px; padding-right: 8px; }
+.px-12 { padding-left: 12px; padding-right: 12px; }
+.px-16 { padding-left: 16px; padding-right: 16px; }
+.px-24 { padding-left: 24px; padding-right: 24px; }
+.px-28 { padding-left: 28px; padding-right: 28px; }
+.px-32 { padding-left: 32px; padding-right: 32px; }
+.px-36 { padding-left: 36px; padding-right: 36px; }
+.py-15 { padding-top: 15px; padding-bottom: 15px; }
+.py-5 { padding-top: 5px; padding-bottom: 5px; }
+.py-2 { padding-top: 2px; padding-bottom: 2px; }
+.py-4 { padding-top: 4px; padding-bottom: 4px; }
+.py-6 { padding-top: 6px; padding-bottom: 6px; }
+.py-8 { padding-top: 8px; padding-bottom: 8px; }
+.py-10 { padding-top: 10px; padding-bottom: 10px; }
+.py-12 { padding-top: 12px; padding-bottom: 12px; }
+.py-14 { padding-top: 14px; padding-bottom: 14px; }
+.py-16 { padding-top: 16px; padding-bottom: 16px; }
+.py-18 { padding-top: 18px; padding-bottom: 18px; }
+.cursor-pointer { cursor: pointer; }
+.transition-500 { transition: 500ms; }
+.shadow-0-0-10-0-0-0-5 { box-shadow: 0px 0px 10px rgb(0, 0, 0, 0.5); }
+@media (max-width: 767px) {
+  .md-inline-block { display: inline-block; }
+  .md-left-0 { left: 0px; }
+  .md-left-226 { left: 226px; }
+  .md-right-0 { right: 0px; }
+  .md-right-200 { right: 200px; }
+}
\ No newline at end of file
diff --git a/docs/build/client/055f1a2f37d39d4fe92a.html b/docs/build/client/055f1a2f37d39d4fe92a.html
index f37fc82..a4abae8 100644
--- a/docs/build/client/055f1a2f37d39d4fe92a.html
+++ b/docs/build/client/055f1a2f37d39d4fe92a.html
@@ -18,42 +18,47 @@
   
   
   
-  
+  
   
   
   
   
 
-  
-    

-  
-  
-    Temple Logo
-  
-  
Temple

-  

-    
-      

-        
Oops...

-        

-          
+
+      
+        

+          
Oops...

+          
             Something went wrong. Please try again later.
           
-        

-        

-      

-    
+          
+            
Unknown Error

+          
+        

+      
+    
   
 
\ No newline at end of file
diff --git a/docs/build/client/055f1a2f37d39d4fe92a.js b/docs/build/client/055f1a2f37d39d4fe92a.js
index 37655f7..e728aef 100644
--- a/docs/build/client/055f1a2f37d39d4fe92a.js
+++ b/docs/build/client/055f1a2f37d39d4fe92a.js
@@ -1,1076 +1,136 @@
-var TempleAPI = (() => {
-  var __create = Object.create;
-  var __defProp = Object.defineProperty;
-  var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-  var __getOwnPropNames = Object.getOwnPropertyNames;
-  var __getProtoOf = Object.getPrototypeOf;
-  var __hasOwnProp = Object.prototype.hasOwnProperty;
-  var __commonJS = (cb, mod) => function __require() {
-    return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
-  };
-  var __export = (target, all) => {
-    for (var name in all)
-      __defProp(target, name, { get: all[name], enumerable: true });
-  };
-  var __copyProps = (to, from, except, desc) => {
-    if (from && typeof from === "object" || typeof from === "function") {
-      for (let key of __getOwnPropNames(from))
-        if (!__hasOwnProp.call(to, key) && key !== except)
-          __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-    }
-    return to;
-  };
-  var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-    // If the importer is in node compatibility mode or this is not an ESM
-    // file that has been converted to a CommonJS file using a Babel-
-    // compatible transform (i.e. "__esModule" has not been set), then set
-    // "default" to the CommonJS "module.exports" for node compatibility.
-    isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-    mod
-  ));
-  var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-  // ../temple/dist/Exception.js
-  var require_Exception = __commonJS({
-    "../temple/dist/Exception.js"(exports) {
-      "use strict";
-      Object.defineProperty(exports, "__esModule", { value: true });
-      var TempleException3 = class extends Error {
-        static for(message, ...values) {
-          values.forEach(function(value) {
-            message = message.replace("%s", value);
-          });
-          return new this(message);
-        }
-        static forErrorsFound(errors) {
-          const exception = new this("Invalid Parameters");
-          exception.errors = errors;
-          return exception;
-        }
-        static require(condition, message, ...values) {
-          if (!condition) {
-            for (const value of values) {
-              message = message.replace("%s", value);
-            }
-            throw new this(message);
-          }
-        }
-        constructor(message, code = 500) {
-          super();
-          this.errors = {};
-          this.start = 0;
-          this.end = 0;
-          this.message = message;
-          this.name = this.constructor.name;
-          this.code = code;
-        }
-        withCode(code) {
-          this.code = code;
-          return this;
-        }
-        withPosition(start, end) {
-          this.start = start;
-          this.end = end;
-          return this;
-        }
-        toJSON() {
-          return {
-            error: true,
-            code: this.code,
-            message: this.message
-          };
-        }
-      };
-      exports.default = TempleException3;
-    }
-  });
-
-  // ../temple/dist/client/TempleEmitter.js
-  var require_TempleEmitter = __commonJS({
-    "../temple/dist/client/TempleEmitter.js"(exports) {
-      "use strict";
-      Object.defineProperty(exports, "__esModule", { value: true });
-      exports.TempleEmitter = void 0;
-      var TempleEmitter2 = class extends EventTarget {
-        emit(event, target) {
-          this.dispatchEvent(new CustomEvent(event, { detail: target }));
-          return this;
-        }
-        on(event, callback) {
-          if (event === "ready") {
-            if (document.readyState !== "loading") {
-              const event2 = new CustomEvent("ready");
-              setTimeout(() => callback(event2), 1);
-              return this;
-            }
-          }
-          this.addEventListener(event, callback);
-          return this;
-        }
-        once(event, callback) {
-          const unbinder = (e) => {
-            this.unbind(event, unbinder);
-            callback(e);
-          };
-          this.on(event, unbinder);
-          return this;
-        }
-        unbind(event, callback) {
-          this.removeEventListener(event, callback);
-          return this;
-        }
-      };
-      exports.TempleEmitter = TempleEmitter2;
-      var emitter3 = new TempleEmitter2();
-      document.onreadystatechange = () => {
-        if (document.readyState !== "loading") {
-          emitter3.emit("ready");
-        }
-      };
-      exports.default = emitter3;
-    }
-  });
-
-  // ../temple/dist/client/TempleElement.js
-  var require_TempleElement = __commonJS({
-    "../temple/dist/client/TempleElement.js"(exports) {
-      "use strict";
-      var __importDefault = exports && exports.__importDefault || function(mod) {
-        return mod && mod.__esModule ? mod : { "default": mod };
-      };
-      Object.defineProperty(exports, "__esModule", { value: true });
-      var TempleEmitter_1 = __importDefault(require_TempleEmitter());
-      var TempleElement2 = class {
-        get attributes() {
-          return Object.assign({}, this._attributes);
-        }
-        get element() {
-          return this._element;
-        }
-        constructor(element, attributes) {
-          this._element = element;
-          this._attributes = attributes;
-        }
-        hasAttribute(key) {
-          return key in this._attributes;
-        }
-        getAttribute(key) {
-          return this._attributes[key];
-        }
-        removeAttribute(key, silent = false) {
-          const current = this.getAttribute(key);
-          if (typeof current === "undefined") {
-            return this;
-          }
-          delete this._attributes[key];
-          this._element.removeAttribute(key);
-          if (!silent) {
-            TempleEmitter_1.default.emit("attribute-remove", {
-              element: this,
-              key,
-              previous: current
-            });
-          }
-          return this;
-        }
-        setAttribute(key, value, silent = false) {
-          if (typeof value === "undefined") {
-            return this.removeAttribute(key, silent);
-          }
-          const current = this.getAttribute(key);
-          if (current === value) {
-            return this;
-          }
-          this._attributes[key] = value;
-          if (typeof value === "string") {
-            this._element.setAttribute(key, value);
-          }
-          if (!silent) {
-            if (typeof current === "undefined") {
-              TempleEmitter_1.default.emit("attribute-create", { element: this, key, value });
-            } else {
-              TempleEmitter_1.default.emit("attribute-update", {
-                element: this,
-                key,
-                value,
-                previous: current
-              });
-            }
-          }
-          return this;
-        }
-        setAttributes(attributes, silent = false) {
-          for (const [key, value] of Object.entries(attributes)) {
-            this.setAttribute(key, value, silent);
-          }
-          const names = Object.keys(attributes);
-          for (const key of Object.keys(this._attributes)) {
-            if (!names.includes(key)) {
-              this.removeAttribute(key, silent);
-            }
-          }
-          return this;
-        }
-      };
-      exports.default = TempleElement2;
-    }
-  });
-
-  // ../temple/dist/client/TempleRegistry.js
-  var require_TempleRegistry = __commonJS({
-    "../temple/dist/client/TempleRegistry.js"(exports) {
-      "use strict";
-      var __importDefault = exports && exports.__importDefault || function(mod) {
-        return mod && mod.__esModule ? mod : { "default": mod };
-      };
-      Object.defineProperty(exports, "__esModule", { value: true });
-      var TempleElement_1 = __importDefault(require_TempleElement());
-      var TempleRegistry5 = class {
-        static get elements() {
-          return this._elements;
-        }
-        static createComponent(tagname, definition, attributes, children3 = []) {
-          const template = document.createElement("template");
-          template.innerHTML = `<${tagname}>`;
-          const fragment = template.content;
-          const component = fragment.querySelector(`${tagname}`);
-          Object.setPrototypeOf(component, definition.prototype);
-          component.constructor = definition.constructor;
-          component.constructor.component = definition.component;
-          for (const [key, value] of Object.entries(attributes)) {
-            if (typeof value === "string") {
-              component.setAttribute(key, value);
-            } else if (value === true) {
-              component.setAttribute(key, key);
-            }
-          }
-          component._TempleAttributes = attributes;
-          component.props = attributes;
-          children3.forEach((child) => component.appendChild(child));
-          component.register();
-          if (!customElements.get(tagname)) {
-            component.connectedCallback();
-          }
-          return this.register(component, attributes);
-        }
-        static createElement(name, attributes, children3 = []) {
-          const element = document.createElement(name);
-          for (const [key, value] of Object.entries(attributes)) {
-            if (typeof value === "string") {
-              element.setAttribute(key, value);
-            } else if (value === true) {
-              element.setAttribute(key, key);
-            }
-          }
-          children3.filter((child) => typeof child !== "undefined").forEach((child) => element.appendChild(child));
-          return this.register(element, attributes);
-        }
-        static createText(value, escape = false) {
-          return document.createTextNode(value);
-        }
-        static filter(callback) {
-          const elements = [];
-          this._elements.forEach((temple, html) => {
-            if (callback(temple, html)) {
-              elements.push(temple);
-            }
-          });
-          return elements;
-        }
-        static get(element) {
-          return this._elements.get(element) || null;
-        }
-        static has(element) {
-          return this._elements.has(element);
-        }
-        static map(callback) {
-          const elements = [];
-          this._elements.forEach((temple, html) => {
-            elements.push(callback(temple, html));
-          });
-          return elements;
-        }
-        static register(element, attributes) {
-          if (this.has(element)) {
-            return this.get(element);
-          }
-          const node = new TempleElement_1.default(element, attributes || {});
-          this._elements.set(element, node);
-          return node;
-        }
-      };
-      TempleRegistry5._elements = /* @__PURE__ */ new Map();
-      exports.default = TempleRegistry5;
-    }
-  });
-
-  // ../temple/dist/client/data.js
-  var require_data = __commonJS({
-    "../temple/dist/client/data.js"(exports) {
-      "use strict";
-      Object.defineProperty(exports, "__esModule", { value: true });
-      exports.TempleDataMap = void 0;
-      var TempleDataMap = class {
-        constructor() {
-          if (!window.__APP_DATA__) {
-            window.__APP_DATA__ = {};
-          }
-        }
-        clear() {
-          window.__APP_DATA__ = {};
-          return this;
-        }
-        delete(key) {
-          if (this.has(key)) {
-            delete window.__APP_DATA__[key];
-            return true;
-          }
-          return false;
-        }
-        entries() {
-          return Object.entries(window.__APP_DATA__);
-        }
-        has(key) {
-          return key in window.__APP_DATA__;
-        }
-        get(key) {
-          return window.__APP_DATA__[key];
-        }
-        keys() {
-          return Object.keys(window.__APP_DATA__);
-        }
-        set(key, value) {
-          window.__APP_DATA__[key] = value;
-          return this;
-        }
-        values() {
-          return Object.values(window.__APP_DATA__);
-        }
-      };
-      exports.TempleDataMap = TempleDataMap;
-      var data2 = new TempleDataMap();
-      exports.default = data2;
-    }
-  });
-
-  // ../temple/dist/client/TempleComponent.js
-  var require_TempleComponent = __commonJS({
-    "../temple/dist/client/TempleComponent.js"(exports) {
-      "use strict";
-      var __importDefault = exports && exports.__importDefault || function(mod) {
-        return mod && mod.__esModule ? mod : { "default": mod };
-      };
-      Object.defineProperty(exports, "__esModule", { value: true });
-      var TempleRegistry_1 = __importDefault(require_TempleRegistry());
-      var TempleEmitter_1 = __importDefault(require_TempleEmitter());
-      var data_1 = __importDefault(require_data());
-      var TempleComponent4 = class _TempleComponent extends HTMLElement {
-        constructor() {
-          super(...arguments);
-          this._initiated = false;
-          this._template = null;
-          this._attributes = {};
-          this._props = {};
-          this._children = void 0;
-          this._rendering = false;
-        }
-        static register() {
-          customElements.define(this.component[0], this);
-        }
-        get attr() {
-          return this._attributes;
-        }
-        get element() {
-          if (!TempleRegistry_1.default.has(this)) {
-            return TempleRegistry_1.default.register(this, this._TempleAttributes || {});
-          }
-          return TempleRegistry_1.default.get(this);
-        }
-        get metadata() {
-          const [tagname, classname] = this.constructor.component;
-          return { tagname, classname };
-        }
-        get originalChildren() {
-          return this._children;
-        }
-        get initiated() {
-          return this._initiated;
-        }
-        get props() {
-          return this._props;
-        }
-        set props(props4) {
-          this._props = Object.assign({}, props4);
-          this._attributes = Object.fromEntries(Object.entries(props4).filter((entry) => typeof entry[1] === "string" || entry[1] === true));
-        }
-        adoptedCallback() {
-          this.render();
-        }
-        attributeChangedCallback(name, previous, value) {
-          this.props = Object.assign(Object.assign({}, this.props), { [name]: value });
-          this.render();
-        }
-        connectedCallback() {
-          this.wait();
-        }
-        disconnectedCallback() {
-        }
-        getParentComponent() {
-          let parent = this.parentElement;
-          while (parent) {
-            if (parent instanceof _TempleComponent) {
-              return parent;
-            }
-            parent = parent.parentElement;
-          }
-          return null;
-        }
-        register() {
-          TempleRegistry_1.default.register(this, this._props);
-        }
-        render() {
-          const parent = this.getParentComponent();
-          if (parent && !parent.initiated) {
-            return;
-          } else if (this._rendering) {
-            return;
-          }
-          this._rendering = true;
-          data_1.default.set("current", this);
-          const styles = this.styles();
-          if (!this._template) {
-            this._template = this.template();
-          } else {
-            TempleEmitter_1.default.emit("unmounted", this);
-          }
-          const children3 = this._template().filter(Boolean);
-          if (styles.length === 0) {
-            this.textContent = "";
-            children3.forEach((child) => this.appendChild(child));
-          } else {
-            if (!this.shadowRoot) {
-              this.attachShadow({ mode: "open" });
-            }
-            const shadowRoot = this.shadowRoot;
-            this.textContent = "";
-            shadowRoot.textContent = "";
-            const style = document.createElement("style");
-            style.innerText = styles;
-            shadowRoot.appendChild(style);
-            children3.forEach((child) => {
-              var _a;
-              return (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.appendChild(child);
-            });
-          }
-          data_1.default.delete("current");
-          this._initiated = true;
-          TempleEmitter_1.default.emit("mounted", this);
-          this._rendering = false;
-          return this.shadowRoot ? this.shadowRoot.innerHTML : this.innerHTML;
-        }
-        wait() {
-          if (document.readyState !== "loading") {
-            this._update();
-          } else {
-            const next = () => {
-              this._update();
-              TempleEmitter_1.default.unbind("ready", next);
-            };
-            TempleEmitter_1.default.on("ready", next);
-          }
-        }
-        _toNodeList(value) {
-          if (value instanceof Node) {
-            return [value];
-          }
-          if (Array.isArray(value)) {
-            if (value.every((item) => item instanceof Node)) {
-              return value;
-            }
-          }
-          return [TempleRegistry_1.default.createText(String(value))];
-        }
-        _update() {
-          if (typeof this._children === "undefined") {
-            this._children = Array.from(this.childNodes || []);
-          }
-          const element = this.element;
-          if (element) {
-            this.props = Object.assign({}, element.attributes);
-            this.render();
-          }
-          if (!this._initiated) {
-            this.render();
-          }
-        }
-      };
-      exports.default = TempleComponent4;
-    }
-  });
-
-  // ../temple/dist/client/env.js
-  var require_env = __commonJS({
-    "../temple/dist/client/env.js"(exports) {
-      "use strict";
-      var __importDefault = exports && exports.__importDefault || function(mod) {
-        return mod && mod.__esModule ? mod : { "default": mod };
-      };
-      Object.defineProperty(exports, "__esModule", { value: true });
-      var data_1 = __importDefault(require_data());
-      function env2(name) {
-        const env3 = data_1.default.get("env") || {};
-        if (name) {
-          return env3[name] || null;
-        }
-        return env3;
-      }
-      exports.default = env2;
-    }
-  });
-
-  // ../temple/dist/client/props.js
-  var require_props = __commonJS({
-    "../temple/dist/client/props.js"(exports) {
-      "use strict";
-      var __importDefault = exports && exports.__importDefault || function(mod) {
-        return mod && mod.__esModule ? mod : { "default": mod };
-      };
-      Object.defineProperty(exports, "__esModule", { value: true });
-      exports.default = props4;
-      var data_1 = __importDefault(require_data());
-      function props4(component = null) {
-        if (!component) {
-          component = data_1.default.get("current") || null;
-        }
-        if (component) {
-          if (component === "document") {
-            return data_1.default.get("props") || {};
-          }
-          return component.props;
-        }
-        return {};
-      }
-    }
-  });
-
-  // ../temple/dist/client/classnames.js
-  var require_classnames = __commonJS({
-    "../temple/dist/client/classnames.js"(exports) {
-      "use strict";
-      var __importDefault = exports && exports.__importDefault || function(mod) {
-        return mod && mod.__esModule ? mod : { "default": mod };
-      };
-      Object.defineProperty(exports, "__esModule", { value: true });
-      exports.default = classnames;
-      var props_1 = __importDefault(require_props());
-      function classnames(component = null) {
-        return (0, props_1.default)(component)["class"];
-      }
-    }
-  });
-
-  // ../temple/dist/client/children.js
-  var require_children = __commonJS({
-    "../temple/dist/client/children.js"(exports) {
-      "use strict";
-      var __importDefault = exports && exports.__importDefault || function(mod) {
-        return mod && mod.__esModule ? mod : { "default": mod };
-      };
-      Object.defineProperty(exports, "__esModule", { value: true });
-      exports.innerHTML = innerHTML;
-      exports.default = children3;
-      var data_1 = __importDefault(require_data());
-      function innerHTML(component = null) {
-        const inner = children3(component);
-        const wrapper = document.createElement("template");
-        wrapper.append(...inner);
-        return wrapper.innerHTML;
-      }
-      function children3(component = null) {
-        if (!component) {
-          component = data_1.default.get("current") || null;
-        }
-        return component ? component.originalChildren || [] : [];
-      }
-    }
-  });
-
-  // ../temple/dist/client/signal.js
-  var require_signal = __commonJS({
-    "../temple/dist/client/signal.js"(exports) {
-      "use strict";
-      var __importDefault = exports && exports.__importDefault || function(mod) {
-        return mod && mod.__esModule ? mod : { "default": mod };
-      };
-      Object.defineProperty(exports, "__esModule", { value: true });
-      exports.SignalRegistry = void 0;
-      exports.default = signal2;
-      var Exception_1 = __importDefault(require_Exception());
-      var data_1 = __importDefault(require_data());
-      var SignalRegistry = class _SignalRegistry {
-        static observe(component, value) {
-          const methods = {
-            getter: () => property.raw,
-            setter: (value2) => value2
-          };
-          const property = {
-            raw: value,
-            getter(callback) {
-              methods.getter = callback;
-              return property;
-            },
-            setter(callback) {
-              methods.setter = callback;
-              return property;
-            }
-          };
-          Object.defineProperty(property, "value", {
-            get() {
-              return methods.getter();
-            },
-            set(value2) {
-              const formatted = methods.setter(value2);
-              const rerender = _SignalRegistry.serialize(formatted) !== _SignalRegistry.serialize(property.raw);
-              property.raw = formatted;
-              if (rerender) {
-                component.render();
-              }
-            }
-          });
-          const observer = this._observers.get(component);
-          if (!observer) {
-            this._observers.set(component, {
-              observed: 1,
-              values: [property]
-            });
-          } else {
-            observer.observed++;
-            observer.values.push(property);
-          }
-          return property;
-        }
-        static observer(component) {
-          return this._observers.get(component) || null;
-        }
-        static serialize(value) {
-          return JSON.stringify(value);
-        }
-      };
-      exports.SignalRegistry = SignalRegistry;
-      SignalRegistry._observers = /* @__PURE__ */ new Map();
-      function signal2(value, component = null) {
-        if (!component) {
-          component = data_1.default.get("current") || null;
-        }
-        if (!component) {
-          throw Exception_1.default.for("Signals can only be created within a Temple component");
-        }
-        if (!component.initiated) {
-          return SignalRegistry.observe(component, value);
-        }
-        const observer = SignalRegistry.observer(component);
-        if (!observer) {
-          throw Exception_1.default.for("State mismatch");
-        }
-        const values = observer.values;
-        return values[observer.observed++ % observer.values.length];
-      }
-    }
-  });
-
-  // ../temple/dist/client/helpers.js
-  var require_helpers = __commonJS({
-    "../temple/dist/client/helpers.js"(exports) {
-      "use strict";
-      var __importDefault = exports && exports.__importDefault || function(mod) {
-        return mod && mod.__esModule ? mod : { "default": mod };
-      };
-      Object.defineProperty(exports, "__esModule", { value: true });
-      var TempleRegistry_1 = __importDefault(require_TempleRegistry());
-      var TempleEmitter_1 = __importDefault(require_TempleEmitter());
-      var match = (element, attribute) => {
-        return Array.from(element.querySelectorAll("*")).filter((element2) => {
-          const node = TempleRegistry_1.default.get(element2);
-          return node && node.hasAttribute(attribute);
-        }).map((element2) => TempleRegistry_1.default.get(element2));
-      };
-      function bindAttribute(name, bind) {
-        TempleEmitter_1.default.on("mounted", (e) => {
-          if (!e.detail)
-            return;
-          const element = e.detail;
-          match(element.shadowRoot || element, name).forEach(bind);
-        });
-      }
-      function unbindAttribute(name, bind) {
-        TempleEmitter_1.default.on("unmounted", (e) => {
-          if (!e.detail)
-            return;
-          const element = e.detail;
-          match(element.shadowRoot || element, name).forEach(bind);
-        });
-      }
-      bindAttribute("mount", (element) => {
-        const callback = element.getAttribute("mount");
-        if (typeof callback === "function") {
-          const event = new CustomEvent("mount", {
-            detail: {
-              node: element,
-              target: element.element
-            }
-          });
-          callback(event);
-        }
-      });
-      unbindAttribute("unmount", (element) => {
-        const callback = element.getAttribute("unmount");
-        if (typeof callback === "function") {
-          const event = new CustomEvent("unmount", {
-            detail: {
-              node: element,
-              target: element.element
-            }
-          });
-          callback(event);
-        }
-      });
-      bindAttribute("if", (element) => {
-        const condition = element.getAttribute("if");
-        if (condition === false || condition === "false") {
-          element.element.remove();
-        } else if (typeof condition === "function" && !condition()) {
-          element.element.remove();
-        }
-      });
-      [
-        "click",
-        "dblclick",
-        "mousedown",
-        "mouseup",
-        "mousemove",
-        "mouseover",
-        "mouseout",
-        "wheel",
-        "keydown",
-        "keypress",
-        "keyup",
-        "blur",
-        "change",
-        "contextmenu",
-        "focus",
-        "input",
-        "submit",
-        "invalid",
-        "reset",
-        "search",
-        "select",
-        "copy",
-        "cut",
-        "paste",
-        "drag",
-        "dragstart",
-        "dragend",
-        "dragover",
-        "dragenter",
-        "dragleave",
-        "drop",
-        "scroll",
-        "durationchange",
-        "ended",
-        "error",
-        "loadeddata",
-        "loadedmetadata",
-        "loadstart",
-        "pause",
-        "play",
-        "playing",
-        "progress",
-        "ratechange",
-        "seeked",
-        "seeking",
-        "stalled",
-        "suspend",
-        "timeupdate",
-        "volumechange",
-        "waiting",
-        "animationstart",
-        "animationend",
-        "animationiteration",
-        "transitionend",
-        "toggle"
-      ].forEach((event) => bindAttribute(event, (element) => {
-        const callback = element.getAttribute(event);
-        if (typeof callback === "function") {
-          element.element.removeEventListener(event, callback);
-          element.element.addEventListener(event, callback);
-        }
-      }));
-    }
-  });
-
-  // ../temple/dist/client.js
-  var require_client = __commonJS({
-    "../temple/dist/client.js"(exports) {
-      "use strict";
-      var __createBinding = exports && exports.__createBinding || (Object.create ? function(o, m, k, k2) {
-        if (k2 === void 0) k2 = k;
-        var desc = Object.getOwnPropertyDescriptor(m, k);
-        if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-          desc = { enumerable: true, get: function() {
-            return m[k];
-          } };
-        }
-        Object.defineProperty(o, k2, desc);
-      } : function(o, m, k, k2) {
-        if (k2 === void 0) k2 = k;
-        o[k2] = m[k];
-      });
-      var __setModuleDefault = exports && exports.__setModuleDefault || (Object.create ? function(o, v) {
-        Object.defineProperty(o, "default", { enumerable: true, value: v });
-      } : function(o, v) {
-        o["default"] = v;
-      });
-      var __importStar = exports && exports.__importStar || function(mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) {
-          for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-        }
-        __setModuleDefault(result, mod);
-        return result;
-      };
-      var __importDefault = exports && exports.__importDefault || function(mod) {
-        return mod && mod.__esModule ? mod : { "default": mod };
-      };
-      Object.defineProperty(exports, "__esModule", { value: true });
-      exports.SignalRegistry = exports.TempleException = exports.TempleEmitter = exports.TempleElement = exports.TempleRegistry = exports.TempleComponent = exports.TempleDataMap = exports.emitter = exports.signal = exports.innerHTML = exports.children = exports.classnames = exports.props = exports.env = exports.data = void 0;
-      var Exception_1 = __importDefault(require_Exception());
-      exports.TempleException = Exception_1.default;
-      var TempleComponent_1 = __importDefault(require_TempleComponent());
-      exports.TempleComponent = TempleComponent_1.default;
-      var TempleRegistry_1 = __importDefault(require_TempleRegistry());
-      exports.TempleRegistry = TempleRegistry_1.default;
-      var TempleElement_1 = __importDefault(require_TempleElement());
-      exports.TempleElement = TempleElement_1.default;
-      var TempleEmitter_1 = __importStar(require_TempleEmitter());
-      exports.emitter = TempleEmitter_1.default;
-      Object.defineProperty(exports, "TempleEmitter", { enumerable: true, get: function() {
-        return TempleEmitter_1.TempleEmitter;
-      } });
-      var data_1 = __importStar(require_data());
-      exports.data = data_1.default;
-      Object.defineProperty(exports, "TempleDataMap", { enumerable: true, get: function() {
-        return data_1.TempleDataMap;
-      } });
-      var env_1 = __importDefault(require_env());
-      exports.env = env_1.default;
-      var props_1 = __importDefault(require_props());
-      exports.props = props_1.default;
-      var classnames_1 = __importDefault(require_classnames());
-      exports.classnames = classnames_1.default;
-      var children_1 = __importStar(require_children());
-      exports.children = children_1.default;
-      Object.defineProperty(exports, "innerHTML", { enumerable: true, get: function() {
-        return children_1.innerHTML;
-      } });
-      var signal_1 = __importStar(require_signal());
-      exports.signal = signal_1.default;
-      Object.defineProperty(exports, "SignalRegistry", { enumerable: true, get: function() {
-        return signal_1.SignalRegistry;
-      } });
-      require_helpers();
-    }
-  });
-
-  // ../temple/client.js
-  var require_client2 = __commonJS({
-    "../temple/client.js"(exports, module) {
-      module.exports = { ...require_client() };
-    }
-  });
-
-  // ../temple/index.js
-  var require_temple = __commonJS({
-    "../temple/index.js"(exports, module) {
-      module.exports = { ...require_client() };
-    }
-  });
-
-  // temple-document-client-resolver:/Users/cblanquera/server/projects/ossph/temple/packages/temple-web/src/pages/500.dtml
-  var __exports = {};
-  __export(__exports, {
-    BUILD_ID: () => BUILD_ID,
-    TempleComponent: () => import_client4.TempleComponent,
-    TempleElement: () => import_client4.TempleElement,
-    TempleEmitter: () => import_client4.TempleEmitter,
-    TempleException: () => import_client4.TempleException,
-    TempleRegistry: () => import_client4.TempleRegistry,
-    children: () => import_client4.children,
-    components: () => components,
-    data: () => import_client4.data,
-    emitter: () => import_client4.emitter,
-    props: () => import_client4.props,
-    signal: () => import_client4.signal
-  });
-  var import_client3 = __toESM(require_client2());
-
-  // temple-component-resolver:/Users/cblanquera/server/projects/ossph/temple/packages/temple-web/src/modules/panel/main.tml
-  var import_client = __toESM(require_client2());
-  var Main_fd7f1af6410c5b5c8e1f = class extends import_client.TempleComponent {
-    static component = ["main", "Main_fd7f1af6410c5b5c8e1f"];
-    styles() {
-      return ``;
-    }
-    template() {
-      const props4 = this.props;
-      const children3 = () => this.originalChildren;
-      return () => [
-        import_client.TempleRegistry.createElement("main", {}, [
-          ...this._toNodeList(children3())
-        ]).element
-      ];
-    }
-  };
-
-  // temple-component-resolver:/Users/cblanquera/server/projects/ossph/temple/packages/temple-web/src/modules/i18n/translate.tml
-  var import_client2 = __toESM(require_client2());
-
-  // src/modules/i18n/index.ts
-  var _ = function(phrase, ...variables) {
-    let translation = translate(phrase);
-    for (let i = 0; i < variables.length; i++) {
-      translation = translation.replace("%s", String(variables[i]));
-    }
-    return translation;
-  };
-  var translate = function(phrase) {
-    return phrase;
-  };
-
-  // temple-component-resolver:/Users/cblanquera/server/projects/ossph/temple/packages/temple-web/src/modules/i18n/translate.tml
-  var import_temple = __toESM(require_temple());
-  var Translate_7d25e372f5ffb5e39dad = class extends import_client2.TempleComponent {
-    static component = ["translate", "Translate_7d25e372f5ffb5e39dad"];
-    styles() {
-      return ``;
-    }
-    template() {
-      const { trim = false, p = false, li = false, div = false } = (0, import_temple.props)();
-      const childlist = (0, import_temple.children)();
-      const phrase = [];
-      const variables = [];
-      for (const child of childlist) {
-        if (typeof child === "string") {
-          phrase.push(child);
-        } else if (child instanceof Node && child.textContent) {
-          phrase.push(child.textContent);
-        } else {
-          phrase.push("%s");
-          variables.push(child);
-        }
-      }
-      let words = phrase.join("");
-      if (trim) {
-        words = words.replace(/\s+/, " ").trim();
-      }
-      const chunks = translate(words).split("%s");
-      const translations = [];
-      for (let i = 0; i < chunks.length; i++) {
-        translations.push(document.createTextNode(chunks[i]));
-        if (variables[i]) {
-          translations.push(variables[i]);
-        }
-      }
-      return () => [
-        import_client2.TempleRegistry.createText(`
-    `, false),
-        ...!!p ? [
-          import_client2.TempleRegistry.createText(`
-      `, false),
-          import_client2.TempleRegistry.createElement("p", {}, [
-            ...this._toNodeList(translations)
-          ]).element,
-          import_client2.TempleRegistry.createText(`
-    `, false)
-        ] : !!li ? [
-          ,
-          import_client2.TempleRegistry.createText(`
-      `, false),
-          import_client2.TempleRegistry.createElement("li", {}, [
-            ...this._toNodeList(translations)
-          ]).element,
-          import_client2.TempleRegistry.createText(`
-    `, false)
-        ] : !!div ? [
-          ,
-          import_client2.TempleRegistry.createText(`
-      `, false),
-          import_client2.TempleRegistry.createElement("div", {}, [
-            ...this._toNodeList(translations)
-          ]).element,
-          import_client2.TempleRegistry.createText(`
-    `, false)
-        ] : true ? [
-          ,
-          import_client2.TempleRegistry.createText(`
-      `, false),
-          ...this._toNodeList(translations),
-          import_client2.TempleRegistry.createText(`
-    `, false)
-        ] : []
-      ];
-    }
-  };
-
-  // temple-document-client-resolver:/Users/cblanquera/server/projects/ossph/temple/packages/temple-web/src/pages/500.dtml
-  var import_temple2 = __toESM(require_temple());
-  var import_client4 = __toESM(require_client2());
-  import_client3.emitter.once("ready", () => {
-    const script = document.querySelector("script[data-app]");
-    if (!script) {
-      throw import_client3.TempleException.for("APP_DATA not found");
-    }
-    try {
-      const data2 = atob(script.getAttribute("data-app"));
-      window.__APP_DATA__ = JSON.parse(data2);
-      Object.entries(window.__APP_DATA__).forEach(([key, value]) => {
-        import_client3.data.set(key, value);
-      });
-    } catch (error2) {
-      throw import_client3.TempleException.for("APP_DATA is not a valid JSON");
-    }
-    import_client3.data.set("current", "document");
-    const url = "/temple/500.html";
-    const title = _("Oops... - Temple - The reactive web component template engine.");
-    const description = _("Temple is a template engine hat generates web components and support reactivity.");
-    const { error } = (0, import_temple2.props)();
-    const toggle = (_2) => {
-      document.body.classList.toggle("panel-left-open");
-    };
-    import_client3.data.delete("current");
-    const __BINDINGS__ = { "0": { "class": `head panel-head` }, "1": { "class": `menu fas fa-fw fa-bars`, "click": toggle }, "2": { "href": `/temple` }, "3": { "src": `/temple/temple-icon.png`, "alt": `Temple Logo` }, "5": { "class": `tx-white`, "href": `/temple` }, "7": { "href": `/temple/docs/index.html` }, "8": { "class": `github`, "href": `https://github.com/OSSPhilippines/temple`, "target": `_blank` }, "9": { "class": `fab fa-github` }, "10": { "class": `npm`, "href": `https://www.npmjs.com/package/@ossph/temple`, "target": `_blank` }, "11": { "class": `fab fa-npm text-white` }, "12": { "class": `discord`, "href": `https://discord.gg/open-source-software-ph-905496362982981723`, "target": `_blank` }, "13": { "class": `fab fa-discord text-white` }, "14": { "class": `panel-main` }, "15": { "class": `container` }, "19": { "class": `error` } };
-    for (const element of document.body.querySelectorAll("*")) {
-      const attributes = Object.fromEntries(
-        Array.from(element.attributes).map((attribute) => [
-          attribute.nodeName,
-          attribute.nodeValue.length > 0 ? attribute.nodeValue : true
-        ])
-      );
-      const id = String(import_client3.TempleRegistry.elements.size);
-      if (__BINDINGS__[id]) {
-        Object.assign(attributes, __BINDINGS__[id]);
-        element.TempleAttributes = __BINDINGS__[id];
-      }
-      import_client3.TempleRegistry.register(element, attributes);
-    }
-    customElements.define("panel-main", Main_fd7f1af6410c5b5c8e1f);
-    customElements.define("i18n-translate", Translate_7d25e372f5ffb5e39dad);
-    import_client3.emitter.emit("mounted", document.body);
-  });
-  var components = {
-    "PanelMain_fd7f1af6410c5b5c8e1f": Main_fd7f1af6410c5b5c8e1f,
-    "I18nTranslate_7d25e372f5ffb5e39dad": Translate_7d25e372f5ffb5e39dad
-  };
-  var BUILD_ID = "055f1a2f37d39d4fe92a";
-  return __toCommonJS(__exports);
-})();
+var TempleAPI=(()=>{var $t=Object.create;var ke=Object.defineProperty;var Nt=Object.getOwnPropertyDescriptor;var Rt=Object.getOwnPropertyNames;var qt=Object.getPrototypeOf,It=Object.prototype.hasOwnProperty;var M=(t,e)=>()=>(e||t((e={exports:{}}).exports,e),e.exports),Ht=(t,e)=>{for(var n in e)ke(t,n,{get:e[n],enumerable:!0})},ut=(t,e,n,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let r of Rt(e))!It.call(t,r)&&r!==n&&ke(t,r,{get:()=>e[r],enumerable:!(i=Nt(e,r))||i.enumerable});return t};var P=(t,e,n)=>(n=t!=null?$t(qt(t)):{},ut(e||!t||!t.__esModule?ke(n,"default",{value:t,enumerable:!0}):n,t)),zt=t=>ut(ke({},"__esModule",{value:!0}),t);var pe=M(Ye=>{"use strict";Object.defineProperty(Ye,"__esModule",{value:!0});var Xe=class extends Error{static for(e,...n){return n.forEach(function(i){e=e.replace("%s",i)}),new this(e)}static forErrorsFound(e){let n=new this("Invalid Parameters");return n.errors=e,n}static require(e,n,...i){if(!e){for(let r of i)n=n.replace("%s",r);throw new this(n)}}constructor(e,n=500){super(),this.errors={},this.start=0,this.end=0,this.message=e,this.name=this.constructor.name,this.code=n}withCode(e){return this.code=e,this}withPosition(e,n){return this.start=e,this.end=n,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};Ye.default=Xe});var Ce=M(O=>{"use strict";var Bt=O&&O.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(O,"__esModule",{value:!0});O.match=O.TempleEmitter=O.events=void 0;O.bindAttribute=W;O.unbindAttribute=dt;var ct=Bt(Me());O.events=["click","dblclick","mousedown","mouseup","mousemove","mouseover","mouseout","wheel","keydown","keypress","keyup","blur","change","contextmenu","focus","input","submit","invalid","reset","search","select","copy","cut","paste","drag","dragstart","dragend","dragover","dragenter","dragleave","drop","scroll","durationchange","ended","error","loadeddata","loadedmetadata","loadstart","pause","play","playing","progress","ratechange","seeked","seeking","stalled","suspend","timeupdate","volumechange","waiting","animationstart","animationend","animationiteration","transitionend","toggle"];var Pe=class extends EventTarget{emit(e,n){return this.dispatchEvent(new CustomEvent(e,{detail:n})),this}on(e,n){if(e==="ready"&&document.readyState!=="loading"){let i=new CustomEvent("ready");return setTimeout(()=>n(i),1),this}return this.addEventListener(e,n),this}once(e,n){let i=r=>{this.unbind(e,i),n(r)};return this.on(e,i),this}unbind(e,n){return this.removeEventListener(e,n),this}};O.TempleEmitter=Pe;var Gt=(t,e)=>Array.from(t.querySelectorAll("*")).filter(n=>{let i=ct.default.get(n),r=i&&i.hasAttribute(e)&&!i.hasEvent(e);return r&&i.addEvent(e),r}).map(n=>ct.default.get(n));O.match=Gt;function W(t,e){Se.on("mounted",n=>{if(!n.detail)return;let i=n.detail;(0,O.match)(i.shadowRoot||i,t).forEach(e)})}function dt(t,e){Se.on("unmounted",n=>{if(!n.detail)return;let i=n.detail;(0,O.match)(i.shadowRoot||i,t).forEach(e)})}var Se=new Pe;O.default=(document.onreadystatechange=()=>{document.readyState!=="loading"&&Se.emit("ready")},W("mount",t=>{let e=t.getAttribute("mount");if(typeof e=="function"){let n=new CustomEvent("mount",{detail:{node:t,target:t.element}});e(n)}}),dt("unmount",t=>{let e=t.getAttribute("unmount");if(typeof e=="function"){let n=new CustomEvent("unmount",{detail:{node:t,target:t.element}});e(n)}}),W("connect",t=>{let e=t.getAttribute("connect");if(typeof e=="function"){let n=new CustomEvent("connect",{detail:{node:t,target:t.element}});e(n)}}),W("disconnect",t=>{let e=t.getAttribute("disconnect");if(typeof e=="function"){let n=new CustomEvent("disconnect",{detail:{node:t,target:t.element}});e(n)}}),W("adopt",t=>{let e=t.getAttribute("adopt");if(typeof e=="function"){let n=new CustomEvent("adopt",{detail:{node:t,target:t.element}});e(n)}}),W("if",t=>{let e=t.getAttribute("if");(e===!1||e==="false"||typeof e=="function"&&!e())&&t.element.remove()}),O.events.forEach(t=>W(t,e=>{let n=e.getAttribute(t);typeof n=="function"&&(e.element.removeEventListener(t,n),e.element.addEventListener(t,n))})),Se)});var Qe=M(he=>{"use strict";var Wt=he&&he.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(he,"__esModule",{value:!0});var Ve=Wt(Ce()),Ke=class{get attributes(){return Object.assign({},this._attributes)}get element(){return this._element}get events(){return this._events}constructor(e,n){this._events=new Set,this._element=e,this._attributes=n}addEvent(e){return this._events.add(e),this}getAttribute(e){return this._attributes[e]}hasAttribute(e){return e in this._attributes}hasEvent(e){return this._events.has(e)}removeAttribute(e,n=!1){let i=this.getAttribute(e);return typeof i>"u"?this:(delete this._attributes[e],this._element.removeAttribute(e),n||Ve.default.emit("attribute-remove",{element:this,key:e,previous:i}),this)}setAttribute(e,n,i=!1){if(typeof n>"u")return this.removeAttribute(e,i);let r=this.getAttribute(e);return r===n?this:(this._attributes[e]=n,typeof n=="string"&&this._element.setAttribute(e,n),i||(typeof r>"u"?Ve.default.emit("attribute-create",{element:this,key:e,value:n}):Ve.default.emit("attribute-update",{element:this,key:e,value:n,previous:r})),this)}setAttributes(e,n=!1){for(let[r,d]of Object.entries(e))this.setAttribute(r,d,n);let i=Object.keys(e);for(let r of Object.keys(this._attributes))i.includes(r)||this.removeAttribute(r,n);return this}};he.default=Ke});var Me=M(ge=>{"use strict";var Ut=ge&&ge.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ge,"__esModule",{value:!0});var Zt=Ut(Qe()),ft=document.createElement("textarea"),Jt=t=>(ft.innerHTML=t,ft.value),Oe=class{static get elements(){return this._elements}static createComponent(e,n,i,r=[]){let d=document.createElement("template");d.innerHTML=`<${e}>`;let m=d.content.querySelector(`${e}`);return Object.setPrototypeOf(m,n.prototype),m.constructor=n.constructor,m.constructor.component=n.component,m.register(i,r),m.element}static createElement(e,n,i=[]){let r=document.createElement(e);for(let[d,_]of Object.entries(n))typeof _=="string"?r.setAttribute(d,_):_===!0&&r.setAttribute(d,d);return i.filter(d=>typeof d<"u").forEach(d=>r.appendChild(d)),this.register(r,n)}static createText(e,n=!0){return document.createTextNode(Jt(e))}static filter(e){let n=[];return this._elements.forEach((i,r)=>{e(i,r)&&n.push(i)}),n}static get(e){return this._elements.get(e)||null}static has(e){return this._elements.has(e)}static map(e){let n=[];return this._elements.forEach((i,r)=>{n.push(e(i,r))}),n}static register(e,n){if(this.has(e))return this.get(e);let i=new Zt.default(e,n||{});return this._elements.set(e,i),i}};Oe._elements=new Map;ge.default=Oe});var Q=M(me=>{"use strict";Object.defineProperty(me,"__esModule",{value:!0});me.TempleDataMap=void 0;var De=class{constructor(){window.__APP_DATA__||(window.__APP_DATA__={})}clear(){return window.__APP_DATA__={},this}delete(e){return this.has(e)?(delete window.__APP_DATA__[e],!0):!1}entries(){return Object.entries(window.__APP_DATA__)}has(e){return e in window.__APP_DATA__}get(e){return window.__APP_DATA__[e]}keys(){return Object.keys(window.__APP_DATA__)}set(e,n){return window.__APP_DATA__[e]=n,this}values(){return Object.values(window.__APP_DATA__)}};me.TempleDataMap=De;var Xt=new De;me.default=Xt});var ht=M(be=>{"use strict";var $e=be&&be.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(be,"__esModule",{value:!0});var pt=$e(pe()),U=$e(Me()),Z=$e(Ce()),je=$e(Q()),et=class t extends HTMLElement{static register(){customElements.define(this.component[0],this)}get attr(){return Object.fromEntries(Array.from(this.attributes).map(e=>[e.name,e.value]))}get element(){if(!U.default.has(this))throw pt.default.for("Component not mapped.");return U.default.get(this)}get metadata(){let[e,n]=this.constructor.component;return{tagname:e,classname:n}}get originalChildren(){return this._children}get initiated(){return this._initiated}get props(){return this.getAttributes()}get virtual(){return this._virtual}set props(e){this.setAttributes(e)}constructor(){if(super(),this._initiated=!1,this._template=null,this._children=void 0,this._rendering=!1,this._observer=null,this._virtual=!1,!U.default.has(this))throw pt.default.for("Component not mapped.")}adoptedCallback(){this.render(),Z.default.emit("adopt",this)}connectedCallback(){this.wait(),Z.default.emit("connect",this)}disconnectedCallback(){Z.default.emit("disconnect",this)}getAttribute(e){return this.element.getAttribute(e)}getAttributes(){return Object.assign({},this.element.attributes)}getParentComponent(){let e=this.parentElement;for(;e;){if(e instanceof t)return e;e=e.parentElement}return null}hasAttribute(e){return this.element.hasAttribute(e)}register(e={},n=[]){U.default.has(this)?U.default.get(this).setAttributes(e):U.default.register(this,e);for(let[i,r]of Object.entries(e))typeof r=="string"?super.setAttribute(i,r):r===!0&&super.setAttribute(i,i);this._children=n,this._virtual=!0,this.connectedCallback()}removeAttribute(e){this.hasAttribute(e)&&this.element.removeAttribute(e),super.hasAttribute(e)&&super.removeAttribute(e)}render(){let e=this.getParentComponent();if(e&&!e.initiated)return;if(this._rendering)return;this._rendering=!0;let n=je.default.get("current");je.default.set("current",this);let i=this.styles();this._template?Z.default.emit("unmounted",this):this._template=this.template();let r=this._template().filter(Boolean);if(i.length===0)this.textContent="",r.forEach(d=>this.appendChild(d));else{this.shadowRoot||this.attachShadow({mode:"open"});let d=this.shadowRoot;this.textContent="",d.textContent="";let _=document.createElement("style");_.innerText=i,d.appendChild(_),r.forEach(m=>{var y;return(y=this.shadowRoot)===null||y===void 0?void 0:y.appendChild(m)})}return n?je.default.set("current",n):je.default.delete("current"),this._initiated=!0,this._rendering=!1,Z.default.emit("mounted",this),this.shadowRoot?this.shadowRoot.innerHTML:this.innerHTML}setAttribute(e,n){this.element.setAttribute(e,n),(typeof n=="string"||n===!0)&&super.setAttribute(e,n)}setAttributes(e){this.element.setAttributes(e)}wait(){if(document.readyState!=="loading")this._update();else{let e=()=>{this._update(),Z.default.unbind("ready",e)};Z.default.on("ready",e)}}_toNodeList(e){return e instanceof Node?[e]:Array.isArray(e)&&e.every(n=>n instanceof Node)?e:[U.default.createText(String(e))]}_update(){typeof this._children>"u"&&(this._children=Array.from(this.childNodes||[])),this._initiated||this.render()}};be.default=et});var ee=M(_e=>{"use strict";var gt=_e&&_e.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(_e,"__esModule",{value:!0});_e.default=Kt;var Yt=gt(pe()),Vt=gt(Q());function Kt(t=null,e=!1){if(!t&&(t=Vt.default.get("current"),!t)){if(!e)throw Yt.default.for("Not called within a Temple component");return null}return t}});var mt=M(ve=>{"use strict";var Qt=ve&&ve.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ve,"__esModule",{value:!0});var en=Qt(Q());function tn(t){let e=en.default.get("env")||{};return t?e[t]||null:e}ve.default=tn});var tt=M(ye=>{"use strict";var bt=ye&&ye.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ye,"__esModule",{value:!0});ye.default=sn;var nn=bt(ee()),rn=bt(Q());function sn(t=null){let e=(0,nn.default)(t,!0);return typeof e=="string"?rn.default.get("props")||{}:e?e.props:{}}});var vt=M(te=>{"use strict";var _t=te&&te.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(te,"__esModule",{value:!0});te.classlist=on;te.default=un;var an=_t(ee()),ln=_t(tt());function on(t=null){var e;if(t==="body")return document.body.classList;if(t==="head")return document.head.classList;if(t==="document")return(e=document.body.parentElement)===null||e===void 0?void 0:e.classList;let n=(0,an.default)(t);return n?.classList}function un(t=null){return(0,ln.default)(t).class}});var yt=M(J=>{"use strict";var cn=J&&J.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(J,"__esModule",{value:!0});J.innerHTML=fn;J.innerText=pn;J.default=nt;var dn=cn(ee());function fn(t=null){let e=nt(t),n=document.createElement("template");return n.append(...e.map(i=>i.cloneNode(!0))),n.innerHTML}function pn(t=null){let e=nt(t),n=document.createElement("template");return n.append(...e.map(i=>i.cloneNode(!0))),n.innerText}function nt(t=null){let e=(0,dn.default)(t,!0);return typeof e!="string"&&e?e.originalChildren||[]:[]}});var wt=M(X=>{"use strict";var xt=X&&X.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(X,"__esModule",{value:!0});X.SignalRegistry=void 0;X.default=mn;var hn=xt(ee()),gn=xt(pe()),ne=class t{static observe(e,n){let i={getter:()=>d.raw,setter:m=>m},r=new Set,d={raw:n,change(m){r.add(m)},getter(m){return i.getter=m,d},setter(m){return i.setter=m,d}};Object.defineProperty(d,"value",{get(){return i.getter()},set(m){let y=i.setter(m),w=t.serialize(y)!==t.serialize(d.raw);d.raw=y,w&&(r.forEach(b=>b(y)),e.render())}});let _=this._observers.get(e);return _?(_.observed++,_.values.push(d)):this._observers.set(e,{observed:1,values:[d]}),d}static observer(e){return this._observers.get(e)||null}static serialize(e){return JSON.stringify(e)}};X.SignalRegistry=ne;ne._observers=new Map;function mn(t,e=null){let n=(0,hn.default)(e);if(!n.initiated)return ne.observe(n,t);let i=ne.observer(n);if(!i)throw gn.default.for("Signal state mismatch");return i.values[i.observed++%i.values.length]}});var st=M(g=>{"use strict";var bn=g&&g.__createBinding||(Object.create?function(t,e,n,i){i===void 0&&(i=n);var r=Object.getOwnPropertyDescriptor(e,n);(!r||("get"in r?!e.__esModule:r.writable||r.configurable))&&(r={enumerable:!0,get:function(){return e[n]}}),Object.defineProperty(t,i,r)}:function(t,e,n,i){i===void 0&&(i=n),t[i]=e[n]}),_n=g&&g.__setModuleDefault||(Object.create?function(t,e){Object.defineProperty(t,"default",{enumerable:!0,value:e})}:function(t,e){t.default=e}),xe=g&&g.__importStar||function(t){if(t&&t.__esModule)return t;var e={};if(t!=null)for(var n in t)n!=="default"&&Object.prototype.hasOwnProperty.call(t,n)&&bn(e,t,n);return _n(e,t),e},Y=g&&g.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(g,"__esModule",{value:!0});g.SignalRegistry=g.TempleException=g.TempleEmitter=g.TempleElement=g.TempleRegistry=g.TempleComponent=g.TempleDataMap=g.emitter=g.signal=g.innerHTML=g.innerText=g.children=g.classnames=g.classlist=g.props=g.env=g.data=g.component=void 0;var vn=Y(pe());g.TempleException=vn.default;var yn=Y(ht());g.TempleComponent=yn.default;var xn=Y(Me());g.TempleRegistry=xn.default;var wn=Y(Qe());g.TempleElement=wn.default;var At=xe(Ce());g.emitter=At.default;Object.defineProperty(g,"TempleEmitter",{enumerable:!0,get:function(){return At.TempleEmitter}});var An=Y(ee());g.component=An.default;var Tt=xe(Q());g.data=Tt.default;Object.defineProperty(g,"TempleDataMap",{enumerable:!0,get:function(){return Tt.TempleDataMap}});var Tn=Y(mt());g.env=Tn.default;var En=Y(tt());g.props=En.default;var Et=xe(vt());g.classnames=Et.default;Object.defineProperty(g,"classlist",{enumerable:!0,get:function(){return Et.classlist}});var rt=xe(yt());g.children=rt.default;Object.defineProperty(g,"innerHTML",{enumerable:!0,get:function(){return rt.innerHTML}});Object.defineProperty(g,"innerText",{enumerable:!0,get:function(){return rt.innerText}});var Lt=xe(wt());g.signal=Lt.default;Object.defineProperty(g,"SignalRegistry",{enumerable:!0,get:function(){return Lt.SignalRegistry}})});var q=M((Wn,Ft)=>{Ft.exports={...st()}});var z=M((Un,kt)=>{kt.exports={...st()}});var St=M((Kn,He)=>{var Ln=typeof window<"u"?window:typeof WorkerGlobalScope<"u"&&self instanceof WorkerGlobalScope?self:{};var c=function(t){var e=/(?:^|\s)lang(?:uage)?-([\w-]+)(?=\s|$)/i,n=0,i={},r={manual:t.Prism&&t.Prism.manual,disableWorkerMessageHandler:t.Prism&&t.Prism.disableWorkerMessageHandler,util:{encode:function a(s){return s instanceof d?new d(s.type,a(s.content),s.alias):Array.isArray(s)?s.map(a):s.replace(/&/g,"&").replace(/"u")return null;if("currentScript"in document)return document.currentScript;try{throw new Error}catch(o){var a=(/at [^(\r\n]*\((.*):[^:]+:[^:]+\)$/i.exec(o.stack)||[])[1];if(a){var s=document.getElementsByTagName("script");for(var l in s)if(s[l].src==a)return s[l]}return null}},isActive:function(a,s,l){for(var o="no-"+s;a;){var u=a.classList;if(u.contains(s))return!0;if(u.contains(o))return!1;a=a.parentElement}return!!l}},languages:{plain:i,plaintext:i,text:i,txt:i,extend:function(a,s){var l=r.util.clone(r.languages[a]);for(var o in s)l[o]=s[o];return l},insertBefore:function(a,s,l,o){o=o||r.languages;var u=o[a],h={};for(var v in u)if(u.hasOwnProperty(v)){if(v==s)for(var p in l)l.hasOwnProperty(p)&&(h[p]=l[p]);l.hasOwnProperty(v)||(h[v]=u[v])}var E=o[a];return o[a]=h,r.languages.DFS(r.languages,function(C,I){I===E&&C!=a&&(this[C]=h)}),h},DFS:function a(s,l,o,u){u=u||{};var h=r.util.objId;for(var v in s)if(s.hasOwnProperty(v)){l.call(s,v,s[v],o||v);var p=s[v],E=r.util.type(p);E==="Object"&&!u[h(p)]?(u[h(p)]=!0,a(p,l,null,u)):E==="Array"&&!u[h(p)]&&(u[h(p)]=!0,a(p,l,v,u))}}},plugins:{},highlightAll:function(a,s){r.highlightAllUnder(document,a,s)},highlightAllUnder:function(a,s,l){var o={callback:l,container:a,selector:'code[class*="language-"], [class*="language-"] code, code[class*="lang-"], [class*="lang-"] code'};r.hooks.run("before-highlightall",o),o.elements=Array.prototype.slice.apply(o.container.querySelectorAll(o.selector)),r.hooks.run("before-all-elements-highlight",o);for(var u=0,h;h=o.elements[u++];)r.highlightElement(h,s===!0,o.callback)},highlightElement:function(a,s,l){var o=r.util.getLanguage(a),u=r.languages[o];r.util.setLanguage(a,o);var h=a.parentElement;h&&h.nodeName.toLowerCase()==="pre"&&r.util.setLanguage(h,o);var v=a.textContent,p={element:a,language:o,grammar:u,code:v};function E(I){p.highlightedCode=I,r.hooks.run("before-insert",p),p.element.innerHTML=p.highlightedCode,r.hooks.run("after-highlight",p),r.hooks.run("complete",p),l&&l.call(p.element)}if(r.hooks.run("before-sanity-check",p),h=p.element.parentElement,h&&h.nodeName.toLowerCase()==="pre"&&!h.hasAttribute("tabindex")&&h.setAttribute("tabindex","0"),!p.code){r.hooks.run("complete",p),l&&l.call(p.element);return}if(r.hooks.run("before-highlight",p),!p.grammar){E(r.util.encode(p.code));return}if(s&&t.Worker){var C=new Worker(r.filename);C.onmessage=function(I){E(I.data)},C.postMessage(JSON.stringify({language:p.language,code:p.code,immediateClose:!0}))}else E(r.highlight(p.code,p.grammar,p.language))},highlight:function(a,s,l){var o={code:a,grammar:s,language:l};if(r.hooks.run("before-tokenize",o),!o.grammar)throw new Error('The language "'+o.language+'" has no grammar.');return o.tokens=r.tokenize(o.code,o.grammar),r.hooks.run("after-tokenize",o),d.stringify(r.util.encode(o.tokens),o.language)},tokenize:function(a,s){var l=s.rest;if(l){for(var o in l)s[o]=l[o];delete s.rest}var u=new y;return w(u,u.head,a),m(a,u,s,u.head,0),T(u)},hooks:{all:{},add:function(a,s){var l=r.hooks.all;l[a]=l[a]||[],l[a].push(s)},run:function(a,s){var l=r.hooks.all[a];if(!(!l||!l.length))for(var o=0,u;u=l[o++];)u(s)}},Token:d};t.Prism=r;function d(a,s,l,o){this.type=a,this.content=s,this.alias=l,this.length=(o||"").length|0}d.stringify=function a(s,l){if(typeof s=="string")return s;if(Array.isArray(s)){var o="";return s.forEach(function(E){o+=a(E,l)}),o}var u={type:s.type,content:a(s.content,l),tag:"span",classes:["token",s.type],attributes:{},language:l},h=s.alias;h&&(Array.isArray(h)?Array.prototype.push.apply(u.classes,h):u.classes.push(h)),r.hooks.run("wrap",u);var v="";for(var p in u.attributes)v+=" "+p+'="'+(u.attributes[p]||"").replace(/"/g,""")+'"';return"<"+u.tag+' class="'+u.classes.join(" ")+'"'+v+">"+u.content+""};function _(a,s,l,o){a.lastIndex=s;var u=a.exec(l);if(u&&o&&u[1]){var h=u[1].length;u.index+=h,u[0]=u[0].slice(h)}return u}function m(a,s,l,o,u,h){for(var v in l)if(!(!l.hasOwnProperty(v)||!l[v])){var p=l[v];p=Array.isArray(p)?p:[p];for(var E=0;E=h.reach);R+=f.value.length,f=f.next){var H=f.value;if(s.length>a.length)return;if(!(H instanceof d)){var B=1,j;if(Ge){if(j=_(K,R,a,V),!j||j.index>=a.length)break;var Ee=j.index,Dt=j.index+j[0].length,G=R;for(G+=f.value.length;Ee>=G;)f=f.next,G+=f.value.length;if(G-=f.value.length,R=G,f.value instanceof d)continue;for(var fe=f;fe!==s.tail&&(Gh.reach&&(h.reach=Ze);var Fe=f.prev;Ue&&(Fe=w(s,Fe,Ue),R+=Ue.length),b(s,Fe,B);var jt=new d(v,I?r.tokenize(Le,I):Le,lt,Le);if(f=w(s,Fe,jt),ot&&w(s,f,ot),B>1){var Je={cause:v+","+E,reach:Ze};m(a,s,l,f.prev,R,Je),h&&Je.reach>h.reach&&(h.reach=Je.reach)}}}}}}function y(){var a={value:null,prev:null,next:null},s={value:null,prev:a,next:null};a.next=s,this.head=a,this.tail=s,this.length=0}function w(a,s,l){var o=s.next,u={value:l,prev:s,next:o};return s.next=u,o.prev=u,a.length++,u}function b(a,s,l){for(var o=s.next,u=0;u/,greedy:!0},prolog:{pattern:/<\?[\s\S]+?\?>/,greedy:!0},doctype:{pattern:/"'[\]]|"[^"]*"|'[^']*')+(?:\[(?:[^<"'\]]|"[^"]*"|'[^']*'|<(?!!--)|)*\]\s*)?>/i,greedy:!0,inside:{"internal-subset":{pattern:/(^[^\[]*\[)[\s\S]+(?=\]>$)/,lookbehind:!0,greedy:!0,inside:null},string:{pattern:/"[^"]*"|'[^']*'/,greedy:!0},punctuation:/^$|[[\]]/,"doctype-tag":/^DOCTYPE/i,name:/[^\s<>'"]+/}},cdata:{pattern://i,greedy:!0},tag:{pattern:/<\/?(?!\d)[^\s>\/=$<%]+(?:\s(?:\s*[^\s>\/=]+(?:\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))|(?=[\s/>])))+)?\s*\/?>/,greedy:!0,inside:{tag:{pattern:/^<\/?[^\s>\/]+/,inside:{punctuation:/^<\/?/,namespace:/^[^\s>\/:]+:/}},"special-attr":[],"attr-value":{pattern:/=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+)/,inside:{punctuation:[{pattern:/^=/,alias:"attr-equals"},{pattern:/^(\s*)["']|["']$/,lookbehind:!0}]}},punctuation:/\/?>/,"attr-name":{pattern:/[^\s>\/]+/,inside:{namespace:/^[^\s>\/:]+:/}}}},entity:[{pattern:/&[\da-z]{1,8};/i,alias:"named-entity"},/&#x?[\da-f]{1,8};/i]};c.languages.markup.tag.inside["attr-value"].inside.entity=c.languages.markup.entity;c.languages.markup.doctype.inside["internal-subset"].inside=c.languages.markup;c.hooks.add("wrap",function(t){t.type==="entity"&&(t.attributes.title=t.content.replace(/&/,"&"))});Object.defineProperty(c.languages.markup.tag,"addInlined",{value:function(e,n){var i={};i["language-"+n]={pattern:/(^$)/i,lookbehind:!0,inside:c.languages[n]},i.cdata=/^$/i;var r={"included-cdata":{pattern://i,inside:i}};r["language-"+n]={pattern:/[\s\S]+/,inside:c.languages[n]};var d={};d[e]={pattern:RegExp(/(<__[^>]*>)(?:))*\]\]>|(?!)/.source.replace(/__/g,function(){return e}),"i"),lookbehind:!0,greedy:!0,inside:r},c.languages.insertBefore("markup","cdata",d)}});Object.defineProperty(c.languages.markup.tag,"addAttribute",{value:function(t,e){c.languages.markup.tag.inside["special-attr"].push({pattern:RegExp(/(^|["'\s])/.source+"(?:"+t+")"+/\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))/.source,"i"),lookbehind:!0,inside:{"attr-name":/^[^\s=]+/,"attr-value":{pattern:/=[\s\S]+/,inside:{value:{pattern:/(^=\s*(["']|(?!["'])))\S[\s\S]*(?=\2$)/,lookbehind:!0,alias:[e,"language-"+e],inside:c.languages[e]},punctuation:[{pattern:/^=/,alias:"attr-equals"},/"|'/]}}}})}});c.languages.html=c.languages.markup;c.languages.mathml=c.languages.markup;c.languages.svg=c.languages.markup;c.languages.xml=c.languages.extend("markup",{});c.languages.ssml=c.languages.xml;c.languages.atom=c.languages.xml;c.languages.rss=c.languages.xml;(function(t){var e=/(?:"(?:\\(?:\r\n|[\s\S])|[^"\\\r\n])*"|'(?:\\(?:\r\n|[\s\S])|[^'\\\r\n])*')/;t.languages.css={comment:/\/\*[\s\S]*?\*\//,atrule:{pattern:RegExp("@[\\w-](?:"+/[^;{\s"']|\s+(?!\s)/.source+"|"+e.source+")*?"+/(?:;|(?=\s*\{))/.source),inside:{rule:/^@[\w-]+/,"selector-function-argument":{pattern:/(\bselector\s*\(\s*(?![\s)]))(?:[^()\s]|\s+(?![\s)])|\((?:[^()]|\([^()]*\))*\))+(?=\s*\))/,lookbehind:!0,alias:"selector"},keyword:{pattern:/(^|[^\w-])(?:and|not|only|or)(?![\w-])/,lookbehind:!0}}},url:{pattern:RegExp("\\burl\\((?:"+e.source+"|"+/(?:[^\\\r\n()"']|\\[\s\S])*/.source+")\\)","i"),greedy:!0,inside:{function:/^url/i,punctuation:/^\(|\)$/,string:{pattern:RegExp("^"+e.source+"$"),alias:"url"}}},selector:{pattern:RegExp(`(^|[{}\\s])[^{}\\s](?:[^{};"'\\s]|\\s+(?![\\s{])|`+e.source+")*(?=\\s*\\{)"),lookbehind:!0},string:{pattern:e,greedy:!0},property:{pattern:/(^|[^-\w\xA0-\uFFFF])(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*(?=\s*:)/i,lookbehind:!0},important:/!important\b/i,function:{pattern:/(^|[^-a-z0-9])[-a-z0-9]+(?=\()/i,lookbehind:!0},punctuation:/[(){};:,]/},t.languages.css.atrule.inside.rest=t.languages.css;var n=t.languages.markup;n&&(n.tag.addInlined("style","css"),n.tag.addAttribute("style","css"))})(c);c.languages.clike={comment:[{pattern:/(^|[^\\])\/\*[\s\S]*?(?:\*\/|$)/,lookbehind:!0,greedy:!0},{pattern:/(^|[^\\:])\/\/.*/,lookbehind:!0,greedy:!0}],string:{pattern:/(["'])(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/,greedy:!0},"class-name":{pattern:/(\b(?:class|extends|implements|instanceof|interface|new|trait)\s+|\bcatch\s+\()[\w.\\]+/i,lookbehind:!0,inside:{punctuation:/[.\\]/}},keyword:/\b(?:break|catch|continue|do|else|finally|for|function|if|in|instanceof|new|null|return|throw|try|while)\b/,boolean:/\b(?:false|true)\b/,function:/\b\w+(?=\()/,number:/\b0x[\da-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:e[+-]?\d+)?/i,operator:/[<>]=?|[!=]=?=?|--?|\+\+?|&&?|\|\|?|[?*/~^%]/,punctuation:/[{}[\];(),.:]/};c.languages.javascript=c.languages.extend("clike",{"class-name":[c.languages.clike["class-name"],{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$A-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\.(?:constructor|prototype))/,lookbehind:!0}],keyword:[{pattern:/((?:^|\})\s*)catch\b/,lookbehind:!0},{pattern:/(^|[^.]|\.\.\.\s*)\b(?:as|assert(?=\s*\{)|async(?=\s*(?:function\b|\(|[$\w\xA0-\uFFFF]|$))|await|break|case|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally(?=\s*(?:\{|$))|for|from(?=\s*(?:['"]|$))|function|(?:get|set)(?=\s*(?:[#\[$\w\xA0-\uFFFF]|$))|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)\b/,lookbehind:!0}],function:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*(?:\.\s*(?:apply|bind|call)\s*)?\()/,number:{pattern:RegExp(/(^|[^\w$])/.source+"(?:"+(/NaN|Infinity/.source+"|"+/0[bB][01]+(?:_[01]+)*n?/.source+"|"+/0[oO][0-7]+(?:_[0-7]+)*n?/.source+"|"+/0[xX][\dA-Fa-f]+(?:_[\dA-Fa-f]+)*n?/.source+"|"+/\d+(?:_\d+)*n/.source+"|"+/(?:\d+(?:_\d+)*(?:\.(?:\d+(?:_\d+)*)?)?|\.\d+(?:_\d+)*)(?:[Ee][+-]?\d+(?:_\d+)*)?/.source)+")"+/(?![\w$])/.source),lookbehind:!0},operator:/--|\+\+|\*\*=?|=>|&&=?|\|\|=?|[!=]==|<<=?|>>>?=?|[-+*/%&|^!=<>]=?|\.{3}|\?\?=?|\?\.?|[~:]/});c.languages.javascript["class-name"][0].pattern=/(\b(?:class|extends|implements|instanceof|interface|new)\s+)[\w.\\]+/;c.languages.insertBefore("javascript","keyword",{regex:{pattern:RegExp(/((?:^|[^$\w\xA0-\uFFFF."'\])\s]|\b(?:return|yield))\s*)/.source+/\//.source+"(?:"+/(?:\[(?:[^\]\\\r\n]|\\.)*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}/.source+"|"+/(?:\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.)*\])*\])*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}v[dgimyus]{0,7}/.source+")"+/(?=(?:\s|\/\*(?:[^*]|\*(?!\/))*\*\/)*(?:$|[\r\n,.;:})\]]|\/\/))/.source),lookbehind:!0,greedy:!0,inside:{"regex-source":{pattern:/^(\/)[\s\S]+(?=\/[a-z]*$)/,lookbehind:!0,alias:"language-regex",inside:c.languages.regex},"regex-delimiter":/^\/|\/$/,"regex-flags":/^[a-z]+$/}},"function-variable":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*[=:]\s*(?:async\s*)?(?:\bfunction\b|(?:\((?:[^()]|\([^()]*\))*\)|(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)\s*=>))/,alias:"function"},parameter:[{pattern:/(function(?:\s+(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)?\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\))/,lookbehind:!0,inside:c.languages.javascript},{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$a-z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*=>)/i,lookbehind:!0,inside:c.languages.javascript},{pattern:/(\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*=>)/,lookbehind:!0,inside:c.languages.javascript},{pattern:/((?:\b|\s|^)(?!(?:as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)(?![$\w\xA0-\uFFFF]))(?:(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*)\(\s*|\]\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*\{)/,lookbehind:!0,inside:c.languages.javascript}],constant:/\b[A-Z](?:[A-Z_]|\dx?)*\b/});c.languages.insertBefore("javascript","string",{hashbang:{pattern:/^#!.*/,greedy:!0,alias:"comment"},"template-string":{pattern:/`(?:\\[\s\S]|\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}|(?!\$\{)[^\\`])*`/,greedy:!0,inside:{"template-punctuation":{pattern:/^`|`$/,alias:"string"},interpolation:{pattern:/((?:^|[^\\])(?:\\{2})*)\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}/,lookbehind:!0,inside:{"interpolation-punctuation":{pattern:/^\$\{|\}$/,alias:"punctuation"},rest:c.languages.javascript}},string:/[\s\S]+/}},"string-property":{pattern:/((?:^|[,{])[ \t]*)(["'])(?:\\(?:\r\n|[\s\S])|(?!\2)[^\\\r\n])*\2(?=\s*:)/m,lookbehind:!0,greedy:!0,alias:"property"}});c.languages.insertBefore("javascript","operator",{"literal-property":{pattern:/((?:^|[,{])[ \t]*)(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*:)/m,lookbehind:!0,alias:"property"}});c.languages.markup&&(c.languages.markup.tag.addInlined("script","javascript"),c.languages.markup.tag.addAttribute(/on(?:abort|blur|change|click|composition(?:end|start|update)|dblclick|error|focus(?:in|out)?|key(?:down|up)|load|mouse(?:down|enter|leave|move|out|over|up)|reset|resize|scroll|select|slotchange|submit|unload|wheel)/.source,"javascript"));c.languages.js=c.languages.javascript;(function(){if(typeof c>"u"||typeof document>"u")return;Element.prototype.matches||(Element.prototype.matches=Element.prototype.msMatchesSelector||Element.prototype.webkitMatchesSelector);var t="Loading\u2026",e=function(L,x){return"\u2716 Error "+L+" while fetching file: "+x},n="\u2716 Error: File does not exist or is empty",i={js:"javascript",py:"python",rb:"ruby",ps1:"powershell",psm1:"powershell",sh:"bash",bat:"batch",h:"c",tex:"latex"},r="data-src-status",d="loading",_="loaded",m="failed",y="pre[data-src]:not(["+r+'="'+_+'"]):not(['+r+'="'+d+'"])';function w(L,x,F){var a=new XMLHttpRequest;a.open("GET",L,!0),a.onreadystatechange=function(){a.readyState==4&&(a.status<400&&a.responseText?x(a.responseText):a.status>=400?F(e(a.status,a.statusText)):F(n))},a.send(null)}function b(L){var x=/^\s*(\d+)\s*(?:(,)\s*(?:(\d+)\s*)?)?$/.exec(L||"");if(x){var F=Number(x[1]),a=x[2],s=x[3];return a?s?[F,Number(s)]:[F,void 0]:[F,F]}}c.hooks.add("before-highlightall",function(L){L.selector+=", "+y}),c.hooks.add("before-sanity-check",function(L){var x=L.element;if(x.matches(y)){L.code="",x.setAttribute(r,d);var F=x.appendChild(document.createElement("CODE"));F.textContent=t;var a=x.getAttribute("data-src"),s=L.language;if(s==="none"){var l=(/\.(\w+)$/.exec(a)||[,"none"])[1];s=i[l]||l}c.util.setLanguage(F,s),c.util.setLanguage(x,s);var o=c.plugins.autoloader;o&&o.loadLanguages(s),w(a,function(u){x.setAttribute(r,_);var h=b(x.getAttribute("data-range"));if(h){var v=u.split(/\r\n?|\n/g),p=h[0],E=h[1]==null?v.length:h[1];p<0&&(p+=v.length),p=Math.max(0,Math.min(p-1,v.length)),E<0&&(E+=v.length),E=Math.max(0,Math.min(E,v.length)),u=v.slice(p,E).join(`
+`),x.hasAttribute("data-start")||x.setAttribute("data-start",String(p+1))}F.textContent=u,c.highlightElement(F)},function(u){x.setAttribute(r,m),F.textContent=u})}}),c.plugins.fileHighlight={highlight:function(x){for(var F=(x||document).querySelectorAll(y),a=0,s;s=F[a++];)c.highlightElement(s)}};var T=!1;c.fileHighlight=function(){T||(console.warn("Prism.fileHighlight is deprecated. Use `Prism.plugins.fileHighlight.highlight` instead."),T=!0),c.plugins.fileHighlight.highlight.apply(this,arguments)}})()});var Sn={};Ht(Sn,{BUILD_ID:()=>Pn,TempleComponent:()=>S.TempleComponent,TempleElement:()=>S.TempleElement,TempleEmitter:()=>S.TempleEmitter,TempleException:()=>S.TempleException,TempleRegistry:()=>S.TempleRegistry,children:()=>S.children,components:()=>kn,data:()=>S.data,emitter:()=>S.emitter,props:()=>S.props,signal:()=>S.signal});var $=P(q());var Pt=P(q()),N=P(z()),re=class extends Pt.TempleComponent{static component=["layout","Layout_9f3ab204ce271feaf6f7"];styles(){return""}template(){(0,N.classlist)().add("relative","w-full","vh","scroll-hidden");let e=(0,N.children)(),n=e.find(b=>b.nodeName.endsWith("PANEL-MAIN")),i=e.find(b=>b.nodeName.endsWith("PANEL-HEAD")),r=e.find(b=>b.nodeName.endsWith("PANEL-FOOT")),d=e.find(b=>b.nodeName.endsWith("PANEL-LEFT")),_=e.find(b=>b.nodeName.endsWith("PANEL-RIGHT")),m={head:!!i,foot:!!r,left:!!d,right:!!_},y=new Set,w={left:!1,right:!1,change:b=>y.add(b)};return n&&N.TempleRegistry.get(n).setAttribute("show",w).setAttribute("layout",m),i&&N.TempleRegistry.get(i).setAttribute("show",w).setAttribute("layout",m),r&&N.TempleRegistry.get(r).setAttribute("show",w).setAttribute("layout",m),d&&N.TempleRegistry.get(d).setAttribute("show",w).setAttribute("layout",m),_&&N.TempleRegistry.get(_).setAttribute("show",w).setAttribute("layout",m),this.toggle=b=>{w[b]=!w[b],y.forEach(T=>T())},()=>[N.TempleRegistry.createText(`
+`,!1),...this._toNodeList(e)]}};var we=P(q()),Ne=P(z()),se=class extends we.TempleComponent{static component=["head","Head_2bf4dff19bc88ba4138b"];styles(){return""}template(){let{layout:e,show:n}=this.element.attributes,i=(0,Ne.classlist)(),r=d=>{this.classList.add("absolute","top-0","right-0","h-60","transition-500"),e?.left?(this.classList.remove("left-0"),this.classList.add("left-226")):this.classList.add("left-0"),n.left?(this.classList.remove("md-left-0"),this.classList.add("md-left-226")):(this.classList.remove("md-left-226"),this.classList.add("md-left-0"))};return n.change(r),r(),()=>[we.TempleRegistry.createText(`
+`,!1),we.TempleRegistry.createElement("header",{class:"block w-full h-full relative"},[...this._toNodeList((0,Ne.children)())]).element]}};var Ae=P(q()),Re=P(z()),ae=class extends Ae.TempleComponent{static component=["main","Main_847772763f4518728ede"];styles(){return""}template(){let{layout:e,show:n}=this.element.attributes,i=(0,Re.classlist)(),r=d=>{this.classList.add("absolute","transition-500"),e?.head?(this.classList.remove("top-0"),this.classList.add("top-60")):this.classList.add("top-0"),e?.foot?(this.classList.remove("bottom-0"),this.classList.add("bottom-60")):this.classList.add("bottom-0"),e?.left?(this.classList.remove("left-0"),this.classList.add("left-226")):this.classList.add("left-0"),e?.right?(this.classList.remove("right-0"),this.classList.add("right-200")):this.classList.add("right-0"),n.left?(this.classList.remove("md-left-0"),this.classList.add("md-left-226")):(this.classList.remove("md-left-226"),this.classList.add("md-left-0")),n.right?(this.classList.remove("md-right-0"),this.classList.add("md-right-200")):(this.classList.remove("md-right-200"),this.classList.add("md-right-0"))};return n.change(r),r(),()=>[Ae.TempleRegistry.createText(`
+`,!1),Ae.TempleRegistry.createElement("main",{class:"block w-full h-full relative"},[...this._toNodeList((0,Re.children)())]).element]}};var qe=P(q()),le=P(z()),ie=class extends qe.TempleComponent{static component=["button","Button_d798a3059463b9c4868b"];styles(){return""}template(){let{block:e,full:n,color:i,xs:r,sm:d,md:_,lg:m,xl:y,xl2:w,xl3:b,xl4:T,xl5:L,curved:x,rounded:F,pill:a,info:s,warning:l,success:o,error:u,muted:h,primary:v,secondary:p,outline:E,transparent:C,solid:I,href:V,style:Ge,class:lt,...We}=(0,le.props)(),K=(0,le.component)(),f=document.createElement(V?"a":"button");Object.entries(We).forEach(([B,j])=>f.setAttribute(B,j)),V&&f.setAttribute("href",V),(0,le.children)().forEach(B=>f.appendChild(B)),f.classList.add("inline-block","tx-center","tx-nodecor","cursor-pointer"),e?(K.classList.add("block"),f.classList.add("block")):(K.classList.add("inline-block"),f.classList.add("inline-block")),n&&(K.classList.add("w-full"),f.classList.add("w-full"));let R=r?f.classList.add("py-2","px-4"):d?f.classList.add("py-4","px-8"):_?f.classList.add("py-6","px-12"):m?f.classList.add("py-8","px-16"):y?f.classList.add("py-10","px-20"):w?f.classList.add("py-12","px-24"):b?f.classList.add("py-14","px-28"):T?f.classList.add("py-16","px-32"):L?f.classList.add("py-18","px-36"):f.classList.add("py-6","px-12");x?f.classList.add("curved"):F?f.classList.add("rounded"):a&&f.classList.add("pill");let H=E?"outline":C?"transparent":"solid";return H==="outline"||H==="transparent"?(f.classList.add("bd-solid","bd-thin"),H==="outline"&&f.classList.add("bg-white"),i?(f.style.color=i,f.style.borderColor=i):s?f.classList.add("bd-info","tx-info"):l?f.classList.add("bd-warning","tx-warning"):o?f.classList.add("bd-success","tx-success"):u?f.classList.add("bd-error","tx-error"):h?f.classList.add("bd-muted","tx-muted"):v?f.classList.add("bd-primary","tx-primary"):p&&f.classList.add("bd-secondary","tx-secondary")):(f.classList.add("tx-white"),i?f.style.backgroundColor=i:s?f.classList.add("bg-info"):l?f.classList.add("bg-warning"):o?f.classList.add("bg-success"):u?f.classList.add("bg-error"):h?f.classList.add("bg-muted"):v?f.classList.add("bg-primary"):p&&f.classList.add("bg-secondary")),()=>[qe.TempleRegistry.createText(`
+`,!1),...this._toNodeList([f])]}};var k=P(q()),Ie=P(z()),oe=class extends k.TempleComponent{static component=["app","App_381239c61b65b86a1c20"];styles(){return""}template(){let{title:e,height:n}=(0,Ie.props)(),i=n?`height:${n}px`:"";return()=>[k.TempleRegistry.createText(`
+`,!1),k.TempleRegistry.createElement("div",{class:"bd-rad-curved scroll-hidden shadow-0-0-10-0-0-0-5"},[k.TempleRegistry.createText(`
+  `,!1),k.TempleRegistry.createElement("div",{class:"relative flex flex-center-y gap-10 p-10 bg-t-1 tx-c-999999 tx-16"},[k.TempleRegistry.createText(`
+    `,!1),k.TempleRegistry.createElement("span",{class:"bg-h-999999 pill h-10 w-10"},[]).element,k.TempleRegistry.createText(`
+    `,!1),k.TempleRegistry.createElement("span",{class:"bg-h-999999 pill h-10 w-10"},[]).element,k.TempleRegistry.createText(`
+    `,!1),k.TempleRegistry.createElement("span",{class:"bg-h-999999 pill h-10 w-10"},[]).element,k.TempleRegistry.createText(`
+    `,!1),k.TempleRegistry.createElement("span",{class:"flex flex-center h-full w-full absolute top-0 left-0"},[k.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(e),k.TempleRegistry.createText(`
+    `,!1)]).element,k.TempleRegistry.createText(`
+  `,!1)]).element,k.TempleRegistry.createText(`
+  `,!1),k.TempleRegistry.createElement("div",{class:"bg-black tx-t-1 relative",style:i},[...this._toNodeList((0,Ie.children)())]).element,k.TempleRegistry.createText(`
+`,!1)]).element]}};var A=P(q()),at=P(St()),Ct=P(z()),ue=class extends A.TempleComponent{static component=["code","Code_5294df1c620ef5ddbd2f"];styles(){return`:host {
+    display: block;
+    font-size: 14px;
+    line-height: 20px;
+  }
+  :host([inline]) {
+    display: inline !important;
+  }
+  :host([inline]),
+  :host([inline]) > pre,
+  :host([inline]) > pre > code {
+    display: inline !important;
+  }
+  .snippet {
+    background-color: #000000;
+    color: #ABB2BF;
+    height: 100%;
+    margin: 0;
+    padding: 0;
+  }
+
+  .line-numbers {
+    position: relative;
+    padding-left: 3.8em;
+    counter-reset: linenumber;
+  }
+  :host([inline]) .line-numbers {
+    position: static;
+    padding-left: 0;
+  }
+
+  .line-numbers > code {
+    position: relative;
+    white-space: inherit;
+  }
+
+  .line-numbers .line-numbers-rows {
+    position: absolute;
+    pointer-events: none;
+    top: 0;
+    font-size: 100%;
+    left: -3.8em;
+    width: 3em; /* works for line-numbers below 1000 lines */
+    letter-spacing: -1px;
+    border-right: 1px solid #999;
+
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+
+  }
+
+  :host([inline]) .line-numbers .line-numbers-rows {
+    display: none;
+  }
+
+  .line-numbers-rows > span {
+    display: block;
+    counter-increment: linenumber;
+  }
+
+  .line-numbers-rows > span:before {
+    content: counter(linenumber);
+    color: #999;
+    display: block;
+    padding-right: 0.8em;
+    text-align: right;
+  }
+  .pad {
+    padding: 5px;
+  }
+
+  .terminal {
+    background-color: #000000;
+    font-family: 'Courier New', Courier, monospace;
+    font-size: 15px;
+    height: 100%;
+    padding: 10px;
+  }
+  .terminal span {
+    color: #00FF00;
+  }`}template(){let e=this.props,{lang:n="markup",numbers:i=!1,inline:r=!1,trim:d=!1,ltrim:_=!1,rtrim:m=!1,detab:y=0}=e,w=(0,Ct.children)(),b=w[0]?.textContent||"";y&&(b=b.replace(new RegExp(`\\n {${y}}`,"g"),`
+`)),d?b=b.trim():_?b=b.replace(/^\s+/,""):m&&(b=b.replace(/\s+$/,""));let T=L=>{if(!b)return;let x=at.default.highlight(b,at.default.languages[n],n);if(L.detail.target.innerHTML=x,i){let F=x.match(/\n(?!$)/g),a=F?F.length+1:1,s=new Array(a+1).join(""),l=document.createElement("span");l.setAttribute("aria-hidden","true"),l.className="line-numbers-rows",l.innerHTML=s,L.detail.target.appendChild(l)}};return()=>[A.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism.min.css"}).element,A.TempleRegistry.createText(`
+`,!1),A.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism-tomorrow.min.css"}).element,A.TempleRegistry.createText(`
+`,!1),...n==="bash"?[A.TempleRegistry.createText(`
+  `,!1),A.TempleRegistry.createElement("div",{class:"terminal"},[A.TempleRegistry.createElement("span",{},[A.TempleRegistry.createText("$",!1)]).element,A.TempleRegistry.createText(" ",!1),...this._toNodeList(w)]).element,A.TempleRegistry.createText(`
+`,!1)]:b?[,A.TempleRegistry.createText(`
+  `,!1),...i?[A.TempleRegistry.createText(`
+    `,!1),A.TempleRegistry.createElement("pre",{class:"snippet line-numbers"},[A.TempleRegistry.createElement("code",{mount:T},[]).element]).element,A.TempleRegistry.createText(`
+  `,!1)]:[,A.TempleRegistry.createText(`
+    `,!1),A.TempleRegistry.createElement("pre",{class:"snippet pad"},[A.TempleRegistry.createElement("code",{mount:T},[]).element]).element,A.TempleRegistry.createText(`
+  `,!1)],A.TempleRegistry.createText(`
+`,!1)]:[,A.TempleRegistry.createText(`
+  `,!1),A.TempleRegistry.createElement("span",{},[A.TempleRegistry.createText("????",!1)]).element,A.TempleRegistry.createText(`
+`,!1)],A.TempleRegistry.createText(`
+
+`,!1)]}};var Te=P(q()),ze=P(z()),ce=class extends Te.TempleComponent{static component=["preview","Preview_ab5776d356e4ce3da5d5"];styles(){return""}template(){return(0,ze.classlist)().add("block","w-full","h-full","scroll-auto"),()=>[Te.TempleRegistry.createText(`
+`,!1),Te.TempleRegistry.createElement("div",{class:"bg-white tx-black arial p-10 h-full"},[...this._toNodeList((0,ze.children)())]).element]}};var D=P(q());var Mt=function(t){return t};var Be=P(z()),de=class extends D.TempleComponent{static component=["translate","Translate_0014b007fc91289b2776"];styles(){return""}template(){let{trim:e=!1,p:n=!1,li:i=!1,div:r=!1}=(0,Be.props)(),d=(0,Be.children)(),_=[],m=[];for(let T of d)typeof T=="string"?_.push(T):T instanceof Node&&T.textContent?_.push(T.textContent):(_.push("%s"),m.push(T));let y=_.join("");e&&(y=y.replace(/\s+/," ").trim());let w=Mt(y).split("%s"),b=[];for(let T=0;T[D.TempleRegistry.createText(`
+    `,!1),...n?[D.TempleRegistry.createText(`
+      `,!1),D.TempleRegistry.createElement("p",{},[...this._toNodeList(b)]).element,D.TempleRegistry.createText(`
+    `,!1)]:i?[,D.TempleRegistry.createText(`
+      `,!1),D.TempleRegistry.createElement("li",{},[...this._toNodeList(b)]).element,D.TempleRegistry.createText(`
+    `,!1)]:r?[,D.TempleRegistry.createText(`
+      `,!1),D.TempleRegistry.createElement("div",{},[...this._toNodeList(b)]).element,D.TempleRegistry.createText(`
+    `,!1)]:[,D.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(b),D.TempleRegistry.createText(`
+    `,!1)]]}};var Ot=P(z());var it=function(t,...e){let n=Fn(t);for(let i=0;i{let t=document.querySelector("script[data-app]");if(!t)throw $.TempleException.for("APP_DATA not found");try{let _=atob(t.getAttribute("data-app"));window.__APP_DATA__=JSON.parse(_),Object.entries(window.__APP_DATA__).forEach(([m,y])=>{$.data.set(m,y)})}catch{throw $.TempleException.for("APP_DATA is not a valid JSON")}$.data.set("current","document");let e="/temple/500.html",n=it("Oops... - Temple - The reactive web component template engine."),i=it("Temple is a template engine hat generates web components and support reactivity."),{error:r="Unknown Error"}=(0,Ot.props)();$.data.delete("current");let d={2:{class:"flex flex-center-y px-20 py-15 m-0 bg-t-1"},3:{href:"/temple"},4:{alt:"Temple Logo",class:"h-26 mr-10",src:"/temple/temple-icon.png"},5:{class:"flex-grow tx-uppercase"},6:{class:"tx-white",href:"/temple"},7:{class:"flex flex-center-y"},8:{class:"tx-white",href:"/temple/docs/index.html"},9:{class:"tx-t-1 tx-5xl ml-10",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},10:{class:"fab fa-github"},11:{class:"bg-h-cb3837 pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},12:{class:"fab fa-npm text-white"},13:{class:"bg-h-7289da pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},14:{class:"fab fa-discord text-white"},15:{class:"scroll-auto"},16:{class:"p-20 w-calc-full-40"},17:{class:"pt-10 pb-20"},18:{p:!0,trim:!0},19:{class:"bg-black courier tx-lh-22 tx-word-wrap p-10 scroll-x-auto tx-prewrap"}};for(let _ of document.body.querySelectorAll("*")){let m=Object.fromEntries(Array.from(_.attributes).map(w=>[w.nodeName,w.nodeValue.length>0?w.nodeValue:!0])),y=String($.TempleRegistry.elements.size);d[y]&&(Object.assign(m,d[y]),_.TempleAttributes=d[y]),$.TempleRegistry.register(_,m)}customElements.define("panel-layout",re),customElements.define("panel-head",se),customElements.define("panel-main",ae),customElements.define("tui-button",ie),customElements.define("ide-app",oe),customElements.define("ide-code",ue),customElements.define("ide-preview",ce),customElements.define("i18n-translate",de),$.emitter.emit("mounted",document.body)});var kn={PanelLayout_9f3ab204ce271feaf6f7:re,PanelHead_2bf4dff19bc88ba4138b:se,PanelMain_847772763f4518728ede:ae,TuiButton_d798a3059463b9c4868b:ie,IdeApp_381239c61b65b86a1c20:oe,IdeCode_5294df1c620ef5ddbd2f:ue,IdePreview_ab5776d356e4ce3da5d5:ce,I18nTranslate_0014b007fc91289b2776:de},Pn="055f1a2f37d39d4fe92a";return zt(Sn);})();
+/*! Bundled license information:
+
+prismjs/prism.js:
+  (**
+   * Prism: Lightweight, robust, elegant syntax highlighting
+   *
+   * @license MIT 
+   * @author Lea Verou 
+   * @namespace
+   * @public
+   *)
+*/
diff --git a/docs/build/client/13781afd4fbd704a9789.css b/docs/build/client/13781afd4fbd704a9789.css
index e69de29..efc5330 100644
--- a/docs/build/client/13781afd4fbd704a9789.css
+++ b/docs/build/client/13781afd4fbd704a9789.css
@@ -0,0 +1,182 @@
+html, body {
+  height: 100%;
+  margin: 0;
+  padding: 0;
+  width: 100%;
+}
+
+h1, h2, h3, h4, h5, h6, p {
+  margin: 0;
+  padding: 0;
+}
+
+a {
+  text-decoration: none;
+}
+  html-head:not(:defined) { opacity: 0; }
+html-header:not(:defined) { opacity: 0; }
+html-aside:not(:defined) { opacity: 0; }
+panel-layout:not(:defined) { opacity: 0; }
+panel-head:not(:defined) { opacity: 0; }
+panel-left:not(:defined) { opacity: 0; }
+panel-main:not(:defined) { opacity: 0; }
+api-docs:not(:defined) { opacity: 0; }
+ide-app:not(:defined) { opacity: 0; }
+ide-code:not(:defined) { opacity: 0; }
+i18n-translate:not(:defined) { opacity: 0; }
+  :root {
+  --black: #000000;
+  --white: #FFFFFF;
+  --info: #1474FC;
+  --error: #DC3545;
+  --warning: #FF7B07;
+  --success: #28A745;
+  --muted: #999999;
+}
+
+.light {
+  --bg-0: #EFEFEF;
+  --bg-1: #CFCFCF;
+  --bg-2: #AFAFAF;
+  --bg-3: #8F8F8F;
+  --bg-4: #6F6F6F;
+  --bd-0: #EFEFEF;
+  --bd-1: #CFCFCF;
+  --bd-2: #AFAFAF;
+  --bd-3: #8F8F8F;
+  --bd-4: #6F6F6F;
+  --bg-inverse: #242424;
+  --tx-0: #000000;
+  --tx-1: #242424;
+  --tx-inverse: #CFCFCF;
+}
+
+.dark {
+  --bg-0: #121212;
+  --bg-1: #222222;
+  --bg-2: #323232;
+  --bg-3: #424242;
+  --bg-4: #525252;
+  --bd-0: #121212;
+  --bd-1: #222222;
+  --bd-2: #323232;
+  --bd-3: #424242;
+  --bd-4: #525252;
+  --bg-inverse: #DBDBDB;
+  --tx-0: #FFFFFF;
+  --tx-1: #CFCFCF;
+  --tx-inverse: #222222;
+}
+  html-head { display: block; }
+html-header { display: block; }
+html-aside { display: block; }
+panel-layout { display: block; }
+panel-head { display: block; }
+panel-left { display: block; }
+panel-main { display: block; }
+api-docs { display: block; }
+ide-app { display: block; }
+ide-code { display: block; }
+i18n-translate { display: block; }
+  .arial { font-family: Arial, sans-serif; }
+.none { display: none; }
+.block { display: block; }
+.flex { display: flex; }
+.inline { display: inline; }
+.relative { position: relative; }
+.absolute { position: absolute; }
+.static { position: static; }
+.bottom-0 { bottom: 0px; }
+.bottom-60 { bottom: 60px; }
+.left-0 { left: 0px; }
+.left-226 { left: 226px; }
+.left-0 { left: 0px; }
+.left-226 { left: 226px; }
+.left--226 { left: -226px; }
+.right-0 { right: 0px; }
+.right-200 { right: 200px; }
+.right-0 { right: 0px; }
+.right-200 { right: 200px; }
+.top-0 { top: 0px; }
+.top-60 { top: 60px; }
+.flex-grow { flex-grow: 1; }
+.flex-center { align-items: center; justify-content: center; }
+.flex-center-y { align-items: center; }
+.gap-10 { gap: 10px; }
+.scroll-auto { overflow: auto; }
+.scroll-hidden { overflow: hidden; }
+.scroll-x-hidden { overflow-x: hidden; }
+.scroll-y-auto { overflow-y: auto; }
+.h-full { height: 100%; }
+.h-26 { height: 26px; }
+.h-7289 { height: 7289px; }
+.h-905496362982981723 { height: 905496362982981723px; }
+.h-60 { height: 60px; }
+.h-999999 { height: 999999px; }
+.h-10 { height: 10px; }
+.h-36 { height: 36px; }
+.h-calc-full-60 { height: calc(100% - 60px); }
+.vh { height: 100vh; }
+.w-full { width: 100%; }
+.w-226 { width: 226px; }
+.w-0 { width: 0px; }
+.w-10 { width: 10px; }
+.bg-black { background-color: var(--black) !important; }
+.bg-t-1 { background-color: var(--bg-1) !important; }
+.bg-t-2 { background-color: var(--bg-2) !important; }
+.bg-t-0 { background-color: var(--bg-0) !important; }
+.bg-h-cb3837 { background-color: #cb3837; }
+.bg-h-7289da { background-color: #7289da; }
+.bg-h-999999 { background-color: #999999; }
+.tx-5 { font-size: 5px; }
+.tx-14 { font-size: 14px; }
+.tx-16 { font-size: 16px; }
+.tx-30 { font-size: 30px; }
+.tx-lg { font-size: 16px; }
+.tx-5xl { font-size: 26px; }
+.tx-center { text-align: center; }
+.tx-bold { font-weight: bold; }
+.tx-uppercase { text-transform: uppercase; }
+.tx-lh-36 { line-height: 36px; }
+.tx-primary { color: var(--primary) !important; }
+.tx-white { color: var(--white) !important; }
+.tx-muted { color: var(--muted) !important; }
+.tx-t-1 { color: var(--tx-1) !important; }
+.pill { border-radius: 10000px; }
+.m-0 { margin: 0px; }
+.m-0 { margin: 0px; }
+.m-60 { margin: 60px; }
+.mb-0 { margin-bottom: 0px; }
+.mb-100 { margin-bottom: 100px; }
+.ml-10 { margin-left: 10px; }
+.ml-5 { margin-left: 5px; }
+.mr-10 { margin-right: 10px; }
+.mt-0 { margin-top: 0px; }
+.mt-20 { margin-top: 20px; }
+.p-5 { padding: 5px; }
+.p-0 { padding: 0px; }
+.p-60 { padding: 60px; }
+.p-10 { padding: 10px; }
+.p-10 { padding: 10px; }
+.pb-10 { padding-bottom: 10px; }
+.pl-10 { padding-left: 10px; }
+.pr-10 { padding-right: 10px; }
+.pr-5 { padding-right: 5px; }
+.pt-20 { padding-top: 20px; }
+.px-20 { padding-left: 20px; padding-right: 20px; }
+.py-15 { padding-top: 15px; padding-bottom: 15px; }
+.py-5 { padding-top: 5px; padding-bottom: 5px; }
+.py-10 { padding-top: 10px; padding-bottom: 10px; }
+.py-20 { padding-top: 20px; padding-bottom: 20px; }
+.py-40 { padding-top: 40px; padding-bottom: 40px; }
+.cursor-pointer { cursor: pointer; }
+.transition-500 { transition: 500ms; }
+.shadow-0-0-10-0-0-0-5 { box-shadow: 0px 0px 10px rgb(0, 0, 0, 0.5); }
+@media (max-width: 767px) {
+  .md-inline-block { display: inline-block; }
+  .md-left-0 { left: 0px; }
+  .md-left-226 { left: 226px; }
+  .md-left--226 { left: -226px; }
+  .md-right-0 { right: 0px; }
+  .md-right-200 { right: 200px; }
+}
\ No newline at end of file
diff --git a/docs/build/client/13781afd4fbd704a9789.html b/docs/build/client/13781afd4fbd704a9789.html
index a6b248e..cf574f8 100644
--- a/docs/build/client/13781afd4fbd704a9789.html
+++ b/docs/build/client/13781afd4fbd704a9789.html
@@ -18,157 +18,214 @@
   
   
   
-  
+  
   
   
   
   
 
-  
-    

-  
-  
-    Temple Logo
-  
-  
Temple

-  
+      
+        
+          

+            Developer Tools
+          

 
-        
-          Temple provides a separate package for a better development 
-          experience when working with server frameworks that utilize 
-          the native http module. Start by installing adding 
-          '@ossph/temple-dev'
-          to your project.
-        
-        
-          
-            npm install --save-dev @ossph/temple-dev
-          
-        
-        
-          Next, import the dev() 
-          function from the package and use it in your existing 
-          'src/index.ts' 
-          file to create a development server as shown in the example below.
-        
-        
-          
-            import http from 'http';
-            import temple from '@ossph/temple/compiler';
-            import { dev } from '@ossph/temple-dev';
+          
+            Temple provides a separate package for a better development 
+            experience when working with server frameworks that utilize 
+            the native http module. Start by installing adding 
+            @ossph/temple-dev
+            to your project.
+          
+          
+            
+              npm install --save-dev @ossph/temple-dev
+            
+          
+          
+            Next, import the dev() 
+            function from the package and use it in your existing 
+            src/index.ts 
+            file to create a development server as shown in the example below.
+          
+          
+            
+              import http from 'http';
+              import temple from '@ossph/temple/compiler';
+              import { dev } from '@ossph/temple-dev';
 
-            //create temple compiler
-            const compiler = temple({ cwd: __dirname });
-            //1. create dev tools
-            const { router, refresh } = dev({ cwd: __dirname });
+              //create temple compiler
+              const compiler = temple({ cwd: __dirname });
+              //1. create dev tools
+              const { router, refresh } = dev({ cwd: __dirname });
 
-            //create http server
-            const server = http.createServer(async (req, res) => {
-              //2. Add dev router
-              if (router(req, res)) return;
-              //if home page
-              if (req.url === '/') {
-                //3. sync builder with refresh server
-                refresh.sync(compiler.fromSource('./page.dtml'));
-                //compile the document
-                const html = await compiler.render('./page.dtml');
-                //... send response ...
-              }
-              //... other routes ...
-            });
-            //listen on port 3000
-            server.listen(3000);
-          
-        
-        
-          Lastly, update the document file 
-          'src/page.dtml' 
-          to include the development script 
-          <script src="/dev.js"></script> 
-          as shown below.
-        
-        
-          
-            <script>
-              //... 
-            </script>
-            <html>
-              <head>
-                <!-- ... -->
-                <!-- 4. include dev script -->
-                <script src="/dev.js"></script>
-              </head>
-              <body>
-                <!-- ... -->
-              </body>
-            </html>
-          
-        
-        
-          Run the following command in terminal.
-        
-        
-          
-            npx ts-node src/index.ts
-          
-        
-        
-          Whenever 'src/page.dtml' 
-          is updated, the development server will automatically refresh 
-          the page. Components will also be updated in real-time.
-        
-        
-        
-      
-      

-    
+              //create http server
+              const server = http.createServer(async (req, res) => {
+                //2. Add dev router
+                if (router(req, res)) return;
+                //if home page
+                if (req.url === '/') {
+                  //3. sync builder with refresh server
+                  refresh.sync(compiler.fromSource('./page.dtml'));
+                  //compile the document
+                  const html = await compiler.render('./page.dtml');
+                  //... send response ...
+                }
+                //... other routes ...
+              });
+              //listen on port 3000
+              server.listen(3000);
+            
+          
+          
+            Lastly, update the document file 
+            src/page.dtml 
+            to include the development script 
+            <script src="/dev.js"></script> 
+            as shown below.
+          
+          
+            
+              <script>
+                //... 
+              </script>
+              <html>
+                <head>
+                  <!-- ... -->
+                  <!-- 4. include dev script -->
+                  <script src="/dev.js"></script>
+                </head>
+                <body>
+                  <!-- ... -->
+                </body>
+              </html>
+            
+          
+          
+            Run the following command in terminal.
+          
+          
+            
+              npx ts-node src/index.ts
+            
+          
+          
+            Whenever src/page.dtml 
+            is updated, the development server will automatically refresh 
+            the page. Components will also be updated in real-time.
+          
+          
+          
+          

+        
+      
+    
   
 
\ No newline at end of file
diff --git a/docs/build/client/13781afd4fbd704a9789.js b/docs/build/client/13781afd4fbd704a9789.js
index f393b60..9b2bc1e 100644
--- a/docs/build/client/13781afd4fbd704a9789.js
+++ b/docs/build/client/13781afd4fbd704a9789.js
@@ -1,20 +1,37 @@
-var TempleAPI=(()=>{var yt=Object.create;var de=Object.defineProperty;var wt=Object.getOwnPropertyDescriptor;var At=Object.getOwnPropertyNames;var xt=Object.getPrototypeOf,Tt=Object.prototype.hasOwnProperty;var O=(t,e)=>()=>(e||t((e={exports:{}}).exports,e),e.exports),Et=(t,e)=>{for(var r in e)de(t,r,{get:e[r],enumerable:!0})},Ue=(t,e,r,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let n of At(e))!Tt.call(t,n)&&n!==r&&de(t,n,{get:()=>e[n],enumerable:!(i=wt(e,n))||i.enumerable});return t};var L=(t,e,r)=>(r=t!=null?yt(xt(t)):{},Ue(e||!t||!t.__esModule?de(r,"default",{value:t,enumerable:!0}):r,t)),Ft=t=>Ue(de({},"__esModule",{value:!0}),t);var Se=O(Pe=>{"use strict";Object.defineProperty(Pe,"__esModule",{value:!0});var ke=class extends Error{static for(e,...r){return r.forEach(function(i){e=e.replace("%s",i)}),new this(e)}static forErrorsFound(e){let r=new this("Invalid Parameters");return r.errors=e,r}static require(e,r,...i){if(!e){for(let n of i)r=r.replace("%s",n);throw new this(r)}}constructor(e,r=500){super(),this.errors={},this.start=0,this.end=0,this.message=e,this.name=this.constructor.name,this.code=r}withCode(e){return this.code=e,this}withPosition(e,r){return this.start=e,this.end=r,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};Pe.default=ke});var K=O(V=>{"use strict";Object.defineProperty(V,"__esModule",{value:!0});V.TempleEmitter=void 0;var fe=class extends EventTarget{emit(e,r){return this.dispatchEvent(new CustomEvent(e,{detail:r})),this}on(e,r){if(e==="ready"&&document.readyState!=="loading"){let i=new CustomEvent("ready");return setTimeout(()=>r(i),1),this}return this.addEventListener(e,r),this}once(e,r){let i=n=>{this.unbind(e,i),r(n)};return this.on(e,i),this}unbind(e,r){return this.removeEventListener(e,r),this}};V.TempleEmitter=fe;var Ze=new fe;document.onreadystatechange=()=>{document.readyState!=="loading"&&Ze.emit("ready")};V.default=Ze});var Me=O(Q=>{"use strict";var kt=Q&&Q.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Q,"__esModule",{value:!0});var je=kt(K()),Oe=class{get attributes(){return Object.assign({},this._attributes)}get element(){return this._element}constructor(e,r){this._element=e,this._attributes=r}hasAttribute(e){return e in this._attributes}getAttribute(e){return this._attributes[e]}removeAttribute(e,r=!1){let i=this.getAttribute(e);return typeof i>"u"?this:(delete this._attributes[e],this._element.removeAttribute(e),r||je.default.emit("attribute-remove",{element:this,key:e,previous:i}),this)}setAttribute(e,r,i=!1){if(typeof r>"u")return this.removeAttribute(e,i);let n=this.getAttribute(e);return n===r?this:(this._attributes[e]=r,typeof r=="string"&&this._element.setAttribute(e,r),i||(typeof n>"u"?je.default.emit("attribute-create",{element:this,key:e,value:r}):je.default.emit("attribute-update",{element:this,key:e,value:r,previous:n})),this)}setAttributes(e,r=!1){for(let[n,p]of Object.entries(e))this.setAttribute(n,p,r);let i=Object.keys(e);for(let n of Object.keys(this._attributes))i.includes(n)||this.removeAttribute(n,r);return this}};Q.default=Oe});var ge=O(ee=>{"use strict";var Pt=ee&&ee.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ee,"__esModule",{value:!0});var St=Pt(Me()),pe=class{static get elements(){return this._elements}static createComponent(e,r,i,n=[]){let p=document.createElement("template");p.innerHTML=`<${e}>`;let m=p.content.querySelector(`${e}`);Object.setPrototypeOf(m,r.prototype),m.constructor=r.constructor,m.constructor.component=r.component;for(let[v,E]of Object.entries(i))typeof E=="string"?m.setAttribute(v,E):E===!0&&m.setAttribute(v,v);return m._TempleAttributes=i,m.props=i,n.forEach(v=>m.appendChild(v)),m.register(),customElements.get(e)||m.connectedCallback(),this.register(m,i)}static createElement(e,r,i=[]){let n=document.createElement(e);for(let[p,h]of Object.entries(r))typeof h=="string"?n.setAttribute(p,h):h===!0&&n.setAttribute(p,p);return i.filter(p=>typeof p<"u").forEach(p=>n.appendChild(p)),this.register(n,r)}static createText(e,r=!1){return document.createTextNode(e)}static filter(e){let r=[];return this._elements.forEach((i,n)=>{e(i,n)&&r.push(i)}),r}static get(e){return this._elements.get(e)||null}static has(e){return this._elements.has(e)}static map(e){let r=[];return this._elements.forEach((i,n)=>{r.push(e(i,n))}),r}static register(e,r){if(this.has(e))return this.get(e);let i=new St.default(e,r||{});return this._elements.set(e,i),i}};pe._elements=new Map;ee.default=pe});var I=O(te=>{"use strict";Object.defineProperty(te,"__esModule",{value:!0});te.TempleDataMap=void 0;var he=class{constructor(){window.__APP_DATA__||(window.__APP_DATA__={})}clear(){return window.__APP_DATA__={},this}delete(e){return this.has(e)?(delete window.__APP_DATA__[e],!0):!1}entries(){return Object.entries(window.__APP_DATA__)}has(e){return e in window.__APP_DATA__}get(e){return window.__APP_DATA__[e]}keys(){return Object.keys(window.__APP_DATA__)}set(e,r){return window.__APP_DATA__[e]=r,this}values(){return Object.values(window.__APP_DATA__)}};te.TempleDataMap=he;var jt=new he;te.default=jt});var Je=O(ne=>{"use strict";var Ce=ne&&ne.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ne,"__esModule",{value:!0});var re=Ce(ge()),me=Ce(K()),We=Ce(I()),De=class t extends HTMLElement{constructor(){super(...arguments),this._initiated=!1,this._template=null,this._attributes={},this._props={},this._children=void 0,this._rendering=!1}static register(){customElements.define(this.component[0],this)}get attr(){return this._attributes}get element(){return re.default.has(this)?re.default.get(this):re.default.register(this,this._TempleAttributes||{})}get metadata(){let[e,r]=this.constructor.component;return{tagname:e,classname:r}}get originalChildren(){return this._children}get initiated(){return this._initiated}get props(){return this._props}set props(e){this._props=Object.assign({},e),this._attributes=Object.fromEntries(Object.entries(e).filter(r=>typeof r[1]=="string"||r[1]===!0))}adoptedCallback(){this.render()}attributeChangedCallback(e,r,i){this.props=Object.assign(Object.assign({},this.props),{[e]:i}),this.render()}connectedCallback(){this.wait()}disconnectedCallback(){}getParentComponent(){let e=this.parentElement;for(;e;){if(e instanceof t)return e;e=e.parentElement}return null}register(){re.default.register(this,this._props)}render(){let e=this.getParentComponent();if(e&&!e.initiated)return;if(this._rendering)return;this._rendering=!0,We.default.set("current",this);let r=this.styles();this._template?me.default.emit("unmounted",this):this._template=this.template();let i=this._template().filter(Boolean);if(r.length===0)this.textContent="",i.forEach(n=>this.appendChild(n));else{this.shadowRoot||this.attachShadow({mode:"open"});let n=this.shadowRoot;this.textContent="",n.textContent="";let p=document.createElement("style");p.innerText=r,n.appendChild(p),i.forEach(h=>{var m;return(m=this.shadowRoot)===null||m===void 0?void 0:m.appendChild(h)})}return We.default.delete("current"),this._initiated=!0,me.default.emit("mounted",this),this._rendering=!1,this.shadowRoot?this.shadowRoot.innerHTML:this.innerHTML}wait(){if(document.readyState!=="loading")this._update();else{let e=()=>{this._update(),me.default.unbind("ready",e)};me.default.on("ready",e)}}_toNodeList(e){return e instanceof Node?[e]:Array.isArray(e)&&e.every(r=>r instanceof Node)?e:[re.default.createText(String(e))]}_update(){typeof this._children>"u"&&(this._children=Array.from(this.childNodes||[]));let e=this.element;e&&(this.props=Object.assign({},e.attributes),this.render()),this._initiated||this.render()}};ne.default=De});var Xe=O(ae=>{"use strict";var Ot=ae&&ae.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ae,"__esModule",{value:!0});var Mt=Ot(I());function Dt(t){let e=Mt.default.get("env")||{};return t?e[t]||null:e}ae.default=Dt});var $e=O(se=>{"use strict";var Ct=se&&se.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(se,"__esModule",{value:!0});se.default=$t;var Ye=Ct(I());function $t(t=null){return t||(t=Ye.default.get("current")||null),t?t==="document"?Ye.default.get("props")||{}:t.props:{}}});var Ve=O(ie=>{"use strict";var Lt=ie&&ie.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ie,"__esModule",{value:!0});ie.default=Rt;var qt=Lt($e());function Rt(t=null){return(0,qt.default)(t).class}});var Qe=O(G=>{"use strict";var It=G&&G.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(G,"__esModule",{value:!0});G.innerHTML=Ht;G.default=Ke;var zt=It(I());function Ht(t=null){let e=Ke(t),r=document.createElement("template");return r.append(...e),r.innerHTML}function Ke(t=null){return t||(t=zt.default.get("current")||null),t?t.originalChildren||[]:[]}});var rt=O(z=>{"use strict";var tt=z&&z.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(z,"__esModule",{value:!0});z.SignalRegistry=void 0;z.default=Bt;var et=tt(Se()),Nt=tt(I()),U=class t{static observe(e,r){let i={getter:()=>n.raw,setter:h=>h},n={raw:r,getter(h){return i.getter=h,n},setter(h){return i.setter=h,n}};Object.defineProperty(n,"value",{get(){return i.getter()},set(h){let m=i.setter(h),v=t.serialize(m)!==t.serialize(n.raw);n.raw=m,v&&e.render()}});let p=this._observers.get(e);return p?(p.observed++,p.values.push(n)):this._observers.set(e,{observed:1,values:[n]}),n}static observer(e){return this._observers.get(e)||null}static serialize(e){return JSON.stringify(e)}};z.SignalRegistry=U;U._observers=new Map;function Bt(t,e=null){if(e||(e=Nt.default.get("current")||null),!e)throw et.default.for("Signals can only be created within a Temple component");if(!e.initiated)return U.observe(e,t);let r=U.observer(e);if(!r)throw et.default.for("State mismatch");return r.values[r.observed++%r.values.length]}});var lt=O(be=>{"use strict";var at=be&&be.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(be,"__esModule",{value:!0});var nt=at(ge()),st=at(K()),it=(t,e)=>Array.from(t.querySelectorAll("*")).filter(r=>{let i=nt.default.get(r);return i&&i.hasAttribute(e)}).map(r=>nt.default.get(r));function Le(t,e){st.default.on("mounted",r=>{if(!r.detail)return;let i=r.detail;it(i.shadowRoot||i,t).forEach(e)})}function Gt(t,e){st.default.on("unmounted",r=>{if(!r.detail)return;let i=r.detail;it(i.shadowRoot||i,t).forEach(e)})}Le("mount",t=>{let e=t.getAttribute("mount");if(typeof e=="function"){let r=new CustomEvent("mount",{detail:{node:t,target:t.element}});e(r)}});Gt("unmount",t=>{let e=t.getAttribute("unmount");if(typeof e=="function"){let r=new CustomEvent("unmount",{detail:{node:t,target:t.element}});e(r)}});Le("if",t=>{let e=t.getAttribute("if");(e===!1||e==="false"||typeof e=="function"&&!e())&&t.element.remove()});["click","dblclick","mousedown","mouseup","mousemove","mouseover","mouseout","wheel","keydown","keypress","keyup","blur","change","contextmenu","focus","input","submit","invalid","reset","search","select","copy","cut","paste","drag","dragstart","dragend","dragover","dragenter","dragleave","drop","scroll","durationchange","ended","error","loadeddata","loadedmetadata","loadstart","pause","play","playing","progress","ratechange","seeked","seeking","stalled","suspend","timeupdate","volumechange","waiting","animationstart","animationend","animationiteration","transitionend","toggle"].forEach(t=>Le(t,e=>{let r=e.getAttribute(t);typeof r=="function"&&(e.element.removeEventListener(t,r),e.element.addEventListener(t,r))}))});var qe=O(g=>{"use strict";var Ut=g&&g.__createBinding||(Object.create?function(t,e,r,i){i===void 0&&(i=r);var n=Object.getOwnPropertyDescriptor(e,r);(!n||("get"in n?!e.__esModule:n.writable||n.configurable))&&(n={enumerable:!0,get:function(){return e[r]}}),Object.defineProperty(t,i,n)}:function(t,e,r,i){i===void 0&&(i=r),t[i]=e[r]}),Zt=g&&g.__setModuleDefault||(Object.create?function(t,e){Object.defineProperty(t,"default",{enumerable:!0,value:e})}:function(t,e){t.default=e}),_e=g&&g.__importStar||function(t){if(t&&t.__esModule)return t;var e={};if(t!=null)for(var r in t)r!=="default"&&Object.prototype.hasOwnProperty.call(t,r)&&Ut(e,t,r);return Zt(e,t),e},H=g&&g.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(g,"__esModule",{value:!0});g.SignalRegistry=g.TempleException=g.TempleEmitter=g.TempleElement=g.TempleRegistry=g.TempleComponent=g.TempleDataMap=g.emitter=g.signal=g.innerHTML=g.children=g.classnames=g.props=g.env=g.data=void 0;var Wt=H(Se());g.TempleException=Wt.default;var Jt=H(Je());g.TempleComponent=Jt.default;var Xt=H(ge());g.TempleRegistry=Xt.default;var Yt=H(Me());g.TempleElement=Yt.default;var ot=_e(K());g.emitter=ot.default;Object.defineProperty(g,"TempleEmitter",{enumerable:!0,get:function(){return ot.TempleEmitter}});var ut=_e(I());g.data=ut.default;Object.defineProperty(g,"TempleDataMap",{enumerable:!0,get:function(){return ut.TempleDataMap}});var Vt=H(Xe());g.env=Vt.default;var Kt=H($e());g.props=Kt.default;var Qt=H(Ve());g.classnames=Qt.default;var ct=_e(Qe());g.children=ct.default;Object.defineProperty(g,"innerHTML",{enumerable:!0,get:function(){return ct.innerHTML}});var dt=_e(rt());g.signal=dt.default;Object.defineProperty(g,"SignalRegistry",{enumerable:!0,get:function(){return dt.SignalRegistry}});lt()});var N=O((_r,ft)=>{ft.exports={...qe()}});var pt=O((yr,ye)=>{var er=typeof window<"u"?window:typeof WorkerGlobalScope<"u"&&self instanceof WorkerGlobalScope?self:{};var c=function(t){var e=/(?:^|\s)lang(?:uage)?-([\w-]+)(?=\s|$)/i,r=0,i={},n={manual:t.Prism&&t.Prism.manual,disableWorkerMessageHandler:t.Prism&&t.Prism.disableWorkerMessageHandler,util:{encode:function s(a){return a instanceof p?new p(a.type,s(a.content),a.alias):Array.isArray(a)?a.map(s):a.replace(/&/g,"&").replace(/"u")return null;if("currentScript"in document)return document.currentScript;try{throw new Error}catch(o){var s=(/at [^(\r\n]*\((.*):[^:]+:[^:]+\)$/i.exec(o.stack)||[])[1];if(s){var a=document.getElementsByTagName("script");for(var l in a)if(a[l].src==s)return a[l]}return null}},isActive:function(s,a,l){for(var o="no-"+a;s;){var u=s.classList;if(u.contains(a))return!0;if(u.contains(o))return!1;s=s.parentElement}return!!l}},languages:{plain:i,plaintext:i,text:i,txt:i,extend:function(s,a){var l=n.util.clone(n.languages[s]);for(var o in a)l[o]=a[o];return l},insertBefore:function(s,a,l,o){o=o||n.languages;var u=o[s],f={};for(var b in u)if(u.hasOwnProperty(b)){if(b==a)for(var d in l)l.hasOwnProperty(d)&&(f[d]=l[d]);l.hasOwnProperty(b)||(f[b]=u[b])}var A=o[s];return o[s]=f,n.languages.DFS(n.languages,function(S,q){q===A&&S!=s&&(this[S]=f)}),f},DFS:function s(a,l,o,u){u=u||{};var f=n.util.objId;for(var b in a)if(a.hasOwnProperty(b)){l.call(a,b,a[b],o||b);var d=a[b],A=n.util.type(d);A==="Object"&&!u[f(d)]?(u[f(d)]=!0,s(d,l,null,u)):A==="Array"&&!u[f(d)]&&(u[f(d)]=!0,s(d,l,b,u))}}},plugins:{},highlightAll:function(s,a){n.highlightAllUnder(document,s,a)},highlightAllUnder:function(s,a,l){var o={callback:l,container:s,selector:'code[class*="language-"], [class*="language-"] code, code[class*="lang-"], [class*="lang-"] code'};n.hooks.run("before-highlightall",o),o.elements=Array.prototype.slice.apply(o.container.querySelectorAll(o.selector)),n.hooks.run("before-all-elements-highlight",o);for(var u=0,f;f=o.elements[u++];)n.highlightElement(f,a===!0,o.callback)},highlightElement:function(s,a,l){var o=n.util.getLanguage(s),u=n.languages[o];n.util.setLanguage(s,o);var f=s.parentElement;f&&f.nodeName.toLowerCase()==="pre"&&n.util.setLanguage(f,o);var b=s.textContent,d={element:s,language:o,grammar:u,code:b};function A(q){d.highlightedCode=q,n.hooks.run("before-insert",d),d.element.innerHTML=d.highlightedCode,n.hooks.run("after-highlight",d),n.hooks.run("complete",d),l&&l.call(d.element)}if(n.hooks.run("before-sanity-check",d),f=d.element.parentElement,f&&f.nodeName.toLowerCase()==="pre"&&!f.hasAttribute("tabindex")&&f.setAttribute("tabindex","0"),!d.code){n.hooks.run("complete",d),l&&l.call(d.element);return}if(n.hooks.run("before-highlight",d),!d.grammar){A(n.util.encode(d.code));return}if(a&&t.Worker){var S=new Worker(n.filename);S.onmessage=function(q){A(q.data)},S.postMessage(JSON.stringify({language:d.language,code:d.code,immediateClose:!0}))}else A(n.highlight(d.code,d.grammar,d.language))},highlight:function(s,a,l){var o={code:s,grammar:a,language:l};if(n.hooks.run("before-tokenize",o),!o.grammar)throw new Error('The language "'+o.language+'" has no grammar.');return o.tokens=n.tokenize(o.code,o.grammar),n.hooks.run("after-tokenize",o),p.stringify(n.util.encode(o.tokens),o.language)},tokenize:function(s,a){var l=a.rest;if(l){for(var o in l)a[o]=l[o];delete a.rest}var u=new v;return E(u,u.head,s),m(s,u,a,u.head,0),F(u)},hooks:{all:{},add:function(s,a){var l=n.hooks.all;l[s]=l[s]||[],l[s].push(a)},run:function(s,a){var l=n.hooks.all[s];if(!(!l||!l.length))for(var o=0,u;u=l[o++];)u(a)}},Token:p};t.Prism=n;function p(s,a,l,o){this.type=s,this.content=a,this.alias=l,this.length=(o||"").length|0}p.stringify=function s(a,l){if(typeof a=="string")return a;if(Array.isArray(a)){var o="";return a.forEach(function(A){o+=s(A,l)}),o}var u={type:a.type,content:s(a.content,l),tag:"span",classes:["token",a.type],attributes:{},language:l},f=a.alias;f&&(Array.isArray(f)?Array.prototype.push.apply(u.classes,f):u.classes.push(f)),n.hooks.run("wrap",u);var b="";for(var d in u.attributes)b+=" "+d+'="'+(u.attributes[d]||"").replace(/"/g,""")+'"';return"<"+u.tag+' class="'+u.classes.join(" ")+'"'+b+">"+u.content+""};function h(s,a,l,o){s.lastIndex=a;var u=s.exec(l);if(u&&o&&u[1]){var f=u[1].length;u.index+=f,u[0]=u[0].slice(f)}return u}function m(s,a,l,o,u,f){for(var b in l)if(!(!l.hasOwnProperty(b)||!l[b])){var d=l[b];d=Array.isArray(d)?d:[d];for(var A=0;A=f.reach);$+=j.value.length,j=j.next){var B=j.value;if(a.length>s.length)return;if(!(B instanceof p)){var le=1,C;if(Ne){if(C=h(Be,$,s,He),!C||C.index>=s.length)break;var oe=C.index,_t=C.index+C[0].length,R=$;for(R+=j.value.length;oe>=R;)j=j.next,R+=j.value.length;if(R-=j.value.length,$=R,j.value instanceof p)continue;for(var Y=j;Y!==a.tail&&(R<_t||typeof Y.value=="string");Y=Y.next)le++,R+=Y.value.length;le--,B=s.slice($,R),C.index-=$}else if(C=h(Be,0,B,He),!C)continue;var oe=C.index,ue=C[0],Te=B.slice(0,oe),Ge=B.slice(oe+ue.length),Ee=$+B.length;f&&Ee>f.reach&&(f.reach=Ee);var ce=j.prev;Te&&(ce=E(a,ce,Te),$+=Te.length),w(a,ce,le);var vt=new p(b,q?n.tokenize(ue,q):ue,mt,ue);if(j=E(a,ce,vt),Ge&&E(a,j,Ge),le>1){var Fe={cause:b+","+A,reach:Ee};m(s,a,l,j.prev,$,Fe),f&&Fe.reach>f.reach&&(f.reach=Fe.reach)}}}}}}function v(){var s={value:null,prev:null,next:null},a={value:null,prev:s,next:null};s.next=a,this.head=s,this.tail=a,this.length=0}function E(s,a,l){var o=a.next,u={value:l,prev:a,next:o};return a.next=u,o.prev=u,s.length++,u}function w(s,a,l){for(var o=a.next,u=0;u/,greedy:!0},prolog:{pattern:/<\?[\s\S]+?\?>/,greedy:!0},doctype:{pattern:/"'[\]]|"[^"]*"|'[^']*')+(?:\[(?:[^<"'\]]|"[^"]*"|'[^']*'|<(?!!--)|)*\]\s*)?>/i,greedy:!0,inside:{"internal-subset":{pattern:/(^[^\[]*\[)[\s\S]+(?=\]>$)/,lookbehind:!0,greedy:!0,inside:null},string:{pattern:/"[^"]*"|'[^']*'/,greedy:!0},punctuation:/^$|[[\]]/,"doctype-tag":/^DOCTYPE/i,name:/[^\s<>'"]+/}},cdata:{pattern://i,greedy:!0},tag:{pattern:/<\/?(?!\d)[^\s>\/=$<%]+(?:\s(?:\s*[^\s>\/=]+(?:\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))|(?=[\s/>])))+)?\s*\/?>/,greedy:!0,inside:{tag:{pattern:/^<\/?[^\s>\/]+/,inside:{punctuation:/^<\/?/,namespace:/^[^\s>\/:]+:/}},"special-attr":[],"attr-value":{pattern:/=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+)/,inside:{punctuation:[{pattern:/^=/,alias:"attr-equals"},{pattern:/^(\s*)["']|["']$/,lookbehind:!0}]}},punctuation:/\/?>/,"attr-name":{pattern:/[^\s>\/]+/,inside:{namespace:/^[^\s>\/:]+:/}}}},entity:[{pattern:/&[\da-z]{1,8};/i,alias:"named-entity"},/&#x?[\da-f]{1,8};/i]};c.languages.markup.tag.inside["attr-value"].inside.entity=c.languages.markup.entity;c.languages.markup.doctype.inside["internal-subset"].inside=c.languages.markup;c.hooks.add("wrap",function(t){t.type==="entity"&&(t.attributes.title=t.content.replace(/&/,"&"))});Object.defineProperty(c.languages.markup.tag,"addInlined",{value:function(e,r){var i={};i["language-"+r]={pattern:/(^$)/i,lookbehind:!0,inside:c.languages[r]},i.cdata=/^$/i;var n={"included-cdata":{pattern://i,inside:i}};n["language-"+r]={pattern:/[\s\S]+/,inside:c.languages[r]};var p={};p[e]={pattern:RegExp(/(<__[^>]*>)(?:))*\]\]>|(?!)/.source.replace(/__/g,function(){return e}),"i"),lookbehind:!0,greedy:!0,inside:n},c.languages.insertBefore("markup","cdata",p)}});Object.defineProperty(c.languages.markup.tag,"addAttribute",{value:function(t,e){c.languages.markup.tag.inside["special-attr"].push({pattern:RegExp(/(^|["'\s])/.source+"(?:"+t+")"+/\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))/.source,"i"),lookbehind:!0,inside:{"attr-name":/^[^\s=]+/,"attr-value":{pattern:/=[\s\S]+/,inside:{value:{pattern:/(^=\s*(["']|(?!["'])))\S[\s\S]*(?=\2$)/,lookbehind:!0,alias:[e,"language-"+e],inside:c.languages[e]},punctuation:[{pattern:/^=/,alias:"attr-equals"},/"|'/]}}}})}});c.languages.html=c.languages.markup;c.languages.mathml=c.languages.markup;c.languages.svg=c.languages.markup;c.languages.xml=c.languages.extend("markup",{});c.languages.ssml=c.languages.xml;c.languages.atom=c.languages.xml;c.languages.rss=c.languages.xml;(function(t){var e=/(?:"(?:\\(?:\r\n|[\s\S])|[^"\\\r\n])*"|'(?:\\(?:\r\n|[\s\S])|[^'\\\r\n])*')/;t.languages.css={comment:/\/\*[\s\S]*?\*\//,atrule:{pattern:RegExp("@[\\w-](?:"+/[^;{\s"']|\s+(?!\s)/.source+"|"+e.source+")*?"+/(?:;|(?=\s*\{))/.source),inside:{rule:/^@[\w-]+/,"selector-function-argument":{pattern:/(\bselector\s*\(\s*(?![\s)]))(?:[^()\s]|\s+(?![\s)])|\((?:[^()]|\([^()]*\))*\))+(?=\s*\))/,lookbehind:!0,alias:"selector"},keyword:{pattern:/(^|[^\w-])(?:and|not|only|or)(?![\w-])/,lookbehind:!0}}},url:{pattern:RegExp("\\burl\\((?:"+e.source+"|"+/(?:[^\\\r\n()"']|\\[\s\S])*/.source+")\\)","i"),greedy:!0,inside:{function:/^url/i,punctuation:/^\(|\)$/,string:{pattern:RegExp("^"+e.source+"$"),alias:"url"}}},selector:{pattern:RegExp(`(^|[{}\\s])[^{}\\s](?:[^{};"'\\s]|\\s+(?![\\s{])|`+e.source+")*(?=\\s*\\{)"),lookbehind:!0},string:{pattern:e,greedy:!0},property:{pattern:/(^|[^-\w\xA0-\uFFFF])(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*(?=\s*:)/i,lookbehind:!0},important:/!important\b/i,function:{pattern:/(^|[^-a-z0-9])[-a-z0-9]+(?=\()/i,lookbehind:!0},punctuation:/[(){};:,]/},t.languages.css.atrule.inside.rest=t.languages.css;var r=t.languages.markup;r&&(r.tag.addInlined("style","css"),r.tag.addAttribute("style","css"))})(c);c.languages.clike={comment:[{pattern:/(^|[^\\])\/\*[\s\S]*?(?:\*\/|$)/,lookbehind:!0,greedy:!0},{pattern:/(^|[^\\:])\/\/.*/,lookbehind:!0,greedy:!0}],string:{pattern:/(["'])(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/,greedy:!0},"class-name":{pattern:/(\b(?:class|extends|implements|instanceof|interface|new|trait)\s+|\bcatch\s+\()[\w.\\]+/i,lookbehind:!0,inside:{punctuation:/[.\\]/}},keyword:/\b(?:break|catch|continue|do|else|finally|for|function|if|in|instanceof|new|null|return|throw|try|while)\b/,boolean:/\b(?:false|true)\b/,function:/\b\w+(?=\()/,number:/\b0x[\da-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:e[+-]?\d+)?/i,operator:/[<>]=?|[!=]=?=?|--?|\+\+?|&&?|\|\|?|[?*/~^%]/,punctuation:/[{}[\];(),.:]/};c.languages.javascript=c.languages.extend("clike",{"class-name":[c.languages.clike["class-name"],{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$A-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\.(?:constructor|prototype))/,lookbehind:!0}],keyword:[{pattern:/((?:^|\})\s*)catch\b/,lookbehind:!0},{pattern:/(^|[^.]|\.\.\.\s*)\b(?:as|assert(?=\s*\{)|async(?=\s*(?:function\b|\(|[$\w\xA0-\uFFFF]|$))|await|break|case|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally(?=\s*(?:\{|$))|for|from(?=\s*(?:['"]|$))|function|(?:get|set)(?=\s*(?:[#\[$\w\xA0-\uFFFF]|$))|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)\b/,lookbehind:!0}],function:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*(?:\.\s*(?:apply|bind|call)\s*)?\()/,number:{pattern:RegExp(/(^|[^\w$])/.source+"(?:"+(/NaN|Infinity/.source+"|"+/0[bB][01]+(?:_[01]+)*n?/.source+"|"+/0[oO][0-7]+(?:_[0-7]+)*n?/.source+"|"+/0[xX][\dA-Fa-f]+(?:_[\dA-Fa-f]+)*n?/.source+"|"+/\d+(?:_\d+)*n/.source+"|"+/(?:\d+(?:_\d+)*(?:\.(?:\d+(?:_\d+)*)?)?|\.\d+(?:_\d+)*)(?:[Ee][+-]?\d+(?:_\d+)*)?/.source)+")"+/(?![\w$])/.source),lookbehind:!0},operator:/--|\+\+|\*\*=?|=>|&&=?|\|\|=?|[!=]==|<<=?|>>>?=?|[-+*/%&|^!=<>]=?|\.{3}|\?\?=?|\?\.?|[~:]/});c.languages.javascript["class-name"][0].pattern=/(\b(?:class|extends|implements|instanceof|interface|new)\s+)[\w.\\]+/;c.languages.insertBefore("javascript","keyword",{regex:{pattern:RegExp(/((?:^|[^$\w\xA0-\uFFFF."'\])\s]|\b(?:return|yield))\s*)/.source+/\//.source+"(?:"+/(?:\[(?:[^\]\\\r\n]|\\.)*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}/.source+"|"+/(?:\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.)*\])*\])*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}v[dgimyus]{0,7}/.source+")"+/(?=(?:\s|\/\*(?:[^*]|\*(?!\/))*\*\/)*(?:$|[\r\n,.;:})\]]|\/\/))/.source),lookbehind:!0,greedy:!0,inside:{"regex-source":{pattern:/^(\/)[\s\S]+(?=\/[a-z]*$)/,lookbehind:!0,alias:"language-regex",inside:c.languages.regex},"regex-delimiter":/^\/|\/$/,"regex-flags":/^[a-z]+$/}},"function-variable":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*[=:]\s*(?:async\s*)?(?:\bfunction\b|(?:\((?:[^()]|\([^()]*\))*\)|(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)\s*=>))/,alias:"function"},parameter:[{pattern:/(function(?:\s+(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)?\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\))/,lookbehind:!0,inside:c.languages.javascript},{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$a-z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*=>)/i,lookbehind:!0,inside:c.languages.javascript},{pattern:/(\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*=>)/,lookbehind:!0,inside:c.languages.javascript},{pattern:/((?:\b|\s|^)(?!(?:as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)(?![$\w\xA0-\uFFFF]))(?:(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*)\(\s*|\]\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*\{)/,lookbehind:!0,inside:c.languages.javascript}],constant:/\b[A-Z](?:[A-Z_]|\dx?)*\b/});c.languages.insertBefore("javascript","string",{hashbang:{pattern:/^#!.*/,greedy:!0,alias:"comment"},"template-string":{pattern:/`(?:\\[\s\S]|\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}|(?!\$\{)[^\\`])*`/,greedy:!0,inside:{"template-punctuation":{pattern:/^`|`$/,alias:"string"},interpolation:{pattern:/((?:^|[^\\])(?:\\{2})*)\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}/,lookbehind:!0,inside:{"interpolation-punctuation":{pattern:/^\$\{|\}$/,alias:"punctuation"},rest:c.languages.javascript}},string:/[\s\S]+/}},"string-property":{pattern:/((?:^|[,{])[ \t]*)(["'])(?:\\(?:\r\n|[\s\S])|(?!\2)[^\\\r\n])*\2(?=\s*:)/m,lookbehind:!0,greedy:!0,alias:"property"}});c.languages.insertBefore("javascript","operator",{"literal-property":{pattern:/((?:^|[,{])[ \t]*)(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*:)/m,lookbehind:!0,alias:"property"}});c.languages.markup&&(c.languages.markup.tag.addInlined("script","javascript"),c.languages.markup.tag.addAttribute(/on(?:abort|blur|change|click|composition(?:end|start|update)|dblclick|error|focus(?:in|out)?|key(?:down|up)|load|mouse(?:down|enter|leave|move|out|over|up)|reset|resize|scroll|select|slotchange|submit|unload|wheel)/.source,"javascript"));c.languages.js=c.languages.javascript;(function(){if(typeof c>"u"||typeof document>"u")return;Element.prototype.matches||(Element.prototype.matches=Element.prototype.msMatchesSelector||Element.prototype.webkitMatchesSelector);var t="Loading\u2026",e=function(x,_){return"\u2716 Error "+x+" while fetching file: "+_},r="\u2716 Error: File does not exist or is empty",i={js:"javascript",py:"python",rb:"ruby",ps1:"powershell",psm1:"powershell",sh:"bash",bat:"batch",h:"c",tex:"latex"},n="data-src-status",p="loading",h="loaded",m="failed",v="pre[data-src]:not(["+n+'="'+h+'"]):not(['+n+'="'+p+'"])';function E(x,_,T){var s=new XMLHttpRequest;s.open("GET",x,!0),s.onreadystatechange=function(){s.readyState==4&&(s.status<400&&s.responseText?_(s.responseText):s.status>=400?T(e(s.status,s.statusText)):T(r))},s.send(null)}function w(x){var _=/^\s*(\d+)\s*(?:(,)\s*(?:(\d+)\s*)?)?$/.exec(x||"");if(_){var T=Number(_[1]),s=_[2],a=_[3];return s?a?[T,Number(a)]:[T,void 0]:[T,T]}}c.hooks.add("before-highlightall",function(x){x.selector+=", "+v}),c.hooks.add("before-sanity-check",function(x){var _=x.element;if(_.matches(v)){x.code="",_.setAttribute(n,p);var T=_.appendChild(document.createElement("CODE"));T.textContent=t;var s=_.getAttribute("data-src"),a=x.language;if(a==="none"){var l=(/\.(\w+)$/.exec(s)||[,"none"])[1];a=i[l]||l}c.util.setLanguage(T,a),c.util.setLanguage(_,a);var o=c.plugins.autoloader;o&&o.loadLanguages(a),E(s,function(u){_.setAttribute(n,h);var f=w(_.getAttribute("data-range"));if(f){var b=u.split(/\r\n?|\n/g),d=f[0],A=f[1]==null?b.length:f[1];d<0&&(d+=b.length),d=Math.max(0,Math.min(d-1,b.length)),A<0&&(A+=b.length),A=Math.max(0,Math.min(A,b.length)),u=b.slice(d,A).join(`
-`),_.hasAttribute("data-start")||_.setAttribute("data-start",String(d+1))}T.textContent=u,c.highlightElement(T)},function(u){_.setAttribute(n,m),T.textContent=u})}}),c.plugins.fileHighlight={highlight:function(_){for(var T=(_||document).querySelectorAll(v),s=0,a;a=T[s++];)c.highlightElement(a)}};var F=!1;c.fileHighlight=function(){F||(console.warn("Prism.fileHighlight is deprecated. Use `Prism.plugins.fileHighlight.highlight` instead."),F=!0),c.plugins.fileHighlight.highlight.apply(this,arguments)}})()});var we=O((wr,gt)=>{gt.exports={...qe()}});var nr={};Et(nr,{BUILD_ID:()=>rr,TempleComponent:()=>k.TempleComponent,TempleElement:()=>k.TempleElement,TempleEmitter:()=>k.TempleEmitter,TempleException:()=>k.TempleException,TempleRegistry:()=>k.TempleRegistry,children:()=>k.children,components:()=>tr,data:()=>k.data,emitter:()=>k.emitter,props:()=>k.props,signal:()=>k.signal});var D=L(N());var ve=L(N()),Z=class extends ve.TempleComponent{static component=["main","Main_fd7f1af6410c5b5c8e1f"];styles(){return""}template(){let e=this.props,r=()=>this.originalChildren;return()=>[ve.TempleRegistry.createElement("main",{},[...this._toNodeList(r())]).element]}};var y=L(N()),Re=L(pt()),ht=L(we()),W=class extends y.TempleComponent{static component=["code","Code_6f36bc13bb6a166c7abc"];styles(){return`:host {
+var TempleAPI=(()=>{var Ot=Object.create;var Fe=Object.defineProperty;var $t=Object.getOwnPropertyDescriptor;var Nt=Object.getOwnPropertyNames;var Rt=Object.getPrototypeOf,qt=Object.prototype.hasOwnProperty;var D=(t,e)=>()=>(e||t((e={exports:{}}).exports,e),e.exports),It=(t,e)=>{for(var n in e)Fe(t,n,{get:e[n],enumerable:!0})},lt=(t,e,n,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let r of Nt(e))!qt.call(t,r)&&r!==n&&Fe(t,r,{get:()=>e[r],enumerable:!(i=$t(e,r))||i.enumerable});return t};var P=(t,e,n)=>(n=t!=null?Ot(Rt(t)):{},lt(e||!t||!t.__esModule?Fe(n,"default",{value:t,enumerable:!0}):n,t)),Ht=t=>lt(Fe({},"__esModule",{value:!0}),t);var ue=D(Ue=>{"use strict";Object.defineProperty(Ue,"__esModule",{value:!0});var We=class extends Error{static for(e,...n){return n.forEach(function(i){e=e.replace("%s",i)}),new this(e)}static forErrorsFound(e){let n=new this("Invalid Parameters");return n.errors=e,n}static require(e,n,...i){if(!e){for(let r of i)n=n.replace("%s",r);throw new this(n)}}constructor(e,n=500){super(),this.errors={},this.start=0,this.end=0,this.message=e,this.name=this.constructor.name,this.code=n}withCode(e){return this.code=e,this}withPosition(e,n){return this.start=e,this.end=n,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};Ue.default=We});var Pe=D(j=>{"use strict";var zt=j&&j.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(j,"__esModule",{value:!0});j.match=j.TempleEmitter=j.events=void 0;j.bindAttribute=B;j.unbindAttribute=ut;var ot=zt(Se());j.events=["click","dblclick","mousedown","mouseup","mousemove","mouseover","mouseout","wheel","keydown","keypress","keyup","blur","change","contextmenu","focus","input","submit","invalid","reset","search","select","copy","cut","paste","drag","dragstart","dragend","dragover","dragenter","dragleave","drop","scroll","durationchange","ended","error","loadeddata","loadedmetadata","loadstart","pause","play","playing","progress","ratechange","seeked","seeking","stalled","suspend","timeupdate","volumechange","waiting","animationstart","animationend","animationiteration","transitionend","toggle"];var ke=class extends EventTarget{emit(e,n){return this.dispatchEvent(new CustomEvent(e,{detail:n})),this}on(e,n){if(e==="ready"&&document.readyState!=="loading"){let i=new CustomEvent("ready");return setTimeout(()=>n(i),1),this}return this.addEventListener(e,n),this}once(e,n){let i=r=>{this.unbind(e,i),n(r)};return this.on(e,i),this}unbind(e,n){return this.removeEventListener(e,n),this}};j.TempleEmitter=ke;var Bt=(t,e)=>Array.from(t.querySelectorAll("*")).filter(n=>{let i=ot.default.get(n),r=i&&i.hasAttribute(e)&&!i.hasEvent(e);return r&&i.addEvent(e),r}).map(n=>ot.default.get(n));j.match=Bt;function B(t,e){Le.on("mounted",n=>{if(!n.detail)return;let i=n.detail;(0,j.match)(i.shadowRoot||i,t).forEach(e)})}function ut(t,e){Le.on("unmounted",n=>{if(!n.detail)return;let i=n.detail;(0,j.match)(i.shadowRoot||i,t).forEach(e)})}var Le=new ke;j.default=(document.onreadystatechange=()=>{document.readyState!=="loading"&&Le.emit("ready")},B("mount",t=>{let e=t.getAttribute("mount");if(typeof e=="function"){let n=new CustomEvent("mount",{detail:{node:t,target:t.element}});e(n)}}),ut("unmount",t=>{let e=t.getAttribute("unmount");if(typeof e=="function"){let n=new CustomEvent("unmount",{detail:{node:t,target:t.element}});e(n)}}),B("connect",t=>{let e=t.getAttribute("connect");if(typeof e=="function"){let n=new CustomEvent("connect",{detail:{node:t,target:t.element}});e(n)}}),B("disconnect",t=>{let e=t.getAttribute("disconnect");if(typeof e=="function"){let n=new CustomEvent("disconnect",{detail:{node:t,target:t.element}});e(n)}}),B("adopt",t=>{let e=t.getAttribute("adopt");if(typeof e=="function"){let n=new CustomEvent("adopt",{detail:{node:t,target:t.element}});e(n)}}),B("if",t=>{let e=t.getAttribute("if");(e===!1||e==="false"||typeof e=="function"&&!e())&&t.element.remove()}),j.events.forEach(t=>B(t,e=>{let n=e.getAttribute(t);typeof n=="function"&&(e.element.removeEventListener(t,n),e.element.addEventListener(t,n))})),Le)});var Xe=D(ce=>{"use strict";var Gt=ce&&ce.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ce,"__esModule",{value:!0});var Ze=Gt(Pe()),Je=class{get attributes(){return Object.assign({},this._attributes)}get element(){return this._element}get events(){return this._events}constructor(e,n){this._events=new Set,this._element=e,this._attributes=n}addEvent(e){return this._events.add(e),this}getAttribute(e){return this._attributes[e]}hasAttribute(e){return e in this._attributes}hasEvent(e){return this._events.has(e)}removeAttribute(e,n=!1){let i=this.getAttribute(e);return typeof i>"u"?this:(delete this._attributes[e],this._element.removeAttribute(e),n||Ze.default.emit("attribute-remove",{element:this,key:e,previous:i}),this)}setAttribute(e,n,i=!1){if(typeof n>"u")return this.removeAttribute(e,i);let r=this.getAttribute(e);return r===n?this:(this._attributes[e]=n,typeof n=="string"&&this._element.setAttribute(e,n),i||(typeof r>"u"?Ze.default.emit("attribute-create",{element:this,key:e,value:n}):Ze.default.emit("attribute-update",{element:this,key:e,value:n,previous:r})),this)}setAttributes(e,n=!1){for(let[r,d]of Object.entries(e))this.setAttribute(r,d,n);let i=Object.keys(e);for(let r of Object.keys(this._attributes))i.includes(r)||this.removeAttribute(r,n);return this}};ce.default=Je});var Se=D(de=>{"use strict";var Wt=de&&de.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(de,"__esModule",{value:!0});var Ut=Wt(Xe()),ct=document.createElement("textarea"),Zt=t=>(ct.innerHTML=t,ct.value),Ce=class{static get elements(){return this._elements}static createComponent(e,n,i,r=[]){let d=document.createElement("template");d.innerHTML=`<${e}>`;let m=d.content.querySelector(`${e}`);return Object.setPrototypeOf(m,n.prototype),m.constructor=n.constructor,m.constructor.component=n.component,m.register(i,r),m.element}static createElement(e,n,i=[]){let r=document.createElement(e);for(let[d,b]of Object.entries(n))typeof b=="string"?r.setAttribute(d,b):b===!0&&r.setAttribute(d,d);return i.filter(d=>typeof d<"u").forEach(d=>r.appendChild(d)),this.register(r,n)}static createText(e,n=!0){return document.createTextNode(Zt(e))}static filter(e){let n=[];return this._elements.forEach((i,r)=>{e(i,r)&&n.push(i)}),n}static get(e){return this._elements.get(e)||null}static has(e){return this._elements.has(e)}static map(e){let n=[];return this._elements.forEach((i,r)=>{n.push(e(i,r))}),n}static register(e,n){if(this.has(e))return this.get(e);let i=new Ut.default(e,n||{});return this._elements.set(e,i),i}};Ce._elements=new Map;de.default=Ce});var Y=D(fe=>{"use strict";Object.defineProperty(fe,"__esModule",{value:!0});fe.TempleDataMap=void 0;var De=class{constructor(){window.__APP_DATA__||(window.__APP_DATA__={})}clear(){return window.__APP_DATA__={},this}delete(e){return this.has(e)?(delete window.__APP_DATA__[e],!0):!1}entries(){return Object.entries(window.__APP_DATA__)}has(e){return e in window.__APP_DATA__}get(e){return window.__APP_DATA__[e]}keys(){return Object.keys(window.__APP_DATA__)}set(e,n){return window.__APP_DATA__[e]=n,this}values(){return Object.values(window.__APP_DATA__)}};fe.TempleDataMap=De;var Jt=new De;fe.default=Jt});var ft=D(pe=>{"use strict";var Me=pe&&pe.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(pe,"__esModule",{value:!0});var dt=Me(ue()),G=Me(Se()),W=Me(Pe()),je=Me(Y()),Ye=class t extends HTMLElement{static register(){customElements.define(this.component[0],this)}get attr(){return Object.fromEntries(Array.from(this.attributes).map(e=>[e.name,e.value]))}get element(){if(!G.default.has(this))throw dt.default.for("Component not mapped.");return G.default.get(this)}get metadata(){let[e,n]=this.constructor.component;return{tagname:e,classname:n}}get originalChildren(){return this._children}get initiated(){return this._initiated}get props(){return this.getAttributes()}get virtual(){return this._virtual}set props(e){this.setAttributes(e)}constructor(){if(super(),this._initiated=!1,this._template=null,this._children=void 0,this._rendering=!1,this._observer=null,this._virtual=!1,!G.default.has(this))throw dt.default.for("Component not mapped.")}adoptedCallback(){this.render(),W.default.emit("adopt",this)}connectedCallback(){this.wait(),W.default.emit("connect",this)}disconnectedCallback(){W.default.emit("disconnect",this)}getAttribute(e){return this.element.getAttribute(e)}getAttributes(){return Object.assign({},this.element.attributes)}getParentComponent(){let e=this.parentElement;for(;e;){if(e instanceof t)return e;e=e.parentElement}return null}hasAttribute(e){return this.element.hasAttribute(e)}register(e={},n=[]){G.default.has(this)?G.default.get(this).setAttributes(e):G.default.register(this,e);for(let[i,r]of Object.entries(e))typeof r=="string"?super.setAttribute(i,r):r===!0&&super.setAttribute(i,i);this._children=n,this._virtual=!0,this.connectedCallback()}removeAttribute(e){this.hasAttribute(e)&&this.element.removeAttribute(e),super.hasAttribute(e)&&super.removeAttribute(e)}render(){let e=this.getParentComponent();if(e&&!e.initiated)return;if(this._rendering)return;this._rendering=!0;let n=je.default.get("current");je.default.set("current",this);let i=this.styles();this._template?W.default.emit("unmounted",this):this._template=this.template();let r=this._template().filter(Boolean);if(i.length===0)this.textContent="",r.forEach(d=>this.appendChild(d));else{this.shadowRoot||this.attachShadow({mode:"open"});let d=this.shadowRoot;this.textContent="",d.textContent="";let b=document.createElement("style");b.innerText=i,d.appendChild(b),r.forEach(m=>{var v;return(v=this.shadowRoot)===null||v===void 0?void 0:v.appendChild(m)})}return n?je.default.set("current",n):je.default.delete("current"),this._initiated=!0,this._rendering=!1,W.default.emit("mounted",this),this.shadowRoot?this.shadowRoot.innerHTML:this.innerHTML}setAttribute(e,n){this.element.setAttribute(e,n),(typeof n=="string"||n===!0)&&super.setAttribute(e,n)}setAttributes(e){this.element.setAttributes(e)}wait(){if(document.readyState!=="loading")this._update();else{let e=()=>{this._update(),W.default.unbind("ready",e)};W.default.on("ready",e)}}_toNodeList(e){return e instanceof Node?[e]:Array.isArray(e)&&e.every(n=>n instanceof Node)?e:[G.default.createText(String(e))]}_update(){typeof this._children>"u"&&(this._children=Array.from(this.childNodes||[])),this._initiated||this.render()}};pe.default=Ye});var V=D(he=>{"use strict";var pt=he&&he.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(he,"__esModule",{value:!0});he.default=Vt;var Xt=pt(ue()),Yt=pt(Y());function Vt(t=null,e=!1){if(!t&&(t=Yt.default.get("current"),!t)){if(!e)throw Xt.default.for("Not called within a Temple component");return null}return t}});var ht=D(me=>{"use strict";var Kt=me&&me.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(me,"__esModule",{value:!0});var Qt=Kt(Y());function en(t){let e=Qt.default.get("env")||{};return t?e[t]||null:e}me.default=en});var Ve=D(ge=>{"use strict";var mt=ge&&ge.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ge,"__esModule",{value:!0});ge.default=rn;var tn=mt(V()),nn=mt(Y());function rn(t=null){let e=(0,tn.default)(t,!0);return typeof e=="string"?nn.default.get("props")||{}:e?e.props:{}}});var bt=D(K=>{"use strict";var gt=K&&K.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(K,"__esModule",{value:!0});K.classlist=ln;K.default=on;var sn=gt(V()),an=gt(Ve());function ln(t=null){var e;if(t==="body")return document.body.classList;if(t==="head")return document.head.classList;if(t==="document")return(e=document.body.parentElement)===null||e===void 0?void 0:e.classList;let n=(0,sn.default)(t);return n?.classList}function on(t=null){return(0,an.default)(t).class}});var _t=D(U=>{"use strict";var un=U&&U.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(U,"__esModule",{value:!0});U.innerHTML=dn;U.innerText=fn;U.default=Ke;var cn=un(V());function dn(t=null){let e=Ke(t),n=document.createElement("template");return n.append(...e.map(i=>i.cloneNode(!0))),n.innerHTML}function fn(t=null){let e=Ke(t),n=document.createElement("template");return n.append(...e.map(i=>i.cloneNode(!0))),n.innerText}function Ke(t=null){let e=(0,cn.default)(t,!0);return typeof e!="string"&&e?e.originalChildren||[]:[]}});var yt=D(Z=>{"use strict";var vt=Z&&Z.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Z,"__esModule",{value:!0});Z.SignalRegistry=void 0;Z.default=mn;var pn=vt(V()),hn=vt(ue()),Q=class t{static observe(e,n){let i={getter:()=>d.raw,setter:m=>m},r=new Set,d={raw:n,change(m){r.add(m)},getter(m){return i.getter=m,d},setter(m){return i.setter=m,d}};Object.defineProperty(d,"value",{get(){return i.getter()},set(m){let v=i.setter(m),A=t.serialize(v)!==t.serialize(d.raw);d.raw=v,A&&(r.forEach(g=>g(v)),e.render())}});let b=this._observers.get(e);return b?(b.observed++,b.values.push(d)):this._observers.set(e,{observed:1,values:[d]}),d}static observer(e){return this._observers.get(e)||null}static serialize(e){return JSON.stringify(e)}};Z.SignalRegistry=Q;Q._observers=new Map;function mn(t,e=null){let n=(0,pn.default)(e);if(!n.initiated)return Q.observe(n,t);let i=Q.observer(n);if(!i)throw hn.default.for("Signal state mismatch");return i.values[i.observed++%i.values.length]}});var et=D(h=>{"use strict";var gn=h&&h.__createBinding||(Object.create?function(t,e,n,i){i===void 0&&(i=n);var r=Object.getOwnPropertyDescriptor(e,n);(!r||("get"in r?!e.__esModule:r.writable||r.configurable))&&(r={enumerable:!0,get:function(){return e[n]}}),Object.defineProperty(t,i,r)}:function(t,e,n,i){i===void 0&&(i=n),t[i]=e[n]}),bn=h&&h.__setModuleDefault||(Object.create?function(t,e){Object.defineProperty(t,"default",{enumerable:!0,value:e})}:function(t,e){t.default=e}),be=h&&h.__importStar||function(t){if(t&&t.__esModule)return t;var e={};if(t!=null)for(var n in t)n!=="default"&&Object.prototype.hasOwnProperty.call(t,n)&&gn(e,t,n);return bn(e,t),e},J=h&&h.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(h,"__esModule",{value:!0});h.SignalRegistry=h.TempleException=h.TempleEmitter=h.TempleElement=h.TempleRegistry=h.TempleComponent=h.TempleDataMap=h.emitter=h.signal=h.innerHTML=h.innerText=h.children=h.classnames=h.classlist=h.props=h.env=h.data=h.component=void 0;var _n=J(ue());h.TempleException=_n.default;var vn=J(ft());h.TempleComponent=vn.default;var yn=J(Se());h.TempleRegistry=yn.default;var xn=J(Xe());h.TempleElement=xn.default;var xt=be(Pe());h.emitter=xt.default;Object.defineProperty(h,"TempleEmitter",{enumerable:!0,get:function(){return xt.TempleEmitter}});var An=J(V());h.component=An.default;var At=be(Y());h.data=At.default;Object.defineProperty(h,"TempleDataMap",{enumerable:!0,get:function(){return At.TempleDataMap}});var wn=J(ht());h.env=wn.default;var Tn=J(Ve());h.props=Tn.default;var wt=be(bt());h.classnames=wt.default;Object.defineProperty(h,"classlist",{enumerable:!0,get:function(){return wt.classlist}});var Qe=be(_t());h.children=Qe.default;Object.defineProperty(h,"innerHTML",{enumerable:!0,get:function(){return Qe.innerHTML}});Object.defineProperty(h,"innerText",{enumerable:!0,get:function(){return Qe.innerText}});var Tt=be(yt());h.signal=Tt.default;Object.defineProperty(h,"SignalRegistry",{enumerable:!0,get:function(){return Tt.SignalRegistry}})});var R=D((Gn,Et)=>{Et.exports={...et()}});var I=D((Wn,Ft)=>{Ft.exports={...et()}});var Lt=D((Kn,Ie)=>{var En=typeof window<"u"?window:typeof WorkerGlobalScope<"u"&&self instanceof WorkerGlobalScope?self:{};var c=function(t){var e=/(?:^|\s)lang(?:uage)?-([\w-]+)(?=\s|$)/i,n=0,i={},r={manual:t.Prism&&t.Prism.manual,disableWorkerMessageHandler:t.Prism&&t.Prism.disableWorkerMessageHandler,util:{encode:function a(s){return s instanceof d?new d(s.type,a(s.content),s.alias):Array.isArray(s)?s.map(a):s.replace(/&/g,"&").replace(/"u")return null;if("currentScript"in document)return document.currentScript;try{throw new Error}catch(o){var a=(/at [^(\r\n]*\((.*):[^:]+:[^:]+\)$/i.exec(o.stack)||[])[1];if(a){var s=document.getElementsByTagName("script");for(var l in s)if(s[l].src==a)return s[l]}return null}},isActive:function(a,s,l){for(var o="no-"+s;a;){var u=a.classList;if(u.contains(s))return!0;if(u.contains(o))return!1;a=a.parentElement}return!!l}},languages:{plain:i,plaintext:i,text:i,txt:i,extend:function(a,s){var l=r.util.clone(r.languages[a]);for(var o in s)l[o]=s[o];return l},insertBefore:function(a,s,l,o){o=o||r.languages;var u=o[a],p={};for(var _ in u)if(u.hasOwnProperty(_)){if(_==s)for(var f in l)l.hasOwnProperty(f)&&(p[f]=l[f]);l.hasOwnProperty(_)||(p[_]=u[_])}var T=o[a];return o[a]=p,r.languages.DFS(r.languages,function(S,H){H===T&&S!=a&&(this[S]=p)}),p},DFS:function a(s,l,o,u){u=u||{};var p=r.util.objId;for(var _ in s)if(s.hasOwnProperty(_)){l.call(s,_,s[_],o||_);var f=s[_],T=r.util.type(f);T==="Object"&&!u[p(f)]?(u[p(f)]=!0,a(f,l,null,u)):T==="Array"&&!u[p(f)]&&(u[p(f)]=!0,a(f,l,_,u))}}},plugins:{},highlightAll:function(a,s){r.highlightAllUnder(document,a,s)},highlightAllUnder:function(a,s,l){var o={callback:l,container:a,selector:'code[class*="language-"], [class*="language-"] code, code[class*="lang-"], [class*="lang-"] code'};r.hooks.run("before-highlightall",o),o.elements=Array.prototype.slice.apply(o.container.querySelectorAll(o.selector)),r.hooks.run("before-all-elements-highlight",o);for(var u=0,p;p=o.elements[u++];)r.highlightElement(p,s===!0,o.callback)},highlightElement:function(a,s,l){var o=r.util.getLanguage(a),u=r.languages[o];r.util.setLanguage(a,o);var p=a.parentElement;p&&p.nodeName.toLowerCase()==="pre"&&r.util.setLanguage(p,o);var _=a.textContent,f={element:a,language:o,grammar:u,code:_};function T(H){f.highlightedCode=H,r.hooks.run("before-insert",f),f.element.innerHTML=f.highlightedCode,r.hooks.run("after-highlight",f),r.hooks.run("complete",f),l&&l.call(f.element)}if(r.hooks.run("before-sanity-check",f),p=f.element.parentElement,p&&p.nodeName.toLowerCase()==="pre"&&!p.hasAttribute("tabindex")&&p.setAttribute("tabindex","0"),!f.code){r.hooks.run("complete",f),l&&l.call(f.element);return}if(r.hooks.run("before-highlight",f),!f.grammar){T(r.util.encode(f.code));return}if(s&&t.Worker){var S=new Worker(r.filename);S.onmessage=function(H){T(H.data)},S.postMessage(JSON.stringify({language:f.language,code:f.code,immediateClose:!0}))}else T(r.highlight(f.code,f.grammar,f.language))},highlight:function(a,s,l){var o={code:a,grammar:s,language:l};if(r.hooks.run("before-tokenize",o),!o.grammar)throw new Error('The language "'+o.language+'" has no grammar.');return o.tokens=r.tokenize(o.code,o.grammar),r.hooks.run("after-tokenize",o),d.stringify(r.util.encode(o.tokens),o.language)},tokenize:function(a,s){var l=s.rest;if(l){for(var o in l)s[o]=l[o];delete s.rest}var u=new v;return A(u,u.head,a),m(a,u,s,u.head,0),w(u)},hooks:{all:{},add:function(a,s){var l=r.hooks.all;l[a]=l[a]||[],l[a].push(s)},run:function(a,s){var l=r.hooks.all[a];if(!(!l||!l.length))for(var o=0,u;u=l[o++];)u(s)}},Token:d};t.Prism=r;function d(a,s,l,o){this.type=a,this.content=s,this.alias=l,this.length=(o||"").length|0}d.stringify=function a(s,l){if(typeof s=="string")return s;if(Array.isArray(s)){var o="";return s.forEach(function(T){o+=a(T,l)}),o}var u={type:s.type,content:a(s.content,l),tag:"span",classes:["token",s.type],attributes:{},language:l},p=s.alias;p&&(Array.isArray(p)?Array.prototype.push.apply(u.classes,p):u.classes.push(p)),r.hooks.run("wrap",u);var _="";for(var f in u.attributes)_+=" "+f+'="'+(u.attributes[f]||"").replace(/"/g,""")+'"';return"<"+u.tag+' class="'+u.classes.join(" ")+'"'+_+">"+u.content+""};function b(a,s,l,o){a.lastIndex=s;var u=a.exec(l);if(u&&o&&u[1]){var p=u[1].length;u.index+=p,u[0]=u[0].slice(p)}return u}function m(a,s,l,o,u,p){for(var _ in l)if(!(!l.hasOwnProperty(_)||!l[_])){var f=l[_];f=Array.isArray(f)?f:[f];for(var T=0;T=p.reach);q+=C.value.length,C=C.next){var X=C.value;if(s.length>a.length)return;if(!(X instanceof d)){var Ae=1,N;if(st){if(N=b(at,q,a,rt),!N||N.index>=a.length)break;var we=N.index,jt=N.index+N[0].length,z=q;for(z+=C.value.length;we>=z;)C=C.next,z+=C.value.length;if(z-=C.value.length,q=z,C.value instanceof d)continue;for(var oe=C;oe!==s.tail&&(zp.reach&&(p.reach=Be);var Ee=C.prev;ze&&(Ee=A(s,Ee,ze),q+=ze.length),g(s,Ee,Ae);var Mt=new d(_,H?r.tokenize(Te,H):Te,Ct,Te);if(C=A(s,Ee,Mt),it&&A(s,C,it),Ae>1){var Ge={cause:_+","+T,reach:Be};m(a,s,l,C.prev,q,Ge),p&&Ge.reach>p.reach&&(p.reach=Ge.reach)}}}}}}function v(){var a={value:null,prev:null,next:null},s={value:null,prev:a,next:null};a.next=s,this.head=a,this.tail=s,this.length=0}function A(a,s,l){var o=s.next,u={value:l,prev:s,next:o};return s.next=u,o.prev=u,a.length++,u}function g(a,s,l){for(var o=s.next,u=0;u/,greedy:!0},prolog:{pattern:/<\?[\s\S]+?\?>/,greedy:!0},doctype:{pattern:/"'[\]]|"[^"]*"|'[^']*')+(?:\[(?:[^<"'\]]|"[^"]*"|'[^']*'|<(?!!--)|)*\]\s*)?>/i,greedy:!0,inside:{"internal-subset":{pattern:/(^[^\[]*\[)[\s\S]+(?=\]>$)/,lookbehind:!0,greedy:!0,inside:null},string:{pattern:/"[^"]*"|'[^']*'/,greedy:!0},punctuation:/^$|[[\]]/,"doctype-tag":/^DOCTYPE/i,name:/[^\s<>'"]+/}},cdata:{pattern://i,greedy:!0},tag:{pattern:/<\/?(?!\d)[^\s>\/=$<%]+(?:\s(?:\s*[^\s>\/=]+(?:\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))|(?=[\s/>])))+)?\s*\/?>/,greedy:!0,inside:{tag:{pattern:/^<\/?[^\s>\/]+/,inside:{punctuation:/^<\/?/,namespace:/^[^\s>\/:]+:/}},"special-attr":[],"attr-value":{pattern:/=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+)/,inside:{punctuation:[{pattern:/^=/,alias:"attr-equals"},{pattern:/^(\s*)["']|["']$/,lookbehind:!0}]}},punctuation:/\/?>/,"attr-name":{pattern:/[^\s>\/]+/,inside:{namespace:/^[^\s>\/:]+:/}}}},entity:[{pattern:/&[\da-z]{1,8};/i,alias:"named-entity"},/&#x?[\da-f]{1,8};/i]};c.languages.markup.tag.inside["attr-value"].inside.entity=c.languages.markup.entity;c.languages.markup.doctype.inside["internal-subset"].inside=c.languages.markup;c.hooks.add("wrap",function(t){t.type==="entity"&&(t.attributes.title=t.content.replace(/&/,"&"))});Object.defineProperty(c.languages.markup.tag,"addInlined",{value:function(e,n){var i={};i["language-"+n]={pattern:/(^$)/i,lookbehind:!0,inside:c.languages[n]},i.cdata=/^$/i;var r={"included-cdata":{pattern://i,inside:i}};r["language-"+n]={pattern:/[\s\S]+/,inside:c.languages[n]};var d={};d[e]={pattern:RegExp(/(<__[^>]*>)(?:))*\]\]>|(?!)/.source.replace(/__/g,function(){return e}),"i"),lookbehind:!0,greedy:!0,inside:r},c.languages.insertBefore("markup","cdata",d)}});Object.defineProperty(c.languages.markup.tag,"addAttribute",{value:function(t,e){c.languages.markup.tag.inside["special-attr"].push({pattern:RegExp(/(^|["'\s])/.source+"(?:"+t+")"+/\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))/.source,"i"),lookbehind:!0,inside:{"attr-name":/^[^\s=]+/,"attr-value":{pattern:/=[\s\S]+/,inside:{value:{pattern:/(^=\s*(["']|(?!["'])))\S[\s\S]*(?=\2$)/,lookbehind:!0,alias:[e,"language-"+e],inside:c.languages[e]},punctuation:[{pattern:/^=/,alias:"attr-equals"},/"|'/]}}}})}});c.languages.html=c.languages.markup;c.languages.mathml=c.languages.markup;c.languages.svg=c.languages.markup;c.languages.xml=c.languages.extend("markup",{});c.languages.ssml=c.languages.xml;c.languages.atom=c.languages.xml;c.languages.rss=c.languages.xml;(function(t){var e=/(?:"(?:\\(?:\r\n|[\s\S])|[^"\\\r\n])*"|'(?:\\(?:\r\n|[\s\S])|[^'\\\r\n])*')/;t.languages.css={comment:/\/\*[\s\S]*?\*\//,atrule:{pattern:RegExp("@[\\w-](?:"+/[^;{\s"']|\s+(?!\s)/.source+"|"+e.source+")*?"+/(?:;|(?=\s*\{))/.source),inside:{rule:/^@[\w-]+/,"selector-function-argument":{pattern:/(\bselector\s*\(\s*(?![\s)]))(?:[^()\s]|\s+(?![\s)])|\((?:[^()]|\([^()]*\))*\))+(?=\s*\))/,lookbehind:!0,alias:"selector"},keyword:{pattern:/(^|[^\w-])(?:and|not|only|or)(?![\w-])/,lookbehind:!0}}},url:{pattern:RegExp("\\burl\\((?:"+e.source+"|"+/(?:[^\\\r\n()"']|\\[\s\S])*/.source+")\\)","i"),greedy:!0,inside:{function:/^url/i,punctuation:/^\(|\)$/,string:{pattern:RegExp("^"+e.source+"$"),alias:"url"}}},selector:{pattern:RegExp(`(^|[{}\\s])[^{}\\s](?:[^{};"'\\s]|\\s+(?![\\s{])|`+e.source+")*(?=\\s*\\{)"),lookbehind:!0},string:{pattern:e,greedy:!0},property:{pattern:/(^|[^-\w\xA0-\uFFFF])(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*(?=\s*:)/i,lookbehind:!0},important:/!important\b/i,function:{pattern:/(^|[^-a-z0-9])[-a-z0-9]+(?=\()/i,lookbehind:!0},punctuation:/[(){};:,]/},t.languages.css.atrule.inside.rest=t.languages.css;var n=t.languages.markup;n&&(n.tag.addInlined("style","css"),n.tag.addAttribute("style","css"))})(c);c.languages.clike={comment:[{pattern:/(^|[^\\])\/\*[\s\S]*?(?:\*\/|$)/,lookbehind:!0,greedy:!0},{pattern:/(^|[^\\:])\/\/.*/,lookbehind:!0,greedy:!0}],string:{pattern:/(["'])(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/,greedy:!0},"class-name":{pattern:/(\b(?:class|extends|implements|instanceof|interface|new|trait)\s+|\bcatch\s+\()[\w.\\]+/i,lookbehind:!0,inside:{punctuation:/[.\\]/}},keyword:/\b(?:break|catch|continue|do|else|finally|for|function|if|in|instanceof|new|null|return|throw|try|while)\b/,boolean:/\b(?:false|true)\b/,function:/\b\w+(?=\()/,number:/\b0x[\da-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:e[+-]?\d+)?/i,operator:/[<>]=?|[!=]=?=?|--?|\+\+?|&&?|\|\|?|[?*/~^%]/,punctuation:/[{}[\];(),.:]/};c.languages.javascript=c.languages.extend("clike",{"class-name":[c.languages.clike["class-name"],{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$A-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\.(?:constructor|prototype))/,lookbehind:!0}],keyword:[{pattern:/((?:^|\})\s*)catch\b/,lookbehind:!0},{pattern:/(^|[^.]|\.\.\.\s*)\b(?:as|assert(?=\s*\{)|async(?=\s*(?:function\b|\(|[$\w\xA0-\uFFFF]|$))|await|break|case|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally(?=\s*(?:\{|$))|for|from(?=\s*(?:['"]|$))|function|(?:get|set)(?=\s*(?:[#\[$\w\xA0-\uFFFF]|$))|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)\b/,lookbehind:!0}],function:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*(?:\.\s*(?:apply|bind|call)\s*)?\()/,number:{pattern:RegExp(/(^|[^\w$])/.source+"(?:"+(/NaN|Infinity/.source+"|"+/0[bB][01]+(?:_[01]+)*n?/.source+"|"+/0[oO][0-7]+(?:_[0-7]+)*n?/.source+"|"+/0[xX][\dA-Fa-f]+(?:_[\dA-Fa-f]+)*n?/.source+"|"+/\d+(?:_\d+)*n/.source+"|"+/(?:\d+(?:_\d+)*(?:\.(?:\d+(?:_\d+)*)?)?|\.\d+(?:_\d+)*)(?:[Ee][+-]?\d+(?:_\d+)*)?/.source)+")"+/(?![\w$])/.source),lookbehind:!0},operator:/--|\+\+|\*\*=?|=>|&&=?|\|\|=?|[!=]==|<<=?|>>>?=?|[-+*/%&|^!=<>]=?|\.{3}|\?\?=?|\?\.?|[~:]/});c.languages.javascript["class-name"][0].pattern=/(\b(?:class|extends|implements|instanceof|interface|new)\s+)[\w.\\]+/;c.languages.insertBefore("javascript","keyword",{regex:{pattern:RegExp(/((?:^|[^$\w\xA0-\uFFFF."'\])\s]|\b(?:return|yield))\s*)/.source+/\//.source+"(?:"+/(?:\[(?:[^\]\\\r\n]|\\.)*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}/.source+"|"+/(?:\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.)*\])*\])*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}v[dgimyus]{0,7}/.source+")"+/(?=(?:\s|\/\*(?:[^*]|\*(?!\/))*\*\/)*(?:$|[\r\n,.;:})\]]|\/\/))/.source),lookbehind:!0,greedy:!0,inside:{"regex-source":{pattern:/^(\/)[\s\S]+(?=\/[a-z]*$)/,lookbehind:!0,alias:"language-regex",inside:c.languages.regex},"regex-delimiter":/^\/|\/$/,"regex-flags":/^[a-z]+$/}},"function-variable":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*[=:]\s*(?:async\s*)?(?:\bfunction\b|(?:\((?:[^()]|\([^()]*\))*\)|(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)\s*=>))/,alias:"function"},parameter:[{pattern:/(function(?:\s+(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)?\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\))/,lookbehind:!0,inside:c.languages.javascript},{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$a-z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*=>)/i,lookbehind:!0,inside:c.languages.javascript},{pattern:/(\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*=>)/,lookbehind:!0,inside:c.languages.javascript},{pattern:/((?:\b|\s|^)(?!(?:as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)(?![$\w\xA0-\uFFFF]))(?:(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*)\(\s*|\]\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*\{)/,lookbehind:!0,inside:c.languages.javascript}],constant:/\b[A-Z](?:[A-Z_]|\dx?)*\b/});c.languages.insertBefore("javascript","string",{hashbang:{pattern:/^#!.*/,greedy:!0,alias:"comment"},"template-string":{pattern:/`(?:\\[\s\S]|\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}|(?!\$\{)[^\\`])*`/,greedy:!0,inside:{"template-punctuation":{pattern:/^`|`$/,alias:"string"},interpolation:{pattern:/((?:^|[^\\])(?:\\{2})*)\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}/,lookbehind:!0,inside:{"interpolation-punctuation":{pattern:/^\$\{|\}$/,alias:"punctuation"},rest:c.languages.javascript}},string:/[\s\S]+/}},"string-property":{pattern:/((?:^|[,{])[ \t]*)(["'])(?:\\(?:\r\n|[\s\S])|(?!\2)[^\\\r\n])*\2(?=\s*:)/m,lookbehind:!0,greedy:!0,alias:"property"}});c.languages.insertBefore("javascript","operator",{"literal-property":{pattern:/((?:^|[,{])[ \t]*)(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*:)/m,lookbehind:!0,alias:"property"}});c.languages.markup&&(c.languages.markup.tag.addInlined("script","javascript"),c.languages.markup.tag.addAttribute(/on(?:abort|blur|change|click|composition(?:end|start|update)|dblclick|error|focus(?:in|out)?|key(?:down|up)|load|mouse(?:down|enter|leave|move|out|over|up)|reset|resize|scroll|select|slotchange|submit|unload|wheel)/.source,"javascript"));c.languages.js=c.languages.javascript;(function(){if(typeof c>"u"||typeof document>"u")return;Element.prototype.matches||(Element.prototype.matches=Element.prototype.msMatchesSelector||Element.prototype.webkitMatchesSelector);var t="Loading\u2026",e=function(E,y){return"\u2716 Error "+E+" while fetching file: "+y},n="\u2716 Error: File does not exist or is empty",i={js:"javascript",py:"python",rb:"ruby",ps1:"powershell",psm1:"powershell",sh:"bash",bat:"batch",h:"c",tex:"latex"},r="data-src-status",d="loading",b="loaded",m="failed",v="pre[data-src]:not(["+r+'="'+b+'"]):not(['+r+'="'+d+'"])';function A(E,y,F){var a=new XMLHttpRequest;a.open("GET",E,!0),a.onreadystatechange=function(){a.readyState==4&&(a.status<400&&a.responseText?y(a.responseText):a.status>=400?F(e(a.status,a.statusText)):F(n))},a.send(null)}function g(E){var y=/^\s*(\d+)\s*(?:(,)\s*(?:(\d+)\s*)?)?$/.exec(E||"");if(y){var F=Number(y[1]),a=y[2],s=y[3];return a?s?[F,Number(s)]:[F,void 0]:[F,F]}}c.hooks.add("before-highlightall",function(E){E.selector+=", "+v}),c.hooks.add("before-sanity-check",function(E){var y=E.element;if(y.matches(v)){E.code="",y.setAttribute(r,d);var F=y.appendChild(document.createElement("CODE"));F.textContent=t;var a=y.getAttribute("data-src"),s=E.language;if(s==="none"){var l=(/\.(\w+)$/.exec(a)||[,"none"])[1];s=i[l]||l}c.util.setLanguage(F,s),c.util.setLanguage(y,s);var o=c.plugins.autoloader;o&&o.loadLanguages(s),A(a,function(u){y.setAttribute(r,b);var p=g(y.getAttribute("data-range"));if(p){var _=u.split(/\r\n?|\n/g),f=p[0],T=p[1]==null?_.length:p[1];f<0&&(f+=_.length),f=Math.max(0,Math.min(f-1,_.length)),T<0&&(T+=_.length),T=Math.max(0,Math.min(T,_.length)),u=_.slice(f,T).join(`
+`),y.hasAttribute("data-start")||y.setAttribute("data-start",String(f+1))}F.textContent=u,c.highlightElement(F)},function(u){y.setAttribute(r,m),F.textContent=u})}}),c.plugins.fileHighlight={highlight:function(y){for(var F=(y||document).querySelectorAll(v),a=0,s;s=F[a++];)c.highlightElement(s)}};var w=!1;c.fileHighlight=function(){w||(console.warn("Prism.fileHighlight is deprecated. Use `Prism.plugins.fileHighlight.highlight` instead."),w=!0),c.plugins.fileHighlight.highlight.apply(this,arguments)}})()});var Pn={};It(Pn,{BUILD_ID:()=>Ln,TempleComponent:()=>L.TempleComponent,TempleElement:()=>L.TempleElement,TempleEmitter:()=>L.TempleEmitter,TempleException:()=>L.TempleException,TempleRegistry:()=>L.TempleRegistry,children:()=>L.children,components:()=>kn,data:()=>L.data,emitter:()=>L.emitter,props:()=>L.props,signal:()=>L.signal});var O=P(R());var kt=P(R()),$=P(I()),ee=class extends kt.TempleComponent{static component=["layout","Layout_9f3ab204ce271feaf6f7"];styles(){return""}template(){(0,$.classlist)().add("relative","w-full","vh","scroll-hidden");let e=(0,$.children)(),n=e.find(g=>g.nodeName.endsWith("PANEL-MAIN")),i=e.find(g=>g.nodeName.endsWith("PANEL-HEAD")),r=e.find(g=>g.nodeName.endsWith("PANEL-FOOT")),d=e.find(g=>g.nodeName.endsWith("PANEL-LEFT")),b=e.find(g=>g.nodeName.endsWith("PANEL-RIGHT")),m={head:!!i,foot:!!r,left:!!d,right:!!b},v=new Set,A={left:!1,right:!1,change:g=>v.add(g)};return n&&$.TempleRegistry.get(n).setAttribute("show",A).setAttribute("layout",m),i&&$.TempleRegistry.get(i).setAttribute("show",A).setAttribute("layout",m),r&&$.TempleRegistry.get(r).setAttribute("show",A).setAttribute("layout",m),d&&$.TempleRegistry.get(d).setAttribute("show",A).setAttribute("layout",m),b&&$.TempleRegistry.get(b).setAttribute("show",A).setAttribute("layout",m),this.toggle=g=>{A[g]=!A[g],v.forEach(w=>w())},()=>[$.TempleRegistry.createText(`
+`,!1),...this._toNodeList(e)]}};var _e=P(R()),Oe=P(I()),te=class extends _e.TempleComponent{static component=["head","Head_2bf4dff19bc88ba4138b"];styles(){return""}template(){let{layout:e,show:n}=this.element.attributes,i=(0,Oe.classlist)(),r=d=>{this.classList.add("absolute","top-0","right-0","h-60","transition-500"),e?.left?(this.classList.remove("left-0"),this.classList.add("left-226")):this.classList.add("left-0"),n.left?(this.classList.remove("md-left-0"),this.classList.add("md-left-226")):(this.classList.remove("md-left-226"),this.classList.add("md-left-0"))};return n.change(r),r(),()=>[_e.TempleRegistry.createText(`
+`,!1),_e.TempleRegistry.createElement("header",{class:"block w-full h-full relative"},[...this._toNodeList((0,Oe.children)())]).element]}};var ve=P(R()),$e=P(I()),ne=class extends ve.TempleComponent{static component=["left","Left_f4ab589e043eee17d229"];styles(){return""}template(){let{layout:e,show:n}=this.element.attributes,i=(0,$e.classlist)(),r=d=>{this.classList.add("w-226","absolute","bottom-0","left-0","top-0","transition-500"),n.left?(this.classList.remove("md-left--226"),this.classList.add("md-left-0")):this.classList.add("md-left--226")};return n.change(r),r(),()=>[ve.TempleRegistry.createText(`
+`,!1),ve.TempleRegistry.createElement("aside",{class:"block w-full h-full relative"},[...this._toNodeList((0,$e.children)())]).element]}};var ye=P(R()),Ne=P(I()),re=class extends ye.TempleComponent{static component=["main","Main_847772763f4518728ede"];styles(){return""}template(){let{layout:e,show:n}=this.element.attributes,i=(0,Ne.classlist)(),r=d=>{this.classList.add("absolute","transition-500"),e?.head?(this.classList.remove("top-0"),this.classList.add("top-60")):this.classList.add("top-0"),e?.foot?(this.classList.remove("bottom-0"),this.classList.add("bottom-60")):this.classList.add("bottom-0"),e?.left?(this.classList.remove("left-0"),this.classList.add("left-226")):this.classList.add("left-0"),e?.right?(this.classList.remove("right-0"),this.classList.add("right-200")):this.classList.add("right-0"),n.left?(this.classList.remove("md-left-0"),this.classList.add("md-left-226")):(this.classList.remove("md-left-226"),this.classList.add("md-left-0")),n.right?(this.classList.remove("md-right-0"),this.classList.add("md-right-200")):(this.classList.remove("md-right-200"),this.classList.add("md-right-0"))};return n.change(r),r(),()=>[ye.TempleRegistry.createText(`
+`,!1),ye.TempleRegistry.createElement("main",{class:"block w-full h-full relative"},[...this._toNodeList((0,Ne.children)())]).element]}};var xe=P(R()),Re=P(I()),se=class extends xe.TempleComponent{static component=["docs","Docs_40562a7bb56d70d971df"];styles(){return""}template(){return(0,Re.classlist)().add("block","w-full","h-full","scroll-y-auto","scroll-x-hidden"),()=>[xe.TempleRegistry.createText(`
+`,!1),xe.TempleRegistry.createElement("article",{class:"block p-10 tx-t-1"},[...this._toNodeList((0,Re.children)())]).element]}};var k=P(R()),qe=P(I()),ae=class extends k.TempleComponent{static component=["app","App_381239c61b65b86a1c20"];styles(){return""}template(){let{title:e,height:n}=(0,qe.props)(),i=n?`height:${n}px`:"";return()=>[k.TempleRegistry.createText(`
+`,!1),k.TempleRegistry.createElement("div",{class:"bd-rad-curved scroll-hidden shadow-0-0-10-0-0-0-5"},[k.TempleRegistry.createText(`
+  `,!1),k.TempleRegistry.createElement("div",{class:"relative flex flex-center-y gap-10 p-10 bg-t-1 tx-c-999999 tx-16"},[k.TempleRegistry.createText(`
+    `,!1),k.TempleRegistry.createElement("span",{class:"bg-h-999999 pill h-10 w-10"},[]).element,k.TempleRegistry.createText(`
+    `,!1),k.TempleRegistry.createElement("span",{class:"bg-h-999999 pill h-10 w-10"},[]).element,k.TempleRegistry.createText(`
+    `,!1),k.TempleRegistry.createElement("span",{class:"bg-h-999999 pill h-10 w-10"},[]).element,k.TempleRegistry.createText(`
+    `,!1),k.TempleRegistry.createElement("span",{class:"flex flex-center h-full w-full absolute top-0 left-0"},[k.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(e),k.TempleRegistry.createText(`
+    `,!1)]).element,k.TempleRegistry.createText(`
+  `,!1)]).element,k.TempleRegistry.createText(`
+  `,!1),k.TempleRegistry.createElement("div",{class:"bg-black tx-t-1 relative",style:i},[...this._toNodeList((0,qe.children)())]).element,k.TempleRegistry.createText(`
+`,!1)]).element]}};var x=P(R()),tt=P(Lt()),Pt=P(I()),ie=class extends x.TempleComponent{static component=["code","Code_5294df1c620ef5ddbd2f"];styles(){return`:host {
     display: block;
     font-size: 14px;
     line-height: 20px;
   }
   :host([inline]) {
-    display: inline;
+    display: inline !important;
   }
   :host([inline]),
   :host([inline]) > pre,
   :host([inline]) > pre > code {
-    display: inline;
+    display: inline !important;
   }
   .snippet {
     background-color: #000000;
     color: #ABB2BF;
+    height: 100%;
     margin: 0;
     padding: 0;
   }
@@ -73,41 +90,38 @@ var TempleAPI=(()=>{var yt=Object.create;var de=Object.defineProperty;var wt=Obj
 
   .terminal {
     background-color: #000000;
+    font-family: 'Courier New', Courier, monospace;
     font-size: 15px;
+    height: 100%;
     padding: 10px;
   }
   .terminal span {
     color: #00FF00;
-  }`}template(){let e=this.props,{lang:r="markup",numbers:i=!1,inline:n=!1,trim:p=!1,ltrim:h=!1,rtrim:m=!1,detab:v=0}=e,E=(0,ht.children)(),w=E[0]?.textContent||"";v&&(w=w.replace(new RegExp(`\\n {${v}}`,"g"),`
-`)),p?w=w.trim():h?w=w.replace(/^\s+/,""):m&&(w=w.replace(/\s+$/,""));let F=x=>{if(!w)return;let _=Re.default.highlight(w,Re.default.languages[r],r);if(x.detail.target.innerHTML=_,i){let T=_.match(/\n(?!$)/g),s=T?T.length+1:1,a=new Array(s+1).join(""),l=document.createElement("span");l.setAttribute("aria-hidden","true"),l.className="line-numbers-rows",l.innerHTML=a,x.detail.target.appendChild(l)}};return()=>[y.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism.min.css"}).element,y.TempleRegistry.createText(`
-`,!1),y.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism-tomorrow.min.css"}).element,y.TempleRegistry.createText(`
-`,!1),...r==="bash"?[y.TempleRegistry.createText(`
-  `,!1),y.TempleRegistry.createElement("div",{class:"terminal"},[y.TempleRegistry.createElement("span",{},[y.TempleRegistry.createText("$",!1)]).element,y.TempleRegistry.createText(" ",!1),...this._toNodeList(E)]).element,y.TempleRegistry.createText(`
-`,!1)]:w?[,y.TempleRegistry.createText(`
-  `,!1),...i?[y.TempleRegistry.createText(`
-    `,!1),y.TempleRegistry.createElement("pre",{class:"snippet line-numbers"},[y.TempleRegistry.createElement("code",{mount:F},[]).element]).element,y.TempleRegistry.createText(`
-  `,!1)]:[,y.TempleRegistry.createText(`
-    `,!1),y.TempleRegistry.createElement("pre",{class:"snippet pad"},[y.TempleRegistry.createElement("code",{mount:F},[]).element]).element,y.TempleRegistry.createText(`
-  `,!1)],y.TempleRegistry.createText(`
-`,!1)]:[]]}};var P=L(N()),Ae=L(we()),J=class extends P.TempleComponent{static component=["app","App_05341fddbfd1fe4f273b"];styles(){return""}template(){let{title:e,panel:r}=(0,Ae.props)(),i=`body ${r?"panel":""}`,n=r?`height:${r}px`:"";return()=>[P.TempleRegistry.createText(`
-`,!1),P.TempleRegistry.createElement("div",{class:"window"},[P.TempleRegistry.createText(`
-  `,!1),P.TempleRegistry.createElement("div",{class:"head"},[P.TempleRegistry.createText(`
-    `,!1),P.TempleRegistry.createElement("span",{class:"dot"},[]).element,P.TempleRegistry.createText(`
-    `,!1),P.TempleRegistry.createElement("span",{class:"dot"},[]).element,P.TempleRegistry.createText(`
-    `,!1),P.TempleRegistry.createElement("span",{class:"dot"},[]).element,P.TempleRegistry.createText(`
-    `,!1),P.TempleRegistry.createElement("span",{class:"title"},[...this._toNodeList(e)]).element,P.TempleRegistry.createText(`
-  `,!1)]).element,P.TempleRegistry.createText(`
-  `,!1),P.TempleRegistry.createElement("div",{class:i,style:n},[...this._toNodeList((0,Ae.children)())]).element,P.TempleRegistry.createText(`
-`,!1)]).element]}};var M=L(N());var Ie=function(t,...e){let r=ze(t);for(let i=0;i[M.TempleRegistry.createText(`
-    `,!1),...r?[M.TempleRegistry.createText(`
-      `,!1),M.TempleRegistry.createElement("p",{},[...this._toNodeList(w)]).element,M.TempleRegistry.createText(`
+  }`}template(){let e=this.props,{lang:n="markup",numbers:i=!1,inline:r=!1,trim:d=!1,ltrim:b=!1,rtrim:m=!1,detab:v=0}=e,A=(0,Pt.children)(),g=A[0]?.textContent||"";v&&(g=g.replace(new RegExp(`\\n {${v}}`,"g"),`
+`)),d?g=g.trim():b?g=g.replace(/^\s+/,""):m&&(g=g.replace(/\s+$/,""));let w=E=>{if(!g)return;let y=tt.default.highlight(g,tt.default.languages[n],n);if(E.detail.target.innerHTML=y,i){let F=y.match(/\n(?!$)/g),a=F?F.length+1:1,s=new Array(a+1).join(""),l=document.createElement("span");l.setAttribute("aria-hidden","true"),l.className="line-numbers-rows",l.innerHTML=s,E.detail.target.appendChild(l)}};return()=>[x.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism.min.css"}).element,x.TempleRegistry.createText(`
+`,!1),x.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism-tomorrow.min.css"}).element,x.TempleRegistry.createText(`
+`,!1),...n==="bash"?[x.TempleRegistry.createText(`
+  `,!1),x.TempleRegistry.createElement("div",{class:"terminal"},[x.TempleRegistry.createElement("span",{},[x.TempleRegistry.createText("$",!1)]).element,x.TempleRegistry.createText(" ",!1),...this._toNodeList(A)]).element,x.TempleRegistry.createText(`
+`,!1)]:g?[,x.TempleRegistry.createText(`
+  `,!1),...i?[x.TempleRegistry.createText(`
+    `,!1),x.TempleRegistry.createElement("pre",{class:"snippet line-numbers"},[x.TempleRegistry.createElement("code",{mount:w},[]).element]).element,x.TempleRegistry.createText(`
+  `,!1)]:[,x.TempleRegistry.createText(`
+    `,!1),x.TempleRegistry.createElement("pre",{class:"snippet pad"},[x.TempleRegistry.createElement("code",{mount:w},[]).element]).element,x.TempleRegistry.createText(`
+  `,!1)],x.TempleRegistry.createText(`
+`,!1)]:[,x.TempleRegistry.createText(`
+  `,!1),x.TempleRegistry.createElement("span",{},[x.TempleRegistry.createText("????",!1)]).element,x.TempleRegistry.createText(`
+`,!1)],x.TempleRegistry.createText(`
+
+`,!1)]}};var M=P(R());var St=function(t){return t};var He=P(I()),le=class extends M.TempleComponent{static component=["translate","Translate_0014b007fc91289b2776"];styles(){return""}template(){let{trim:e=!1,p:n=!1,li:i=!1,div:r=!1}=(0,He.props)(),d=(0,He.children)(),b=[],m=[];for(let w of d)typeof w=="string"?b.push(w):w instanceof Node&&w.textContent?b.push(w.textContent):(b.push("%s"),m.push(w));let v=b.join("");e&&(v=v.replace(/\s+/," ").trim());let A=St(v).split("%s"),g=[];for(let w=0;w[M.TempleRegistry.createText(`
+    `,!1),...n?[M.TempleRegistry.createText(`
+      `,!1),M.TempleRegistry.createElement("p",{},[...this._toNodeList(g)]).element,M.TempleRegistry.createText(`
     `,!1)]:i?[,M.TempleRegistry.createText(`
-      `,!1),M.TempleRegistry.createElement("li",{},[...this._toNodeList(w)]).element,M.TempleRegistry.createText(`
-    `,!1)]:n?[,M.TempleRegistry.createText(`
-      `,!1),M.TempleRegistry.createElement("div",{},[...this._toNodeList(w)]).element,M.TempleRegistry.createText(`
+      `,!1),M.TempleRegistry.createElement("li",{},[...this._toNodeList(g)]).element,M.TempleRegistry.createText(`
+    `,!1)]:r?[,M.TempleRegistry.createText(`
+      `,!1),M.TempleRegistry.createElement("div",{},[...this._toNodeList(g)]).element,M.TempleRegistry.createText(`
     `,!1)]:[,M.TempleRegistry.createText(`
-      `,!1),...this._toNodeList(w),M.TempleRegistry.createText(`
-    `,!1)]]}};var k=L(N());D.emitter.once("ready",()=>{let t=document.querySelector("script[data-app]");if(!t)throw D.TempleException.for("APP_DATA not found");try{let h=atob(t.getAttribute("data-app"));window.__APP_DATA__=JSON.parse(h),Object.entries(window.__APP_DATA__).forEach(([m,v])=>{D.data.set(m,v)})}catch{throw D.TempleException.for("APP_DATA is not a valid JSON")}D.data.set("current","document");let e="/docs/developer-tools.html",r=Ie("Developer Tools - Temple reactive web component template engine."),i=Ie("Enable tools for a better developer experience and debugging."),n=h=>{document.body.classList.toggle("panel-left-open")};D.data.delete("current");let p={0:{class:"head panel-head"},1:{class:"menu fas fa-fw fa-bars",click:n},2:{href:"/temple"},3:{src:"/temple/temple-icon.png",alt:"Temple Logo"},5:{class:"tx-white",href:"/temple"},7:{class:"tx-white",href:"/temple/docs/index.html"},8:{class:"github",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},9:{class:"fab fa-github"},10:{class:"npm",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},11:{class:"fab fa-npm text-white"},12:{class:"discord",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},13:{class:"fab fa-discord text-white"},14:{class:"left panel-left"},16:{href:"/temple"},17:{src:"/temple/temple-icon.png",alt:"Temple Logo"},19:{class:"tx-white",href:"/temple"},20:{class:"toggle fas fa-fw fa-chevron-left",click:n},23:{href:"/temple/docs/index.html"},24:{href:"/temple/docs/getting-started.html"},26:{href:"/temple/docs/markup-syntax.html"},27:{href:"/temple/docs/state-management.html"},28:{href:"/temple/docs/component-strategy.html"},29:{href:"/temple/docs/compiler-api.html"},30:{href:"/temple/docs/client-api.html"},32:{href:"/temple/docs/template-engine.html"},33:{href:"/temple/docs/single-page.html"},34:{href:"/temple/docs/static-site.html"},35:{href:"/temple/docs/component-publisher.html"},36:{href:"/temple/docs/developer-tools.html"},37:{class:"panel-main"},38:{class:"docs container"},40:{p:!0,trim:!0},41:{lang:"js",inline:!0},42:{title:"Terminal"},43:{lang:"bash"},44:{p:!0,trim:!0},45:{lang:"js",inline:!0},46:{lang:"js",inline:!0},47:{title:"src/index.ts"},48:{lang:"js",numbers:!0,trim:!0,detab:12},49:{p:!0,trim:!0},50:{lang:"js",inline:!0},51:{inline:!0},52:{title:"src/page.dtml"},53:{numbers:!0,trim:!0,detab:12},54:{p:!0,trim:!0},55:{title:"Terminal"},56:{lang:"bash"},57:{p:!0,trim:!0},58:{lang:"js",inline:!0},59:{class:"pager"},60:{class:"prev",href:"/temple/docs/component-publisher.html"},61:{class:"fas fa-fw fa-chevron-left"},62:{class:"foot"}};for(let h of document.body.querySelectorAll("*")){let m=Object.fromEntries(Array.from(h.attributes).map(E=>[E.nodeName,E.nodeValue.length>0?E.nodeValue:!0])),v=String(D.TempleRegistry.elements.size);p[v]&&(Object.assign(m,p[v]),h.TempleAttributes=p[v]),D.TempleRegistry.register(h,m)}customElements.define("panel-main",Z),customElements.define("ide-code",W),customElements.define("ide-app",J),customElements.define("i18n-translate",X),D.emitter.emit("mounted",document.body)});var tr={PanelMain_fd7f1af6410c5b5c8e1f:Z,IdeCode_6f36bc13bb6a166c7abc:W,IdeApp_05341fddbfd1fe4f273b:J,I18nTranslate_7d25e372f5ffb5e39dad:X},rr="13781afd4fbd704a9789";return Ft(nr);})();
+      `,!1),...this._toNodeList(g),M.TempleRegistry.createText(`
+    `,!1)]]}};var nt=function(t,...e){let n=Fn(t);for(let i=0;i{let t=document.querySelector("script[data-app]");if(!t)throw O.TempleException.for("APP_DATA not found");try{let b=atob(t.getAttribute("data-app"));window.__APP_DATA__=JSON.parse(b),Object.entries(window.__APP_DATA__).forEach(([m,v])=>{O.data.set(m,v)})}catch{throw O.TempleException.for("APP_DATA is not a valid JSON")}O.data.set("current","document");let e="/docs/developer-tools.html",n=nt("Developer Tools - Temple reactive web component template engine."),i=nt("Enable tools for a better developer experience and debugging."),r=()=>{document.getElementsByTagName("panel-layout")[0].toggle("left")};O.data.delete("current");let d={2:{class:"flex flex-center-y px-20 py-15 m-0 bg-t-1"},3:{class:"fas fa-fw fa-bars cursor-pointer py-5 pr-10 none md-inline-block tx-t-1",click:r},4:{class:"flex-grow"},5:{class:"flex flex-center-y"},6:{class:"tx-white",href:"/temple/docs/index.html"},7:{class:"tx-t-1 tx-5xl ml-10",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},8:{class:"fab fa-github"},9:{class:"bg-h-cb3837 pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},10:{class:"fab fa-npm text-white"},11:{class:"bg-h-7289da pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},12:{class:"fab fa-discord text-white"},14:{class:"flex flex-center-y bg-t-2 py-15 pr-5 pl-10"},15:{href:"/temple"},16:{class:"h-26 mr-10",src:"/temple/temple-icon.png",alt:"Temple Logo"},17:{class:"flex-grow m-0 tx-uppercase"},18:{class:"tx-white",href:"/temple"},19:{class:"fas fa-fw fa-chevron-left cursor-pointer none md-inline-block",click:r},20:{class:"bg-t-1 scroll-auto h-calc-full-60"},21:{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-0 pt-20 pb-10 pl-10 tx-uppercase"},22:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/index.html"},23:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/getting-started.html"},24:{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},25:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/markup-syntax.html"},26:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/state-management.html"},27:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-strategy.html"},28:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/compiler-api.html"},29:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/client-api.html"},30:{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},31:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/template-engine.html"},32:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/single-page.html"},33:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/static-site.html"},34:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-publisher.html"},35:{class:"block tx-t-1 py-10 pl-10 tx-bold mb-100",href:"/temple/docs/developer-tools.html"},38:{class:"tx-primary tx-uppercase tx-30 py-20"},39:{p:!0,trim:!0,class:"tx-lh-36 py-20"},40:{lang:"js",inline:!0},41:{title:"Terminal",class:"py-20"},42:{lang:"bash"},43:{p:!0,trim:!0,class:"tx-lh-36 py-20"},44:{lang:"js",inline:!0},45:{lang:"js",inline:!0},46:{title:"src/index.ts",class:"py-20"},47:{lang:"js",numbers:!0,trim:!0,detab:12},48:{p:!0,trim:!0,class:"tx-lh-36 py-20"},49:{lang:"js",inline:!0},50:{inline:!0},51:{title:"src/page.dtml",class:"py-20"},52:{numbers:!0,trim:!0,detab:12},53:{p:!0,trim:!0,class:"tx-lh-36 py-20"},54:{title:"Terminal",class:"py-20"},55:{lang:"bash"},56:{p:!0,trim:!0,class:"tx-lh-36 py-20"},57:{lang:"js",inline:!0},58:{class:"flex"},59:{class:"tx-primary py-40",href:"/temple/docs/component-publisher.html"},60:{class:"fas fa-fw fa-chevron-left tx-t-1"},61:{class:"foot"}};for(let b of document.body.querySelectorAll("*")){let m=Object.fromEntries(Array.from(b.attributes).map(A=>[A.nodeName,A.nodeValue.length>0?A.nodeValue:!0])),v=String(O.TempleRegistry.elements.size);d[v]&&(Object.assign(m,d[v]),b.TempleAttributes=d[v]),O.TempleRegistry.register(b,m)}customElements.define("panel-layout",ee),customElements.define("panel-head",te),customElements.define("panel-left",ne),customElements.define("panel-main",re),customElements.define("api-docs",se),customElements.define("ide-app",ae),customElements.define("ide-code",ie),customElements.define("i18n-translate",le),O.emitter.emit("mounted",document.body)});var kn={PanelLayout_9f3ab204ce271feaf6f7:ee,PanelHead_2bf4dff19bc88ba4138b:te,PanelLeft_f4ab589e043eee17d229:ne,PanelMain_847772763f4518728ede:re,ApiDocs_40562a7bb56d70d971df:se,IdeApp_381239c61b65b86a1c20:ae,IdeCode_5294df1c620ef5ddbd2f:ie,I18nTranslate_0014b007fc91289b2776:le},Ln="13781afd4fbd704a9789";return Ht(Pn);})();
 /*! Bundled license information:
 
 prismjs/prism.js:
diff --git a/docs/build/client/1bf701a55aaad047771e.css b/docs/build/client/1bf701a55aaad047771e.css
index e69de29..e0afe2e 100644
--- a/docs/build/client/1bf701a55aaad047771e.css
+++ b/docs/build/client/1bf701a55aaad047771e.css
@@ -0,0 +1,216 @@
+html, body {
+  height: 100%;
+  margin: 0;
+  padding: 0;
+  width: 100%;
+}
+
+h1, h2, h3, h4, h5, h6, p {
+  margin: 0;
+  padding: 0;
+}
+
+a {
+  text-decoration: none;
+}
+  html-head:not(:defined) { opacity: 0; }
+html-header:not(:defined) { opacity: 0; }
+html-aside:not(:defined) { opacity: 0; }
+panel-layout:not(:defined) { opacity: 0; }
+panel-head:not(:defined) { opacity: 0; }
+panel-left:not(:defined) { opacity: 0; }
+panel-main:not(:defined) { opacity: 0; }
+tui-tab:not(:defined) { opacity: 0; }
+api-docs:not(:defined) { opacity: 0; }
+app-head:not(:defined) { opacity: 0; }
+app-left:not(:defined) { opacity: 0; }
+app-main:not(:defined) { opacity: 0; }
+ide-app:not(:defined) { opacity: 0; }
+ide-code:not(:defined) { opacity: 0; }
+i18n-translate:not(:defined) { opacity: 0; }
+  :root {
+  --black: #000000;
+  --white: #FFFFFF;
+  --info: #1474FC;
+  --error: #DC3545;
+  --warning: #FF7B07;
+  --success: #28A745;
+  --muted: #999999;
+}
+
+.light {
+  --bg-0: #EFEFEF;
+  --bg-1: #CFCFCF;
+  --bg-2: #AFAFAF;
+  --bg-3: #8F8F8F;
+  --bg-4: #6F6F6F;
+  --bd-0: #EFEFEF;
+  --bd-1: #CFCFCF;
+  --bd-2: #AFAFAF;
+  --bd-3: #8F8F8F;
+  --bd-4: #6F6F6F;
+  --bg-inverse: #242424;
+  --tx-0: #000000;
+  --tx-1: #242424;
+  --tx-inverse: #CFCFCF;
+}
+
+.dark {
+  --bg-0: #121212;
+  --bg-1: #222222;
+  --bg-2: #323232;
+  --bg-3: #424242;
+  --bg-4: #525252;
+  --bd-0: #121212;
+  --bd-1: #222222;
+  --bd-2: #323232;
+  --bd-3: #424242;
+  --bd-4: #525252;
+  --bg-inverse: #DBDBDB;
+  --tx-0: #FFFFFF;
+  --tx-1: #CFCFCF;
+  --tx-inverse: #222222;
+}
+  html-head { display: block; }
+html-header { display: block; }
+html-aside { display: block; }
+panel-layout { display: block; }
+panel-head { display: block; }
+panel-left { display: block; }
+panel-main { display: block; }
+tui-tab { display: block; }
+api-docs { display: block; }
+app-head { display: block; }
+app-left { display: block; }
+app-main { display: block; }
+ide-app { display: block; }
+ide-code { display: block; }
+i18n-translate { display: block; }
+  .arial { font-family: Arial, sans-serif; }
+.none { display: none; }
+.block { display: block; }
+.flex { display: flex; }
+.inline { display: inline; }
+.relative { position: relative; }
+.absolute { position: absolute; }
+.static { position: static; }
+.bottom-0 { bottom: 0px; }
+.bottom-60 { bottom: 60px; }
+.left-0 { left: 0px; }
+.left-226 { left: 226px; }
+.left-0 { left: 0px; }
+.left-226 { left: 226px; }
+.left--226 { left: -226px; }
+.left-170 { left: 170px; }
+.right-0 { right: 0px; }
+.right-200 { right: 200px; }
+.right-0 { right: 0px; }
+.right-200 { right: 200px; }
+.top-0 { top: 0px; }
+.top-60 { top: 60px; }
+.top-45 { top: 45px; }
+.z-1 { z-index: 1; }
+.z-2 { z-index: 2; }
+.flex-grow { flex-grow: 1; }
+.flex-center { align-items: center; justify-content: center; }
+.flex-center-y { align-items: center; }
+.gap-10 { gap: 10px; }
+.scroll-auto { overflow: auto; }
+.scroll-hidden { overflow: hidden; }
+.scroll-x-auto { overflow-x: auto; }
+.scroll-x-hidden { overflow-x: hidden; }
+.scroll-y-auto { overflow-y: auto; }
+.h-full { height: 100%; }
+.h-26 { height: 26px; }
+.h-7289 { height: 7289px; }
+.h-905496362982981723 { height: 905496362982981723px; }
+.h-60 { height: 60px; }
+.h-45 { height: 45px; }
+.h-000000 { height: 000000px; }
+.h-999999 { height: 999999px; }
+.h-10 { height: 10px; }
+.h-36 { height: 36px; }
+.h-calc-full-60 { height: calc(100% - 60px); }
+.vh { height: 100vh; }
+.w-full { width: 100%; }
+.w-226 { width: 226px; }
+.w-170 { width: 170px; }
+.w-0 { width: 0px; }
+.w-10 { width: 10px; }
+.bg-black { background-color: var(--black) !important; }
+.bg-t-1 { background-color: var(--bg-1) !important; }
+.bg-t-2 { background-color: var(--bg-2) !important; }
+.bg-t-0 { background-color: var(--bg-0) !important; }
+.bg-h-cb3837 { background-color: #cb3837; }
+.bg-h-7289da { background-color: #7289da; }
+.bg-h-000000 { background-color: #000000; }
+.bg-h-999999 { background-color: #999999; }
+.tx-5 { font-size: 5px; }
+.tx-14 { font-size: 14px; }
+.tx-16 { font-size: 16px; }
+.tx-30 { font-size: 30px; }
+.tx-lg { font-size: 16px; }
+.tx-5xl { font-size: 26px; }
+.tx-center { text-align: center; }
+.tx-right { text-align: right; }
+.tx-bold { font-weight: bold; }
+.tx-uppercase { text-transform: uppercase; }
+.tx-lh-36 { line-height: 36px; }
+.tx-primary { color: var(--primary) !important; }
+.tx-white { color: var(--white) !important; }
+.tx-muted { color: var(--muted) !important; }
+.tx-t-1 { color: var(--tx-1) !important; }
+.bd-solid { border-style: solid; }
+.bd-t-2 { border-color: var(--bd-2) !important; }
+.bd-t-1 { border-color: var(--bd-1) !important; }
+.bdb-0 { border-bottom-width: 0px; }
+.bdl-0 { border-left-width: 0px; }
+.bdr-1 { border-right-width: 1px; }
+.bdt-1 { border-top-width: 1px; }
+.bdx-0 { border-left-width: 0px; border-right-width: 0px; }
+.bdy-0 { border-top-width: 0px; border-bottom-width: 0px; }
+.pill { border-radius: 10000px; }
+.curve-t-sm { border-radius: 4px 4px 0 0; }
+.m-0 { margin: 0px; }
+.m-0 { margin: 0px; }
+.m-60 { margin: 60px; }
+.mb-0 { margin-bottom: 0px; }
+.mb-100 { margin-bottom: 100px; }
+.ml-10 { margin-left: 10px; }
+.ml-5 { margin-left: 5px; }
+.ml-2 { margin-left: 2px; }
+.mr-10 { margin-right: 10px; }
+.mt-0 { margin-top: 0px; }
+.mt-20 { margin-top: 20px; }
+.p-5 { padding: 5px; }
+.p-0 { padding: 0px; }
+.p-60 { padding: 60px; }
+.p-10 { padding: 10px; }
+.p-45 { padding: 45px; }
+.p-10 { padding: 10px; }
+.pb-10 { padding-bottom: 10px; }
+.pl-10 { padding-left: 10px; }
+.pl-5 { padding-left: 5px; }
+.pl-15 { padding-left: 15px; }
+.pr-10 { padding-right: 10px; }
+.pr-5 { padding-right: 5px; }
+.pt-20 { padding-top: 20px; }
+.pt-5 { padding-top: 5px; }
+.pt-10 { padding-top: 10px; }
+.px-20 { padding-left: 20px; padding-right: 20px; }
+.py-15 { padding-top: 15px; padding-bottom: 15px; }
+.py-5 { padding-top: 5px; padding-bottom: 5px; }
+.py-10 { padding-top: 10px; padding-bottom: 10px; }
+.py-20 { padding-top: 20px; padding-bottom: 20px; }
+.py-40 { padding-top: 40px; padding-bottom: 40px; }
+.cursor-pointer { cursor: pointer; }
+.transition-500 { transition: 500ms; }
+.shadow-0-0-10-0-0-0-5 { box-shadow: 0px 0px 10px rgb(0, 0, 0, 0.5); }
+@media (max-width: 767px) {
+  .md-inline-block { display: inline-block; }
+  .md-left-0 { left: 0px; }
+  .md-left-226 { left: 226px; }
+  .md-left--226 { left: -226px; }
+  .md-right-0 { right: 0px; }
+  .md-right-200 { right: 200px; }
+}
\ No newline at end of file
diff --git a/docs/build/client/1bf701a55aaad047771e.html b/docs/build/client/1bf701a55aaad047771e.html
index 515350b..4d196f3 100644
--- a/docs/build/client/1bf701a55aaad047771e.html
+++ b/docs/build/client/1bf701a55aaad047771e.html
@@ -18,116 +18,167 @@
   
   
   
-  
+  
   
   
   
   
 
-  
-    

-  
-  
-    Temple Logo
-  
-  
Temple

-  
+      
+        
+          

+            Static Site Generator
+          

 
-        
-          A static site generator is a tool that generates a full static 
-          HTML website based on raw data and a set of templates. 
-          Essentially, a static site generator automates the task of 
-          coding individual HTML pages and gets those pages ready to 
-          serve to users ahead of time. Because these HTML pages are 
-          pre-built, they can load very quickly in browsers. You can use 
-          Temple, TypeScript and the native Node.js HTTP server to 
-          generate HTML documents in order to be served statically.
-        
+          
+            A static site generator is a tool that generates a full static 
+            HTML website based on raw data and a set of templates. 
+            Essentially, a static site generator automates the task of 
+            coding individual HTML pages and gets those pages ready to 
+            serve to users ahead of time. Because these HTML pages are 
+            pre-built, they can load very quickly in browsers. You can use 
+            Temple, TypeScript and the native Node.js HTTP server to 
+            generate HTML documents in order to be served statically.
+          
 
-        
-          First, create a project with the following structure and files.
-        
-        
-          

-            

-              
-                src/index.ts
+          
+            First, create a project with the following structure and files.
+          
+          
+            
+              

+                
+                  src/index.ts
+                
+                
+                  src/page.dtml
+                
+                
+                  package.json
+                
+              

+            
+            
+              

+                
+                src
+              

+              
+                
+                index.ts
               
-              
-                src/pages/index.dtml
+              
+                
+                page.dtml
               
-              
+              
+                
                 package.json
               
-            

-          

-          

-            

-              
-              src
-            

-            
-              
-              index.ts
-            
-            

-              
-              pages
-            

-            
-              
-              index.dtml
-            
-            
-              
-              package.json
-            
-          

-          

-            

+            
+            
               
                 import http from 'http';
                 import temple, { cache } from '@ossph/temple/compiler';
@@ -210,46 +261,46 @@ 

                     "dev": "ts-node ./src/index.ts"
                   },
                   "dependencies": {
-                    "@ossph/temple": "0.1.4"
+                    "@ossph/temple": "0.1.6"
                   },
                   "devDependencies": {
-                    "@ossph/temple-dev": "0.1.4",
+                    "@ossph/temple-dev": "0.1.6",
                     "@types/node": "22.1.0",
                     "ts-node": "10.9.2",
                     "typescript": "5.5.4"
                   }
                 }
               
-            

-          

-        
+            
+          
 
-        
-          To test the script and see the results, run the following 
-          command in terminal.
-        
-        
-          npm run dev
-        
-        
-          Load 
-          'http://localhost:3000/' 
-          in your browser. After loading you should see files that were 
-          generated in a new build folder found in your project root. 
-        
-        
-        
-      
-      

-    
+          
+            To test the script and see the results, run the following 
+            command in terminal.
+          
+          
+            npm run dev
+          
+          
+            Load 
+            http://localhost:3000/ 
+            in your browser. After loading you should see files that were 
+            generated in a new build folder found in your project root. 
+          
+          
+          
+          

+        
+      
+    
   
 
\ No newline at end of file
diff --git a/docs/build/client/1bf701a55aaad047771e.js b/docs/build/client/1bf701a55aaad047771e.js
index 5991c43..2e23b04 100644
--- a/docs/build/client/1bf701a55aaad047771e.js
+++ b/docs/build/client/1bf701a55aaad047771e.js
@@ -1,20 +1,49 @@
-var TempleAPI=(()=>{var xt=Object.create;var ge=Object.defineProperty;var Tt=Object.getOwnPropertyDescriptor;var Et=Object.getOwnPropertyNames;var Ft=Object.getPrototypeOf,kt=Object.prototype.hasOwnProperty;var O=(t,e)=>()=>(e||t((e={exports:{}}).exports,e),e.exports),St=(t,e)=>{for(var r in e)ge(t,r,{get:e[r],enumerable:!0})},Je=(t,e,r,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let n of Et(e))!kt.call(t,n)&&n!==r&&ge(t,n,{get:()=>e[n],enumerable:!(i=Tt(e,n))||i.enumerable});return t};var D=(t,e,r)=>(r=t!=null?xt(Ft(t)):{},Je(e||!t||!t.__esModule?ge(r,"default",{value:t,enumerable:!0}):r,t)),Pt=t=>Je(ge({},"__esModule",{value:!0}),t);var Me=O(Oe=>{"use strict";Object.defineProperty(Oe,"__esModule",{value:!0});var je=class extends Error{static for(e,...r){return r.forEach(function(i){e=e.replace("%s",i)}),new this(e)}static forErrorsFound(e){let r=new this("Invalid Parameters");return r.errors=e,r}static require(e,r,...i){if(!e){for(let n of i)r=r.replace("%s",n);throw new this(r)}}constructor(e,r=500){super(),this.errors={},this.start=0,this.end=0,this.message=e,this.name=this.constructor.name,this.code=r}withCode(e){return this.code=e,this}withPosition(e,r){return this.start=e,this.end=r,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};Oe.default=je});var Q=O(K=>{"use strict";Object.defineProperty(K,"__esModule",{value:!0});K.TempleEmitter=void 0;var he=class extends EventTarget{emit(e,r){return this.dispatchEvent(new CustomEvent(e,{detail:r})),this}on(e,r){if(e==="ready"&&document.readyState!=="loading"){let i=new CustomEvent("ready");return setTimeout(()=>r(i),1),this}return this.addEventListener(e,r),this}once(e,r){let i=n=>{this.unbind(e,i),r(n)};return this.on(e,i),this}unbind(e,r){return this.removeEventListener(e,r),this}};K.TempleEmitter=he;var Xe=new he;document.onreadystatechange=()=>{document.readyState!=="loading"&&Xe.emit("ready")};K.default=Xe});var $e=O(ee=>{"use strict";var jt=ee&&ee.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ee,"__esModule",{value:!0});var Ce=jt(Q()),De=class{get attributes(){return Object.assign({},this._attributes)}get element(){return this._element}constructor(e,r){this._element=e,this._attributes=r}hasAttribute(e){return e in this._attributes}getAttribute(e){return this._attributes[e]}removeAttribute(e,r=!1){let i=this.getAttribute(e);return typeof i>"u"?this:(delete this._attributes[e],this._element.removeAttribute(e),r||Ce.default.emit("attribute-remove",{element:this,key:e,previous:i}),this)}setAttribute(e,r,i=!1){if(typeof r>"u")return this.removeAttribute(e,i);let n=this.getAttribute(e);return n===r?this:(this._attributes[e]=r,typeof r=="string"&&this._element.setAttribute(e,r),i||(typeof n>"u"?Ce.default.emit("attribute-create",{element:this,key:e,value:r}):Ce.default.emit("attribute-update",{element:this,key:e,value:r,previous:n})),this)}setAttributes(e,r=!1){for(let[n,p]of Object.entries(e))this.setAttribute(n,p,r);let i=Object.keys(e);for(let n of Object.keys(this._attributes))i.includes(n)||this.removeAttribute(n,r);return this}};ee.default=De});var be=O(te=>{"use strict";var Ot=te&&te.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(te,"__esModule",{value:!0});var Mt=Ot($e()),me=class{static get elements(){return this._elements}static createComponent(e,r,i,n=[]){let p=document.createElement("template");p.innerHTML=`<${e}>`;let g=p.content.querySelector(`${e}`);Object.setPrototypeOf(g,r.prototype),g.constructor=r.constructor,g.constructor.component=r.component;for(let[_,y]of Object.entries(i))typeof y=="string"?g.setAttribute(_,y):y===!0&&g.setAttribute(_,_);return g._TempleAttributes=i,g.props=i,n.forEach(_=>g.appendChild(_)),g.register(),customElements.get(e)||g.connectedCallback(),this.register(g,i)}static createElement(e,r,i=[]){let n=document.createElement(e);for(let[p,m]of Object.entries(r))typeof m=="string"?n.setAttribute(p,m):m===!0&&n.setAttribute(p,p);return i.filter(p=>typeof p<"u").forEach(p=>n.appendChild(p)),this.register(n,r)}static createText(e,r=!1){return document.createTextNode(e)}static filter(e){let r=[];return this._elements.forEach((i,n)=>{e(i,n)&&r.push(i)}),r}static get(e){return this._elements.get(e)||null}static has(e){return this._elements.has(e)}static map(e){let r=[];return this._elements.forEach((i,n)=>{r.push(e(i,n))}),r}static register(e,r){if(this.has(e))return this.get(e);let i=new Mt.default(e,r||{});return this._elements.set(e,i),i}};me._elements=new Map;te.default=me});var z=O(re=>{"use strict";Object.defineProperty(re,"__esModule",{value:!0});re.TempleDataMap=void 0;var _e=class{constructor(){window.__APP_DATA__||(window.__APP_DATA__={})}clear(){return window.__APP_DATA__={},this}delete(e){return this.has(e)?(delete window.__APP_DATA__[e],!0):!1}entries(){return Object.entries(window.__APP_DATA__)}has(e){return e in window.__APP_DATA__}get(e){return window.__APP_DATA__[e]}keys(){return Object.keys(window.__APP_DATA__)}set(e,r){return window.__APP_DATA__[e]=r,this}values(){return Object.values(window.__APP_DATA__)}};re.TempleDataMap=_e;var Ct=new _e;re.default=Ct});var Ve=O(ae=>{"use strict";var qe=ae&&ae.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ae,"__esModule",{value:!0});var ne=qe(be()),ve=qe(Q()),Ye=qe(z()),Le=class t extends HTMLElement{constructor(){super(...arguments),this._initiated=!1,this._template=null,this._attributes={},this._props={},this._children=void 0,this._rendering=!1}static register(){customElements.define(this.component[0],this)}get attr(){return this._attributes}get element(){return ne.default.has(this)?ne.default.get(this):ne.default.register(this,this._TempleAttributes||{})}get metadata(){let[e,r]=this.constructor.component;return{tagname:e,classname:r}}get originalChildren(){return this._children}get initiated(){return this._initiated}get props(){return this._props}set props(e){this._props=Object.assign({},e),this._attributes=Object.fromEntries(Object.entries(e).filter(r=>typeof r[1]=="string"||r[1]===!0))}adoptedCallback(){this.render()}attributeChangedCallback(e,r,i){this.props=Object.assign(Object.assign({},this.props),{[e]:i}),this.render()}connectedCallback(){this.wait()}disconnectedCallback(){}getParentComponent(){let e=this.parentElement;for(;e;){if(e instanceof t)return e;e=e.parentElement}return null}register(){ne.default.register(this,this._props)}render(){let e=this.getParentComponent();if(e&&!e.initiated)return;if(this._rendering)return;this._rendering=!0,Ye.default.set("current",this);let r=this.styles();this._template?ve.default.emit("unmounted",this):this._template=this.template();let i=this._template().filter(Boolean);if(r.length===0)this.textContent="",i.forEach(n=>this.appendChild(n));else{this.shadowRoot||this.attachShadow({mode:"open"});let n=this.shadowRoot;this.textContent="",n.textContent="";let p=document.createElement("style");p.innerText=r,n.appendChild(p),i.forEach(m=>{var g;return(g=this.shadowRoot)===null||g===void 0?void 0:g.appendChild(m)})}return Ye.default.delete("current"),this._initiated=!0,ve.default.emit("mounted",this),this._rendering=!1,this.shadowRoot?this.shadowRoot.innerHTML:this.innerHTML}wait(){if(document.readyState!=="loading")this._update();else{let e=()=>{this._update(),ve.default.unbind("ready",e)};ve.default.on("ready",e)}}_toNodeList(e){return e instanceof Node?[e]:Array.isArray(e)&&e.every(r=>r instanceof Node)?e:[ne.default.createText(String(e))]}_update(){typeof this._children>"u"&&(this._children=Array.from(this.childNodes||[]));let e=this.element;e&&(this.props=Object.assign({},e.attributes),this.render()),this._initiated||this.render()}};ae.default=Le});var Ke=O(se=>{"use strict";var Dt=se&&se.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(se,"__esModule",{value:!0});var $t=Dt(z());function Lt(t){let e=$t.default.get("env")||{};return t?e[t]||null:e}se.default=Lt});var Re=O(ie=>{"use strict";var qt=ie&&ie.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ie,"__esModule",{value:!0});ie.default=Rt;var Qe=qt(z());function Rt(t=null){return t||(t=Qe.default.get("current")||null),t?t==="document"?Qe.default.get("props")||{}:t.props:{}}});var et=O(le=>{"use strict";var It=le&&le.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(le,"__esModule",{value:!0});le.default=Ht;var zt=It(Re());function Ht(t=null){return(0,zt.default)(t).class}});var rt=O(G=>{"use strict";var Nt=G&&G.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(G,"__esModule",{value:!0});G.innerHTML=Gt;G.default=tt;var Bt=Nt(z());function Gt(t=null){let e=tt(t),r=document.createElement("template");return r.append(...e),r.innerHTML}function tt(t=null){return t||(t=Bt.default.get("current")||null),t?t.originalChildren||[]:[]}});var st=O(H=>{"use strict";var at=H&&H.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(H,"__esModule",{value:!0});H.SignalRegistry=void 0;H.default=Zt;var nt=at(Me()),Ut=at(z()),U=class t{static observe(e,r){let i={getter:()=>n.raw,setter:m=>m},n={raw:r,getter(m){return i.getter=m,n},setter(m){return i.setter=m,n}};Object.defineProperty(n,"value",{get(){return i.getter()},set(m){let g=i.setter(m),_=t.serialize(g)!==t.serialize(n.raw);n.raw=g,_&&e.render()}});let p=this._observers.get(e);return p?(p.observed++,p.values.push(n)):this._observers.set(e,{observed:1,values:[n]}),n}static observer(e){return this._observers.get(e)||null}static serialize(e){return JSON.stringify(e)}};H.SignalRegistry=U;U._observers=new Map;function Zt(t,e=null){if(e||(e=Ut.default.get("current")||null),!e)throw nt.default.for("Signals can only be created within a Temple component");if(!e.initiated)return U.observe(e,t);let r=U.observer(e);if(!r)throw nt.default.for("State mismatch");return r.values[r.observed++%r.values.length]}});var ct=O(ye=>{"use strict";var lt=ye&&ye.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ye,"__esModule",{value:!0});var it=lt(be()),ot=lt(Q()),ut=(t,e)=>Array.from(t.querySelectorAll("*")).filter(r=>{let i=it.default.get(r);return i&&i.hasAttribute(e)}).map(r=>it.default.get(r));function Ie(t,e){ot.default.on("mounted",r=>{if(!r.detail)return;let i=r.detail;ut(i.shadowRoot||i,t).forEach(e)})}function Wt(t,e){ot.default.on("unmounted",r=>{if(!r.detail)return;let i=r.detail;ut(i.shadowRoot||i,t).forEach(e)})}Ie("mount",t=>{let e=t.getAttribute("mount");if(typeof e=="function"){let r=new CustomEvent("mount",{detail:{node:t,target:t.element}});e(r)}});Wt("unmount",t=>{let e=t.getAttribute("unmount");if(typeof e=="function"){let r=new CustomEvent("unmount",{detail:{node:t,target:t.element}});e(r)}});Ie("if",t=>{let e=t.getAttribute("if");(e===!1||e==="false"||typeof e=="function"&&!e())&&t.element.remove()});["click","dblclick","mousedown","mouseup","mousemove","mouseover","mouseout","wheel","keydown","keypress","keyup","blur","change","contextmenu","focus","input","submit","invalid","reset","search","select","copy","cut","paste","drag","dragstart","dragend","dragover","dragenter","dragleave","drop","scroll","durationchange","ended","error","loadeddata","loadedmetadata","loadstart","pause","play","playing","progress","ratechange","seeked","seeking","stalled","suspend","timeupdate","volumechange","waiting","animationstart","animationend","animationiteration","transitionend","toggle"].forEach(t=>Ie(t,e=>{let r=e.getAttribute(t);typeof r=="function"&&(e.element.removeEventListener(t,r),e.element.addEventListener(t,r))}))});var ze=O(h=>{"use strict";var Jt=h&&h.__createBinding||(Object.create?function(t,e,r,i){i===void 0&&(i=r);var n=Object.getOwnPropertyDescriptor(e,r);(!n||("get"in n?!e.__esModule:n.writable||n.configurable))&&(n={enumerable:!0,get:function(){return e[r]}}),Object.defineProperty(t,i,n)}:function(t,e,r,i){i===void 0&&(i=r),t[i]=e[r]}),Xt=h&&h.__setModuleDefault||(Object.create?function(t,e){Object.defineProperty(t,"default",{enumerable:!0,value:e})}:function(t,e){t.default=e}),we=h&&h.__importStar||function(t){if(t&&t.__esModule)return t;var e={};if(t!=null)for(var r in t)r!=="default"&&Object.prototype.hasOwnProperty.call(t,r)&&Jt(e,t,r);return Xt(e,t),e},N=h&&h.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(h,"__esModule",{value:!0});h.SignalRegistry=h.TempleException=h.TempleEmitter=h.TempleElement=h.TempleRegistry=h.TempleComponent=h.TempleDataMap=h.emitter=h.signal=h.innerHTML=h.children=h.classnames=h.props=h.env=h.data=void 0;var Yt=N(Me());h.TempleException=Yt.default;var Vt=N(Ve());h.TempleComponent=Vt.default;var Kt=N(be());h.TempleRegistry=Kt.default;var Qt=N($e());h.TempleElement=Qt.default;var dt=we(Q());h.emitter=dt.default;Object.defineProperty(h,"TempleEmitter",{enumerable:!0,get:function(){return dt.TempleEmitter}});var ft=we(z());h.data=ft.default;Object.defineProperty(h,"TempleDataMap",{enumerable:!0,get:function(){return ft.TempleDataMap}});var er=N(Ke());h.env=er.default;var tr=N(Re());h.props=tr.default;var rr=N(et());h.classnames=rr.default;var pt=we(rt());h.children=pt.default;Object.defineProperty(h,"innerHTML",{enumerable:!0,get:function(){return pt.innerHTML}});var gt=we(st());h.signal=gt.default;Object.defineProperty(h,"SignalRegistry",{enumerable:!0,get:function(){return gt.SignalRegistry}});ct()});var I=O((wr,ht)=>{ht.exports={...ze()}});var mt=O((xr,xe)=>{var nr=typeof window<"u"?window:typeof WorkerGlobalScope<"u"&&self instanceof WorkerGlobalScope?self:{};var c=function(t){var e=/(?:^|\s)lang(?:uage)?-([\w-]+)(?=\s|$)/i,r=0,i={},n={manual:t.Prism&&t.Prism.manual,disableWorkerMessageHandler:t.Prism&&t.Prism.disableWorkerMessageHandler,util:{encode:function s(a){return a instanceof p?new p(a.type,s(a.content),a.alias):Array.isArray(a)?a.map(s):a.replace(/&/g,"&").replace(/"u")return null;if("currentScript"in document)return document.currentScript;try{throw new Error}catch(o){var s=(/at [^(\r\n]*\((.*):[^:]+:[^:]+\)$/i.exec(o.stack)||[])[1];if(s){var a=document.getElementsByTagName("script");for(var l in a)if(a[l].src==s)return a[l]}return null}},isActive:function(s,a,l){for(var o="no-"+a;s;){var u=s.classList;if(u.contains(a))return!0;if(u.contains(o))return!1;s=s.parentElement}return!!l}},languages:{plain:i,plaintext:i,text:i,txt:i,extend:function(s,a){var l=n.util.clone(n.languages[s]);for(var o in a)l[o]=a[o];return l},insertBefore:function(s,a,l,o){o=o||n.languages;var u=o[s],f={};for(var b in u)if(u.hasOwnProperty(b)){if(b==a)for(var d in l)l.hasOwnProperty(d)&&(f[d]=l[d]);l.hasOwnProperty(b)||(f[b]=u[b])}var x=o[s];return o[s]=f,n.languages.DFS(n.languages,function(P,q){q===x&&P!=s&&(this[P]=f)}),f},DFS:function s(a,l,o,u){u=u||{};var f=n.util.objId;for(var b in a)if(a.hasOwnProperty(b)){l.call(a,b,a[b],o||b);var d=a[b],x=n.util.type(d);x==="Object"&&!u[f(d)]?(u[f(d)]=!0,s(d,l,null,u)):x==="Array"&&!u[f(d)]&&(u[f(d)]=!0,s(d,l,b,u))}}},plugins:{},highlightAll:function(s,a){n.highlightAllUnder(document,s,a)},highlightAllUnder:function(s,a,l){var o={callback:l,container:s,selector:'code[class*="language-"], [class*="language-"] code, code[class*="lang-"], [class*="lang-"] code'};n.hooks.run("before-highlightall",o),o.elements=Array.prototype.slice.apply(o.container.querySelectorAll(o.selector)),n.hooks.run("before-all-elements-highlight",o);for(var u=0,f;f=o.elements[u++];)n.highlightElement(f,a===!0,o.callback)},highlightElement:function(s,a,l){var o=n.util.getLanguage(s),u=n.languages[o];n.util.setLanguage(s,o);var f=s.parentElement;f&&f.nodeName.toLowerCase()==="pre"&&n.util.setLanguage(f,o);var b=s.textContent,d={element:s,language:o,grammar:u,code:b};function x(q){d.highlightedCode=q,n.hooks.run("before-insert",d),d.element.innerHTML=d.highlightedCode,n.hooks.run("after-highlight",d),n.hooks.run("complete",d),l&&l.call(d.element)}if(n.hooks.run("before-sanity-check",d),f=d.element.parentElement,f&&f.nodeName.toLowerCase()==="pre"&&!f.hasAttribute("tabindex")&&f.setAttribute("tabindex","0"),!d.code){n.hooks.run("complete",d),l&&l.call(d.element);return}if(n.hooks.run("before-highlight",d),!d.grammar){x(n.util.encode(d.code));return}if(a&&t.Worker){var P=new Worker(n.filename);P.onmessage=function(q){x(q.data)},P.postMessage(JSON.stringify({language:d.language,code:d.code,immediateClose:!0}))}else x(n.highlight(d.code,d.grammar,d.language))},highlight:function(s,a,l){var o={code:s,grammar:a,language:l};if(n.hooks.run("before-tokenize",o),!o.grammar)throw new Error('The language "'+o.language+'" has no grammar.');return o.tokens=n.tokenize(o.code,o.grammar),n.hooks.run("after-tokenize",o),p.stringify(n.util.encode(o.tokens),o.language)},tokenize:function(s,a){var l=a.rest;if(l){for(var o in l)a[o]=l[o];delete a.rest}var u=new _;return y(u,u.head,s),g(s,u,a,u.head,0),F(u)},hooks:{all:{},add:function(s,a){var l=n.hooks.all;l[s]=l[s]||[],l[s].push(a)},run:function(s,a){var l=n.hooks.all[s];if(!(!l||!l.length))for(var o=0,u;u=l[o++];)u(a)}},Token:p};t.Prism=n;function p(s,a,l,o){this.type=s,this.content=a,this.alias=l,this.length=(o||"").length|0}p.stringify=function s(a,l){if(typeof a=="string")return a;if(Array.isArray(a)){var o="";return a.forEach(function(x){o+=s(x,l)}),o}var u={type:a.type,content:s(a.content,l),tag:"span",classes:["token",a.type],attributes:{},language:l},f=a.alias;f&&(Array.isArray(f)?Array.prototype.push.apply(u.classes,f):u.classes.push(f)),n.hooks.run("wrap",u);var b="";for(var d in u.attributes)b+=" "+d+'="'+(u.attributes[d]||"").replace(/"/g,""")+'"';return"<"+u.tag+' class="'+u.classes.join(" ")+'"'+b+">"+u.content+""};function m(s,a,l,o){s.lastIndex=a;var u=s.exec(l);if(u&&o&&u[1]){var f=u[1].length;u.index+=f,u[0]=u[0].slice(f)}return u}function g(s,a,l,o,u,f){for(var b in l)if(!(!l.hasOwnProperty(b)||!l[b])){var d=l[b];d=Array.isArray(d)?d:[d];for(var x=0;x=f.reach);L+=j.value.length,j=j.next){var B=j.value;if(a.length>s.length)return;if(!(B instanceof p)){var ce=1,$;if(Ue){if($=m(Ze,L,s,Ge),!$||$.index>=s.length)break;var de=$.index,wt=$.index+$[0].length,R=L;for(R+=j.value.length;de>=R;)j=j.next,R+=j.value.length;if(R-=j.value.length,L=R,j.value instanceof p)continue;for(var V=j;V!==a.tail&&(Rf.reach&&(f.reach=Se);var pe=j.prev;ke&&(pe=y(a,pe,ke),L+=ke.length),A(a,pe,ce);var At=new p(b,q?n.tokenize(fe,q):fe,vt,fe);if(j=y(a,pe,At),We&&y(a,j,We),ce>1){var Pe={cause:b+","+x,reach:Se};g(s,a,l,j.prev,L,Pe),f&&Pe.reach>f.reach&&(f.reach=Pe.reach)}}}}}}function _(){var s={value:null,prev:null,next:null},a={value:null,prev:s,next:null};s.next=a,this.head=s,this.tail=a,this.length=0}function y(s,a,l){var o=a.next,u={value:l,prev:a,next:o};return a.next=u,o.prev=u,s.length++,u}function A(s,a,l){for(var o=a.next,u=0;u/,greedy:!0},prolog:{pattern:/<\?[\s\S]+?\?>/,greedy:!0},doctype:{pattern:/"'[\]]|"[^"]*"|'[^']*')+(?:\[(?:[^<"'\]]|"[^"]*"|'[^']*'|<(?!!--)|)*\]\s*)?>/i,greedy:!0,inside:{"internal-subset":{pattern:/(^[^\[]*\[)[\s\S]+(?=\]>$)/,lookbehind:!0,greedy:!0,inside:null},string:{pattern:/"[^"]*"|'[^']*'/,greedy:!0},punctuation:/^$|[[\]]/,"doctype-tag":/^DOCTYPE/i,name:/[^\s<>'"]+/}},cdata:{pattern://i,greedy:!0},tag:{pattern:/<\/?(?!\d)[^\s>\/=$<%]+(?:\s(?:\s*[^\s>\/=]+(?:\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))|(?=[\s/>])))+)?\s*\/?>/,greedy:!0,inside:{tag:{pattern:/^<\/?[^\s>\/]+/,inside:{punctuation:/^<\/?/,namespace:/^[^\s>\/:]+:/}},"special-attr":[],"attr-value":{pattern:/=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+)/,inside:{punctuation:[{pattern:/^=/,alias:"attr-equals"},{pattern:/^(\s*)["']|["']$/,lookbehind:!0}]}},punctuation:/\/?>/,"attr-name":{pattern:/[^\s>\/]+/,inside:{namespace:/^[^\s>\/:]+:/}}}},entity:[{pattern:/&[\da-z]{1,8};/i,alias:"named-entity"},/&#x?[\da-f]{1,8};/i]};c.languages.markup.tag.inside["attr-value"].inside.entity=c.languages.markup.entity;c.languages.markup.doctype.inside["internal-subset"].inside=c.languages.markup;c.hooks.add("wrap",function(t){t.type==="entity"&&(t.attributes.title=t.content.replace(/&/,"&"))});Object.defineProperty(c.languages.markup.tag,"addInlined",{value:function(e,r){var i={};i["language-"+r]={pattern:/(^$)/i,lookbehind:!0,inside:c.languages[r]},i.cdata=/^$/i;var n={"included-cdata":{pattern://i,inside:i}};n["language-"+r]={pattern:/[\s\S]+/,inside:c.languages[r]};var p={};p[e]={pattern:RegExp(/(<__[^>]*>)(?:))*\]\]>|(?!)/.source.replace(/__/g,function(){return e}),"i"),lookbehind:!0,greedy:!0,inside:n},c.languages.insertBefore("markup","cdata",p)}});Object.defineProperty(c.languages.markup.tag,"addAttribute",{value:function(t,e){c.languages.markup.tag.inside["special-attr"].push({pattern:RegExp(/(^|["'\s])/.source+"(?:"+t+")"+/\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))/.source,"i"),lookbehind:!0,inside:{"attr-name":/^[^\s=]+/,"attr-value":{pattern:/=[\s\S]+/,inside:{value:{pattern:/(^=\s*(["']|(?!["'])))\S[\s\S]*(?=\2$)/,lookbehind:!0,alias:[e,"language-"+e],inside:c.languages[e]},punctuation:[{pattern:/^=/,alias:"attr-equals"},/"|'/]}}}})}});c.languages.html=c.languages.markup;c.languages.mathml=c.languages.markup;c.languages.svg=c.languages.markup;c.languages.xml=c.languages.extend("markup",{});c.languages.ssml=c.languages.xml;c.languages.atom=c.languages.xml;c.languages.rss=c.languages.xml;(function(t){var e=/(?:"(?:\\(?:\r\n|[\s\S])|[^"\\\r\n])*"|'(?:\\(?:\r\n|[\s\S])|[^'\\\r\n])*')/;t.languages.css={comment:/\/\*[\s\S]*?\*\//,atrule:{pattern:RegExp("@[\\w-](?:"+/[^;{\s"']|\s+(?!\s)/.source+"|"+e.source+")*?"+/(?:;|(?=\s*\{))/.source),inside:{rule:/^@[\w-]+/,"selector-function-argument":{pattern:/(\bselector\s*\(\s*(?![\s)]))(?:[^()\s]|\s+(?![\s)])|\((?:[^()]|\([^()]*\))*\))+(?=\s*\))/,lookbehind:!0,alias:"selector"},keyword:{pattern:/(^|[^\w-])(?:and|not|only|or)(?![\w-])/,lookbehind:!0}}},url:{pattern:RegExp("\\burl\\((?:"+e.source+"|"+/(?:[^\\\r\n()"']|\\[\s\S])*/.source+")\\)","i"),greedy:!0,inside:{function:/^url/i,punctuation:/^\(|\)$/,string:{pattern:RegExp("^"+e.source+"$"),alias:"url"}}},selector:{pattern:RegExp(`(^|[{}\\s])[^{}\\s](?:[^{};"'\\s]|\\s+(?![\\s{])|`+e.source+")*(?=\\s*\\{)"),lookbehind:!0},string:{pattern:e,greedy:!0},property:{pattern:/(^|[^-\w\xA0-\uFFFF])(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*(?=\s*:)/i,lookbehind:!0},important:/!important\b/i,function:{pattern:/(^|[^-a-z0-9])[-a-z0-9]+(?=\()/i,lookbehind:!0},punctuation:/[(){};:,]/},t.languages.css.atrule.inside.rest=t.languages.css;var r=t.languages.markup;r&&(r.tag.addInlined("style","css"),r.tag.addAttribute("style","css"))})(c);c.languages.clike={comment:[{pattern:/(^|[^\\])\/\*[\s\S]*?(?:\*\/|$)/,lookbehind:!0,greedy:!0},{pattern:/(^|[^\\:])\/\/.*/,lookbehind:!0,greedy:!0}],string:{pattern:/(["'])(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/,greedy:!0},"class-name":{pattern:/(\b(?:class|extends|implements|instanceof|interface|new|trait)\s+|\bcatch\s+\()[\w.\\]+/i,lookbehind:!0,inside:{punctuation:/[.\\]/}},keyword:/\b(?:break|catch|continue|do|else|finally|for|function|if|in|instanceof|new|null|return|throw|try|while)\b/,boolean:/\b(?:false|true)\b/,function:/\b\w+(?=\()/,number:/\b0x[\da-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:e[+-]?\d+)?/i,operator:/[<>]=?|[!=]=?=?|--?|\+\+?|&&?|\|\|?|[?*/~^%]/,punctuation:/[{}[\];(),.:]/};c.languages.javascript=c.languages.extend("clike",{"class-name":[c.languages.clike["class-name"],{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$A-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\.(?:constructor|prototype))/,lookbehind:!0}],keyword:[{pattern:/((?:^|\})\s*)catch\b/,lookbehind:!0},{pattern:/(^|[^.]|\.\.\.\s*)\b(?:as|assert(?=\s*\{)|async(?=\s*(?:function\b|\(|[$\w\xA0-\uFFFF]|$))|await|break|case|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally(?=\s*(?:\{|$))|for|from(?=\s*(?:['"]|$))|function|(?:get|set)(?=\s*(?:[#\[$\w\xA0-\uFFFF]|$))|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)\b/,lookbehind:!0}],function:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*(?:\.\s*(?:apply|bind|call)\s*)?\()/,number:{pattern:RegExp(/(^|[^\w$])/.source+"(?:"+(/NaN|Infinity/.source+"|"+/0[bB][01]+(?:_[01]+)*n?/.source+"|"+/0[oO][0-7]+(?:_[0-7]+)*n?/.source+"|"+/0[xX][\dA-Fa-f]+(?:_[\dA-Fa-f]+)*n?/.source+"|"+/\d+(?:_\d+)*n/.source+"|"+/(?:\d+(?:_\d+)*(?:\.(?:\d+(?:_\d+)*)?)?|\.\d+(?:_\d+)*)(?:[Ee][+-]?\d+(?:_\d+)*)?/.source)+")"+/(?![\w$])/.source),lookbehind:!0},operator:/--|\+\+|\*\*=?|=>|&&=?|\|\|=?|[!=]==|<<=?|>>>?=?|[-+*/%&|^!=<>]=?|\.{3}|\?\?=?|\?\.?|[~:]/});c.languages.javascript["class-name"][0].pattern=/(\b(?:class|extends|implements|instanceof|interface|new)\s+)[\w.\\]+/;c.languages.insertBefore("javascript","keyword",{regex:{pattern:RegExp(/((?:^|[^$\w\xA0-\uFFFF."'\])\s]|\b(?:return|yield))\s*)/.source+/\//.source+"(?:"+/(?:\[(?:[^\]\\\r\n]|\\.)*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}/.source+"|"+/(?:\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.)*\])*\])*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}v[dgimyus]{0,7}/.source+")"+/(?=(?:\s|\/\*(?:[^*]|\*(?!\/))*\*\/)*(?:$|[\r\n,.;:})\]]|\/\/))/.source),lookbehind:!0,greedy:!0,inside:{"regex-source":{pattern:/^(\/)[\s\S]+(?=\/[a-z]*$)/,lookbehind:!0,alias:"language-regex",inside:c.languages.regex},"regex-delimiter":/^\/|\/$/,"regex-flags":/^[a-z]+$/}},"function-variable":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*[=:]\s*(?:async\s*)?(?:\bfunction\b|(?:\((?:[^()]|\([^()]*\))*\)|(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)\s*=>))/,alias:"function"},parameter:[{pattern:/(function(?:\s+(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)?\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\))/,lookbehind:!0,inside:c.languages.javascript},{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$a-z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*=>)/i,lookbehind:!0,inside:c.languages.javascript},{pattern:/(\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*=>)/,lookbehind:!0,inside:c.languages.javascript},{pattern:/((?:\b|\s|^)(?!(?:as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)(?![$\w\xA0-\uFFFF]))(?:(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*)\(\s*|\]\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*\{)/,lookbehind:!0,inside:c.languages.javascript}],constant:/\b[A-Z](?:[A-Z_]|\dx?)*\b/});c.languages.insertBefore("javascript","string",{hashbang:{pattern:/^#!.*/,greedy:!0,alias:"comment"},"template-string":{pattern:/`(?:\\[\s\S]|\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}|(?!\$\{)[^\\`])*`/,greedy:!0,inside:{"template-punctuation":{pattern:/^`|`$/,alias:"string"},interpolation:{pattern:/((?:^|[^\\])(?:\\{2})*)\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}/,lookbehind:!0,inside:{"interpolation-punctuation":{pattern:/^\$\{|\}$/,alias:"punctuation"},rest:c.languages.javascript}},string:/[\s\S]+/}},"string-property":{pattern:/((?:^|[,{])[ \t]*)(["'])(?:\\(?:\r\n|[\s\S])|(?!\2)[^\\\r\n])*\2(?=\s*:)/m,lookbehind:!0,greedy:!0,alias:"property"}});c.languages.insertBefore("javascript","operator",{"literal-property":{pattern:/((?:^|[,{])[ \t]*)(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*:)/m,lookbehind:!0,alias:"property"}});c.languages.markup&&(c.languages.markup.tag.addInlined("script","javascript"),c.languages.markup.tag.addAttribute(/on(?:abort|blur|change|click|composition(?:end|start|update)|dblclick|error|focus(?:in|out)?|key(?:down|up)|load|mouse(?:down|enter|leave|move|out|over|up)|reset|resize|scroll|select|slotchange|submit|unload|wheel)/.source,"javascript"));c.languages.js=c.languages.javascript;(function(){if(typeof c>"u"||typeof document>"u")return;Element.prototype.matches||(Element.prototype.matches=Element.prototype.msMatchesSelector||Element.prototype.webkitMatchesSelector);var t="Loading\u2026",e=function(T,v){return"\u2716 Error "+T+" while fetching file: "+v},r="\u2716 Error: File does not exist or is empty",i={js:"javascript",py:"python",rb:"ruby",ps1:"powershell",psm1:"powershell",sh:"bash",bat:"batch",h:"c",tex:"latex"},n="data-src-status",p="loading",m="loaded",g="failed",_="pre[data-src]:not(["+n+'="'+m+'"]):not(['+n+'="'+p+'"])';function y(T,v,E){var s=new XMLHttpRequest;s.open("GET",T,!0),s.onreadystatechange=function(){s.readyState==4&&(s.status<400&&s.responseText?v(s.responseText):s.status>=400?E(e(s.status,s.statusText)):E(r))},s.send(null)}function A(T){var v=/^\s*(\d+)\s*(?:(,)\s*(?:(\d+)\s*)?)?$/.exec(T||"");if(v){var E=Number(v[1]),s=v[2],a=v[3];return s?a?[E,Number(a)]:[E,void 0]:[E,E]}}c.hooks.add("before-highlightall",function(T){T.selector+=", "+_}),c.hooks.add("before-sanity-check",function(T){var v=T.element;if(v.matches(_)){T.code="",v.setAttribute(n,p);var E=v.appendChild(document.createElement("CODE"));E.textContent=t;var s=v.getAttribute("data-src"),a=T.language;if(a==="none"){var l=(/\.(\w+)$/.exec(s)||[,"none"])[1];a=i[l]||l}c.util.setLanguage(E,a),c.util.setLanguage(v,a);var o=c.plugins.autoloader;o&&o.loadLanguages(a),y(s,function(u){v.setAttribute(n,m);var f=A(v.getAttribute("data-range"));if(f){var b=u.split(/\r\n?|\n/g),d=f[0],x=f[1]==null?b.length:f[1];d<0&&(d+=b.length),d=Math.max(0,Math.min(d-1,b.length)),x<0&&(x+=b.length),x=Math.max(0,Math.min(x,b.length)),u=b.slice(d,x).join(`
-`),v.hasAttribute("data-start")||v.setAttribute("data-start",String(d+1))}E.textContent=u,c.highlightElement(E)},function(u){v.setAttribute(n,g),E.textContent=u})}}),c.plugins.fileHighlight={highlight:function(v){for(var E=(v||document).querySelectorAll(_),s=0,a;a=E[s++];)c.highlightElement(a)}};var F=!1;c.fileHighlight=function(){F||(console.warn("Prism.fileHighlight is deprecated. Use `Prism.plugins.fileHighlight.highlight` instead."),F=!0),c.plugins.fileHighlight.highlight.apply(this,arguments)}})()});var oe=O((Tr,bt)=>{bt.exports={...ze()}});var ir={};St(ir,{BUILD_ID:()=>sr,TempleComponent:()=>k.TempleComponent,TempleElement:()=>k.TempleElement,TempleEmitter:()=>k.TempleEmitter,TempleException:()=>k.TempleException,TempleRegistry:()=>k.TempleRegistry,children:()=>k.children,components:()=>ar,data:()=>k.data,emitter:()=>k.emitter,props:()=>k.props,signal:()=>k.signal});var C=D(I());var Ae=D(I()),Z=class extends Ae.TempleComponent{static component=["main","Main_fd7f1af6410c5b5c8e1f"];styles(){return""}template(){let e=this.props,r=()=>this.originalChildren;return()=>[Ae.TempleRegistry.createElement("main",{},[...this._toNodeList(r())]).element]}};var w=D(I()),He=D(mt()),_t=D(oe()),W=class extends w.TempleComponent{static component=["code","Code_6f36bc13bb6a166c7abc"];styles(){return`:host {
+var TempleAPI=(()=>{var Zt=Object.create;var Oe=Object.defineProperty;var Jt=Object.getOwnPropertyDescriptor;var Xt=Object.getOwnPropertyNames;var Yt=Object.getPrototypeOf,Vt=Object.prototype.hasOwnProperty;var M=(t,e)=>()=>(e||t((e={exports:{}}).exports,e),e.exports),Kt=(t,e)=>{for(var r in e)Oe(t,r,{get:e[r],enumerable:!0})},vt=(t,e,r,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let s of Xt(e))!Vt.call(t,s)&&s!==r&&Oe(t,s,{get:()=>e[s],enumerable:!(i=Jt(e,s))||i.enumerable});return t};var T=(t,e,r)=>(r=t!=null?Zt(Yt(t)):{},vt(e||!t||!t.__esModule?Oe(r,"default",{value:t,enumerable:!0}):r,t)),Qt=t=>vt(Oe({},"__esModule",{value:!0}),t);var _e=M(nt=>{"use strict";Object.defineProperty(nt,"__esModule",{value:!0});var st=class extends Error{static for(e,...r){return r.forEach(function(i){e=e.replace("%s",i)}),new this(e)}static forErrorsFound(e){let r=new this("Invalid Parameters");return r.errors=e,r}static require(e,r,...i){if(!e){for(let s of i)r=r.replace("%s",s);throw new this(r)}}constructor(e,r=500){super(),this.errors={},this.start=0,this.end=0,this.message=e,this.name=this.constructor.name,this.code=r}withCode(e){return this.code=e,this}withPosition(e,r){return this.start=e,this.end=r,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};nt.default=st});var Re=M(j=>{"use strict";var er=j&&j.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(j,"__esModule",{value:!0});j.match=j.TempleEmitter=j.events=void 0;j.bindAttribute=B;j.unbindAttribute=xt;var yt=er(qe());j.events=["click","dblclick","mousedown","mouseup","mousemove","mouseover","mouseout","wheel","keydown","keypress","keyup","blur","change","contextmenu","focus","input","submit","invalid","reset","search","select","copy","cut","paste","drag","dragstart","dragend","dragover","dragenter","dragleave","drop","scroll","durationchange","ended","error","loadeddata","loadedmetadata","loadstart","pause","play","playing","progress","ratechange","seeked","seeking","stalled","suspend","timeupdate","volumechange","waiting","animationstart","animationend","animationiteration","transitionend","toggle"];var $e=class extends EventTarget{emit(e,r){return this.dispatchEvent(new CustomEvent(e,{detail:r})),this}on(e,r){if(e==="ready"&&document.readyState!=="loading"){let i=new CustomEvent("ready");return setTimeout(()=>r(i),1),this}return this.addEventListener(e,r),this}once(e,r){let i=s=>{this.unbind(e,i),r(s)};return this.on(e,i),this}unbind(e,r){return this.removeEventListener(e,r),this}};j.TempleEmitter=$e;var tr=(t,e)=>Array.from(t.querySelectorAll("*")).filter(r=>{let i=yt.default.get(r),s=i&&i.hasAttribute(e)&&!i.hasEvent(e);return s&&i.addEvent(e),s}).map(r=>yt.default.get(r));j.match=tr;function B(t,e){Ne.on("mounted",r=>{if(!r.detail)return;let i=r.detail;(0,j.match)(i.shadowRoot||i,t).forEach(e)})}function xt(t,e){Ne.on("unmounted",r=>{if(!r.detail)return;let i=r.detail;(0,j.match)(i.shadowRoot||i,t).forEach(e)})}var Ne=new $e;j.default=(document.onreadystatechange=()=>{document.readyState!=="loading"&&Ne.emit("ready")},B("mount",t=>{let e=t.getAttribute("mount");if(typeof e=="function"){let r=new CustomEvent("mount",{detail:{node:t,target:t.element}});e(r)}}),xt("unmount",t=>{let e=t.getAttribute("unmount");if(typeof e=="function"){let r=new CustomEvent("unmount",{detail:{node:t,target:t.element}});e(r)}}),B("connect",t=>{let e=t.getAttribute("connect");if(typeof e=="function"){let r=new CustomEvent("connect",{detail:{node:t,target:t.element}});e(r)}}),B("disconnect",t=>{let e=t.getAttribute("disconnect");if(typeof e=="function"){let r=new CustomEvent("disconnect",{detail:{node:t,target:t.element}});e(r)}}),B("adopt",t=>{let e=t.getAttribute("adopt");if(typeof e=="function"){let r=new CustomEvent("adopt",{detail:{node:t,target:t.element}});e(r)}}),B("if",t=>{let e=t.getAttribute("if");(e===!1||e==="false"||typeof e=="function"&&!e())&&t.element.remove()}),j.events.forEach(t=>B(t,e=>{let r=e.getAttribute(t);typeof r=="function"&&(e.element.removeEventListener(t,r),e.element.addEventListener(t,r))})),Ne)});var lt=M(ve=>{"use strict";var rr=ve&&ve.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ve,"__esModule",{value:!0});var at=rr(Re()),it=class{get attributes(){return Object.assign({},this._attributes)}get element(){return this._element}get events(){return this._events}constructor(e,r){this._events=new Set,this._element=e,this._attributes=r}addEvent(e){return this._events.add(e),this}getAttribute(e){return this._attributes[e]}hasAttribute(e){return e in this._attributes}hasEvent(e){return this._events.has(e)}removeAttribute(e,r=!1){let i=this.getAttribute(e);return typeof i>"u"?this:(delete this._attributes[e],this._element.removeAttribute(e),r||at.default.emit("attribute-remove",{element:this,key:e,previous:i}),this)}setAttribute(e,r,i=!1){if(typeof r>"u")return this.removeAttribute(e,i);let s=this.getAttribute(e);return s===r?this:(this._attributes[e]=r,typeof r=="string"&&this._element.setAttribute(e,r),i||(typeof s>"u"?at.default.emit("attribute-create",{element:this,key:e,value:r}):at.default.emit("attribute-update",{element:this,key:e,value:r,previous:s})),this)}setAttributes(e,r=!1){for(let[s,d]of Object.entries(e))this.setAttribute(s,d,r);let i=Object.keys(e);for(let s of Object.keys(this._attributes))i.includes(s)||this.removeAttribute(s,r);return this}};ve.default=it});var qe=M(ye=>{"use strict";var sr=ye&&ye.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ye,"__esModule",{value:!0});var nr=sr(lt()),At=document.createElement("textarea"),ar=t=>(At.innerHTML=t,At.value),He=class{static get elements(){return this._elements}static createComponent(e,r,i,s=[]){let d=document.createElement("template");d.innerHTML=`<${e}>`;let b=d.content.querySelector(`${e}`);return Object.setPrototypeOf(b,r.prototype),b.constructor=r.constructor,b.constructor.component=r.component,b.register(i,s),b.element}static createElement(e,r,i=[]){let s=document.createElement(e);for(let[d,_]of Object.entries(r))typeof _=="string"?s.setAttribute(d,_):_===!0&&s.setAttribute(d,d);return i.filter(d=>typeof d<"u").forEach(d=>s.appendChild(d)),this.register(s,r)}static createText(e,r=!0){return document.createTextNode(ar(e))}static filter(e){let r=[];return this._elements.forEach((i,s)=>{e(i,s)&&r.push(i)}),r}static get(e){return this._elements.get(e)||null}static has(e){return this._elements.has(e)}static map(e){let r=[];return this._elements.forEach((i,s)=>{r.push(e(i,s))}),r}static register(e,r){if(this.has(e))return this.get(e);let i=new nr.default(e,r||{});return this._elements.set(e,i),i}};He._elements=new Map;ye.default=He});var ee=M(xe=>{"use strict";Object.defineProperty(xe,"__esModule",{value:!0});xe.TempleDataMap=void 0;var Ie=class{constructor(){window.__APP_DATA__||(window.__APP_DATA__={})}clear(){return window.__APP_DATA__={},this}delete(e){return this.has(e)?(delete window.__APP_DATA__[e],!0):!1}entries(){return Object.entries(window.__APP_DATA__)}has(e){return e in window.__APP_DATA__}get(e){return window.__APP_DATA__[e]}keys(){return Object.keys(window.__APP_DATA__)}set(e,r){return window.__APP_DATA__[e]=r,this}values(){return Object.values(window.__APP_DATA__)}};xe.TempleDataMap=Ie;var ir=new Ie;xe.default=ir});var Tt=M(Ae=>{"use strict";var Be=Ae&&Ae.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Ae,"__esModule",{value:!0});var wt=Be(_e()),G=Be(qe()),W=Be(Re()),ze=Be(ee()),ot=class t extends HTMLElement{static register(){customElements.define(this.component[0],this)}get attr(){return Object.fromEntries(Array.from(this.attributes).map(e=>[e.name,e.value]))}get element(){if(!G.default.has(this))throw wt.default.for("Component not mapped.");return G.default.get(this)}get metadata(){let[e,r]=this.constructor.component;return{tagname:e,classname:r}}get originalChildren(){return this._children}get initiated(){return this._initiated}get props(){return this.getAttributes()}get virtual(){return this._virtual}set props(e){this.setAttributes(e)}constructor(){if(super(),this._initiated=!1,this._template=null,this._children=void 0,this._rendering=!1,this._observer=null,this._virtual=!1,!G.default.has(this))throw wt.default.for("Component not mapped.")}adoptedCallback(){this.render(),W.default.emit("adopt",this)}connectedCallback(){this.wait(),W.default.emit("connect",this)}disconnectedCallback(){W.default.emit("disconnect",this)}getAttribute(e){return this.element.getAttribute(e)}getAttributes(){return Object.assign({},this.element.attributes)}getParentComponent(){let e=this.parentElement;for(;e;){if(e instanceof t)return e;e=e.parentElement}return null}hasAttribute(e){return this.element.hasAttribute(e)}register(e={},r=[]){G.default.has(this)?G.default.get(this).setAttributes(e):G.default.register(this,e);for(let[i,s]of Object.entries(e))typeof s=="string"?super.setAttribute(i,s):s===!0&&super.setAttribute(i,i);this._children=r,this._virtual=!0,this.connectedCallback()}removeAttribute(e){this.hasAttribute(e)&&this.element.removeAttribute(e),super.hasAttribute(e)&&super.removeAttribute(e)}render(){let e=this.getParentComponent();if(e&&!e.initiated)return;if(this._rendering)return;this._rendering=!0;let r=ze.default.get("current");ze.default.set("current",this);let i=this.styles();this._template?W.default.emit("unmounted",this):this._template=this.template();let s=this._template().filter(Boolean);if(i.length===0)this.textContent="",s.forEach(d=>this.appendChild(d));else{this.shadowRoot||this.attachShadow({mode:"open"});let d=this.shadowRoot;this.textContent="",d.textContent="";let _=document.createElement("style");_.innerText=i,d.appendChild(_),s.forEach(b=>{var v;return(v=this.shadowRoot)===null||v===void 0?void 0:v.appendChild(b)})}return r?ze.default.set("current",r):ze.default.delete("current"),this._initiated=!0,this._rendering=!1,W.default.emit("mounted",this),this.shadowRoot?this.shadowRoot.innerHTML:this.innerHTML}setAttribute(e,r){this.element.setAttribute(e,r),(typeof r=="string"||r===!0)&&super.setAttribute(e,r)}setAttributes(e){this.element.setAttributes(e)}wait(){if(document.readyState!=="loading")this._update();else{let e=()=>{this._update(),W.default.unbind("ready",e)};W.default.on("ready",e)}}_toNodeList(e){return e instanceof Node?[e]:Array.isArray(e)&&e.every(r=>r instanceof Node)?e:[G.default.createText(String(e))]}_update(){typeof this._children>"u"&&(this._children=Array.from(this.childNodes||[])),this._initiated||this.render()}};Ae.default=ot});var te=M(we=>{"use strict";var Et=we&&we.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(we,"__esModule",{value:!0});we.default=ur;var lr=Et(_e()),or=Et(ee());function ur(t=null,e=!1){if(!t&&(t=or.default.get("current"),!t)){if(!e)throw lr.default.for("Not called within a Temple component");return null}return t}});var kt=M(Te=>{"use strict";var cr=Te&&Te.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Te,"__esModule",{value:!0});var dr=cr(ee());function fr(t){let e=dr.default.get("env")||{};return t?e[t]||null:e}Te.default=fr});var ut=M(Ee=>{"use strict";var Ft=Ee&&Ee.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Ee,"__esModule",{value:!0});Ee.default=hr;var pr=Ft(te()),mr=Ft(ee());function hr(t=null){let e=(0,pr.default)(t,!0);return typeof e=="string"?mr.default.get("props")||{}:e?e.props:{}}});var Pt=M(re=>{"use strict";var Lt=re&&re.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(re,"__esModule",{value:!0});re.classlist=_r;re.default=vr;var gr=Lt(te()),br=Lt(ut());function _r(t=null){var e;if(t==="body")return document.body.classList;if(t==="head")return document.head.classList;if(t==="document")return(e=document.body.parentElement)===null||e===void 0?void 0:e.classList;let r=(0,gr.default)(t);return r?.classList}function vr(t=null){return(0,br.default)(t).class}});var St=M(U=>{"use strict";var yr=U&&U.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(U,"__esModule",{value:!0});U.innerHTML=Ar;U.innerText=wr;U.default=ct;var xr=yr(te());function Ar(t=null){let e=ct(t),r=document.createElement("template");return r.append(...e.map(i=>i.cloneNode(!0))),r.innerHTML}function wr(t=null){let e=ct(t),r=document.createElement("template");return r.append(...e.map(i=>i.cloneNode(!0))),r.innerText}function ct(t=null){let e=(0,xr.default)(t,!0);return typeof e!="string"&&e?e.originalChildren||[]:[]}});var Mt=M(Z=>{"use strict";var Ct=Z&&Z.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Z,"__esModule",{value:!0});Z.SignalRegistry=void 0;Z.default=kr;var Tr=Ct(te()),Er=Ct(_e()),se=class t{static observe(e,r){let i={getter:()=>d.raw,setter:b=>b},s=new Set,d={raw:r,change(b){s.add(b)},getter(b){return i.getter=b,d},setter(b){return i.setter=b,d}};Object.defineProperty(d,"value",{get(){return i.getter()},set(b){let v=i.setter(b),x=t.serialize(v)!==t.serialize(d.raw);d.raw=v,x&&(s.forEach(h=>h(v)),e.render())}});let _=this._observers.get(e);return _?(_.observed++,_.values.push(d)):this._observers.set(e,{observed:1,values:[d]}),d}static observer(e){return this._observers.get(e)||null}static serialize(e){return JSON.stringify(e)}};Z.SignalRegistry=se;se._observers=new Map;function kr(t,e=null){let r=(0,Tr.default)(e);if(!r.initiated)return se.observe(r,t);let i=se.observer(r);if(!i)throw Er.default.for("Signal state mismatch");return i.values[i.observed++%i.values.length]}});var ft=M(m=>{"use strict";var Fr=m&&m.__createBinding||(Object.create?function(t,e,r,i){i===void 0&&(i=r);var s=Object.getOwnPropertyDescriptor(e,r);(!s||("get"in s?!e.__esModule:s.writable||s.configurable))&&(s={enumerable:!0,get:function(){return e[r]}}),Object.defineProperty(t,i,s)}:function(t,e,r,i){i===void 0&&(i=r),t[i]=e[r]}),Lr=m&&m.__setModuleDefault||(Object.create?function(t,e){Object.defineProperty(t,"default",{enumerable:!0,value:e})}:function(t,e){t.default=e}),ke=m&&m.__importStar||function(t){if(t&&t.__esModule)return t;var e={};if(t!=null)for(var r in t)r!=="default"&&Object.prototype.hasOwnProperty.call(t,r)&&Fr(e,t,r);return Lr(e,t),e},J=m&&m.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(m,"__esModule",{value:!0});m.SignalRegistry=m.TempleException=m.TempleEmitter=m.TempleElement=m.TempleRegistry=m.TempleComponent=m.TempleDataMap=m.emitter=m.signal=m.innerHTML=m.innerText=m.children=m.classnames=m.classlist=m.props=m.env=m.data=m.component=void 0;var Pr=J(_e());m.TempleException=Pr.default;var Sr=J(Tt());m.TempleComponent=Sr.default;var Cr=J(qe());m.TempleRegistry=Cr.default;var Mr=J(lt());m.TempleElement=Mr.default;var jt=ke(Re());m.emitter=jt.default;Object.defineProperty(m,"TempleEmitter",{enumerable:!0,get:function(){return jt.TempleEmitter}});var jr=J(te());m.component=jr.default;var Dt=ke(ee());m.data=Dt.default;Object.defineProperty(m,"TempleDataMap",{enumerable:!0,get:function(){return Dt.TempleDataMap}});var Dr=J(kt());m.env=Dr.default;var Or=J(ut());m.props=Or.default;var Ot=ke(Pt());m.classnames=Ot.default;Object.defineProperty(m,"classlist",{enumerable:!0,get:function(){return Ot.classlist}});var dt=ke(St());m.children=dt.default;Object.defineProperty(m,"innerHTML",{enumerable:!0,get:function(){return dt.innerHTML}});Object.defineProperty(m,"innerText",{enumerable:!0,get:function(){return dt.innerText}});var $t=ke(Mt());m.signal=$t.default;Object.defineProperty(m,"SignalRegistry",{enumerable:!0,get:function(){return $t.SignalRegistry}})});var D=M((ts,Nt)=>{Nt.exports={...ft()}});var $=M((rs,Rt)=>{Rt.exports={...ft()}});var Ht=M((ps,Ke)=>{var $r=typeof window<"u"?window:typeof WorkerGlobalScope<"u"&&self instanceof WorkerGlobalScope?self:{};var c=function(t){var e=/(?:^|\s)lang(?:uage)?-([\w-]+)(?=\s|$)/i,r=0,i={},s={manual:t.Prism&&t.Prism.manual,disableWorkerMessageHandler:t.Prism&&t.Prism.disableWorkerMessageHandler,util:{encode:function n(a){return a instanceof d?new d(a.type,n(a.content),a.alias):Array.isArray(a)?a.map(n):a.replace(/&/g,"&").replace(/"u")return null;if("currentScript"in document)return document.currentScript;try{throw new Error}catch(o){var n=(/at [^(\r\n]*\((.*):[^:]+:[^:]+\)$/i.exec(o.stack)||[])[1];if(n){var a=document.getElementsByTagName("script");for(var l in a)if(a[l].src==n)return a[l]}return null}},isActive:function(n,a,l){for(var o="no-"+a;n;){var u=n.classList;if(u.contains(a))return!0;if(u.contains(o))return!1;n=n.parentElement}return!!l}},languages:{plain:i,plaintext:i,text:i,txt:i,extend:function(n,a){var l=s.util.clone(s.languages[n]);for(var o in a)l[o]=a[o];return l},insertBefore:function(n,a,l,o){o=o||s.languages;var u=o[n],p={};for(var y in u)if(u.hasOwnProperty(y)){if(y==a)for(var f in l)l.hasOwnProperty(f)&&(p[f]=l[f]);l.hasOwnProperty(y)||(p[y]=u[y])}var F=o[n];return o[n]=p,s.languages.DFS(s.languages,function(S,I){I===F&&S!=n&&(this[S]=p)}),p},DFS:function n(a,l,o,u){u=u||{};var p=s.util.objId;for(var y in a)if(a.hasOwnProperty(y)){l.call(a,y,a[y],o||y);var f=a[y],F=s.util.type(f);F==="Object"&&!u[p(f)]?(u[p(f)]=!0,n(f,l,null,u)):F==="Array"&&!u[p(f)]&&(u[p(f)]=!0,n(f,l,y,u))}}},plugins:{},highlightAll:function(n,a){s.highlightAllUnder(document,n,a)},highlightAllUnder:function(n,a,l){var o={callback:l,container:n,selector:'code[class*="language-"], [class*="language-"] code, code[class*="lang-"], [class*="lang-"] code'};s.hooks.run("before-highlightall",o),o.elements=Array.prototype.slice.apply(o.container.querySelectorAll(o.selector)),s.hooks.run("before-all-elements-highlight",o);for(var u=0,p;p=o.elements[u++];)s.highlightElement(p,a===!0,o.callback)},highlightElement:function(n,a,l){var o=s.util.getLanguage(n),u=s.languages[o];s.util.setLanguage(n,o);var p=n.parentElement;p&&p.nodeName.toLowerCase()==="pre"&&s.util.setLanguage(p,o);var y=n.textContent,f={element:n,language:o,grammar:u,code:y};function F(I){f.highlightedCode=I,s.hooks.run("before-insert",f),f.element.innerHTML=f.highlightedCode,s.hooks.run("after-highlight",f),s.hooks.run("complete",f),l&&l.call(f.element)}if(s.hooks.run("before-sanity-check",f),p=f.element.parentElement,p&&p.nodeName.toLowerCase()==="pre"&&!p.hasAttribute("tabindex")&&p.setAttribute("tabindex","0"),!f.code){s.hooks.run("complete",f),l&&l.call(f.element);return}if(s.hooks.run("before-highlight",f),!f.grammar){F(s.util.encode(f.code));return}if(a&&t.Worker){var S=new Worker(s.filename);S.onmessage=function(I){F(I.data)},S.postMessage(JSON.stringify({language:f.language,code:f.code,immediateClose:!0}))}else F(s.highlight(f.code,f.grammar,f.language))},highlight:function(n,a,l){var o={code:n,grammar:a,language:l};if(s.hooks.run("before-tokenize",o),!o.grammar)throw new Error('The language "'+o.language+'" has no grammar.');return o.tokens=s.tokenize(o.code,o.grammar),s.hooks.run("after-tokenize",o),d.stringify(s.util.encode(o.tokens),o.language)},tokenize:function(n,a){var l=a.rest;if(l){for(var o in l)a[o]=l[o];delete a.rest}var u=new v;return x(u,u.head,n),b(n,u,a,u.head,0),E(u)},hooks:{all:{},add:function(n,a){var l=s.hooks.all;l[n]=l[n]||[],l[n].push(a)},run:function(n,a){var l=s.hooks.all[n];if(!(!l||!l.length))for(var o=0,u;u=l[o++];)u(a)}},Token:d};t.Prism=s;function d(n,a,l,o){this.type=n,this.content=a,this.alias=l,this.length=(o||"").length|0}d.stringify=function n(a,l){if(typeof a=="string")return a;if(Array.isArray(a)){var o="";return a.forEach(function(F){o+=n(F,l)}),o}var u={type:a.type,content:n(a.content,l),tag:"span",classes:["token",a.type],attributes:{},language:l},p=a.alias;p&&(Array.isArray(p)?Array.prototype.push.apply(u.classes,p):u.classes.push(p)),s.hooks.run("wrap",u);var y="";for(var f in u.attributes)y+=" "+f+'="'+(u.attributes[f]||"").replace(/"/g,""")+'"';return"<"+u.tag+' class="'+u.classes.join(" ")+'"'+y+">"+u.content+""};function _(n,a,l,o){n.lastIndex=a;var u=n.exec(l);if(u&&o&&u[1]){var p=u[1].length;u.index+=p,u[0]=u[0].slice(p)}return u}function b(n,a,l,o,u,p){for(var y in l)if(!(!l.hasOwnProperty(y)||!l[y])){var f=l[y];f=Array.isArray(f)?f:[f];for(var F=0;F=p.reach);H+=C.value.length,C=C.next){var Q=C.value;if(a.length>n.length)return;if(!(Q instanceof d)){var Ce=1,q;if(gt){if(q=_(bt,H,n,ht),!q||q.index>=n.length)break;var Me=q.index,Wt=q.index+q[0].length,z=H;for(z+=C.value.length;Me>=z;)C=C.next,z+=C.value.length;if(z-=C.value.length,H=z,C.value instanceof d)continue;for(var be=C;be!==a.tail&&(zp.reach&&(p.reach=tt);var De=C.prev;et&&(De=x(a,De,et),H+=et.length),h(a,De,Ce);var Ut=new d(y,I?s.tokenize(je,I):je,Bt,je);if(C=x(a,De,Ut),_t&&x(a,C,_t),Ce>1){var rt={cause:y+","+F,reach:tt};b(n,a,l,C.prev,H,rt),p&&rt.reach>p.reach&&(p.reach=rt.reach)}}}}}}function v(){var n={value:null,prev:null,next:null},a={value:null,prev:n,next:null};n.next=a,this.head=n,this.tail=a,this.length=0}function x(n,a,l){var o=a.next,u={value:l,prev:a,next:o};return a.next=u,o.prev=u,n.length++,u}function h(n,a,l){for(var o=a.next,u=0;u/,greedy:!0},prolog:{pattern:/<\?[\s\S]+?\?>/,greedy:!0},doctype:{pattern:/"'[\]]|"[^"]*"|'[^']*')+(?:\[(?:[^<"'\]]|"[^"]*"|'[^']*'|<(?!!--)|)*\]\s*)?>/i,greedy:!0,inside:{"internal-subset":{pattern:/(^[^\[]*\[)[\s\S]+(?=\]>$)/,lookbehind:!0,greedy:!0,inside:null},string:{pattern:/"[^"]*"|'[^']*'/,greedy:!0},punctuation:/^$|[[\]]/,"doctype-tag":/^DOCTYPE/i,name:/[^\s<>'"]+/}},cdata:{pattern://i,greedy:!0},tag:{pattern:/<\/?(?!\d)[^\s>\/=$<%]+(?:\s(?:\s*[^\s>\/=]+(?:\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))|(?=[\s/>])))+)?\s*\/?>/,greedy:!0,inside:{tag:{pattern:/^<\/?[^\s>\/]+/,inside:{punctuation:/^<\/?/,namespace:/^[^\s>\/:]+:/}},"special-attr":[],"attr-value":{pattern:/=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+)/,inside:{punctuation:[{pattern:/^=/,alias:"attr-equals"},{pattern:/^(\s*)["']|["']$/,lookbehind:!0}]}},punctuation:/\/?>/,"attr-name":{pattern:/[^\s>\/]+/,inside:{namespace:/^[^\s>\/:]+:/}}}},entity:[{pattern:/&[\da-z]{1,8};/i,alias:"named-entity"},/&#x?[\da-f]{1,8};/i]};c.languages.markup.tag.inside["attr-value"].inside.entity=c.languages.markup.entity;c.languages.markup.doctype.inside["internal-subset"].inside=c.languages.markup;c.hooks.add("wrap",function(t){t.type==="entity"&&(t.attributes.title=t.content.replace(/&/,"&"))});Object.defineProperty(c.languages.markup.tag,"addInlined",{value:function(e,r){var i={};i["language-"+r]={pattern:/(^$)/i,lookbehind:!0,inside:c.languages[r]},i.cdata=/^$/i;var s={"included-cdata":{pattern://i,inside:i}};s["language-"+r]={pattern:/[\s\S]+/,inside:c.languages[r]};var d={};d[e]={pattern:RegExp(/(<__[^>]*>)(?:))*\]\]>|(?!)/.source.replace(/__/g,function(){return e}),"i"),lookbehind:!0,greedy:!0,inside:s},c.languages.insertBefore("markup","cdata",d)}});Object.defineProperty(c.languages.markup.tag,"addAttribute",{value:function(t,e){c.languages.markup.tag.inside["special-attr"].push({pattern:RegExp(/(^|["'\s])/.source+"(?:"+t+")"+/\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))/.source,"i"),lookbehind:!0,inside:{"attr-name":/^[^\s=]+/,"attr-value":{pattern:/=[\s\S]+/,inside:{value:{pattern:/(^=\s*(["']|(?!["'])))\S[\s\S]*(?=\2$)/,lookbehind:!0,alias:[e,"language-"+e],inside:c.languages[e]},punctuation:[{pattern:/^=/,alias:"attr-equals"},/"|'/]}}}})}});c.languages.html=c.languages.markup;c.languages.mathml=c.languages.markup;c.languages.svg=c.languages.markup;c.languages.xml=c.languages.extend("markup",{});c.languages.ssml=c.languages.xml;c.languages.atom=c.languages.xml;c.languages.rss=c.languages.xml;(function(t){var e=/(?:"(?:\\(?:\r\n|[\s\S])|[^"\\\r\n])*"|'(?:\\(?:\r\n|[\s\S])|[^'\\\r\n])*')/;t.languages.css={comment:/\/\*[\s\S]*?\*\//,atrule:{pattern:RegExp("@[\\w-](?:"+/[^;{\s"']|\s+(?!\s)/.source+"|"+e.source+")*?"+/(?:;|(?=\s*\{))/.source),inside:{rule:/^@[\w-]+/,"selector-function-argument":{pattern:/(\bselector\s*\(\s*(?![\s)]))(?:[^()\s]|\s+(?![\s)])|\((?:[^()]|\([^()]*\))*\))+(?=\s*\))/,lookbehind:!0,alias:"selector"},keyword:{pattern:/(^|[^\w-])(?:and|not|only|or)(?![\w-])/,lookbehind:!0}}},url:{pattern:RegExp("\\burl\\((?:"+e.source+"|"+/(?:[^\\\r\n()"']|\\[\s\S])*/.source+")\\)","i"),greedy:!0,inside:{function:/^url/i,punctuation:/^\(|\)$/,string:{pattern:RegExp("^"+e.source+"$"),alias:"url"}}},selector:{pattern:RegExp(`(^|[{}\\s])[^{}\\s](?:[^{};"'\\s]|\\s+(?![\\s{])|`+e.source+")*(?=\\s*\\{)"),lookbehind:!0},string:{pattern:e,greedy:!0},property:{pattern:/(^|[^-\w\xA0-\uFFFF])(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*(?=\s*:)/i,lookbehind:!0},important:/!important\b/i,function:{pattern:/(^|[^-a-z0-9])[-a-z0-9]+(?=\()/i,lookbehind:!0},punctuation:/[(){};:,]/},t.languages.css.atrule.inside.rest=t.languages.css;var r=t.languages.markup;r&&(r.tag.addInlined("style","css"),r.tag.addAttribute("style","css"))})(c);c.languages.clike={comment:[{pattern:/(^|[^\\])\/\*[\s\S]*?(?:\*\/|$)/,lookbehind:!0,greedy:!0},{pattern:/(^|[^\\:])\/\/.*/,lookbehind:!0,greedy:!0}],string:{pattern:/(["'])(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/,greedy:!0},"class-name":{pattern:/(\b(?:class|extends|implements|instanceof|interface|new|trait)\s+|\bcatch\s+\()[\w.\\]+/i,lookbehind:!0,inside:{punctuation:/[.\\]/}},keyword:/\b(?:break|catch|continue|do|else|finally|for|function|if|in|instanceof|new|null|return|throw|try|while)\b/,boolean:/\b(?:false|true)\b/,function:/\b\w+(?=\()/,number:/\b0x[\da-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:e[+-]?\d+)?/i,operator:/[<>]=?|[!=]=?=?|--?|\+\+?|&&?|\|\|?|[?*/~^%]/,punctuation:/[{}[\];(),.:]/};c.languages.javascript=c.languages.extend("clike",{"class-name":[c.languages.clike["class-name"],{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$A-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\.(?:constructor|prototype))/,lookbehind:!0}],keyword:[{pattern:/((?:^|\})\s*)catch\b/,lookbehind:!0},{pattern:/(^|[^.]|\.\.\.\s*)\b(?:as|assert(?=\s*\{)|async(?=\s*(?:function\b|\(|[$\w\xA0-\uFFFF]|$))|await|break|case|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally(?=\s*(?:\{|$))|for|from(?=\s*(?:['"]|$))|function|(?:get|set)(?=\s*(?:[#\[$\w\xA0-\uFFFF]|$))|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)\b/,lookbehind:!0}],function:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*(?:\.\s*(?:apply|bind|call)\s*)?\()/,number:{pattern:RegExp(/(^|[^\w$])/.source+"(?:"+(/NaN|Infinity/.source+"|"+/0[bB][01]+(?:_[01]+)*n?/.source+"|"+/0[oO][0-7]+(?:_[0-7]+)*n?/.source+"|"+/0[xX][\dA-Fa-f]+(?:_[\dA-Fa-f]+)*n?/.source+"|"+/\d+(?:_\d+)*n/.source+"|"+/(?:\d+(?:_\d+)*(?:\.(?:\d+(?:_\d+)*)?)?|\.\d+(?:_\d+)*)(?:[Ee][+-]?\d+(?:_\d+)*)?/.source)+")"+/(?![\w$])/.source),lookbehind:!0},operator:/--|\+\+|\*\*=?|=>|&&=?|\|\|=?|[!=]==|<<=?|>>>?=?|[-+*/%&|^!=<>]=?|\.{3}|\?\?=?|\?\.?|[~:]/});c.languages.javascript["class-name"][0].pattern=/(\b(?:class|extends|implements|instanceof|interface|new)\s+)[\w.\\]+/;c.languages.insertBefore("javascript","keyword",{regex:{pattern:RegExp(/((?:^|[^$\w\xA0-\uFFFF."'\])\s]|\b(?:return|yield))\s*)/.source+/\//.source+"(?:"+/(?:\[(?:[^\]\\\r\n]|\\.)*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}/.source+"|"+/(?:\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.)*\])*\])*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}v[dgimyus]{0,7}/.source+")"+/(?=(?:\s|\/\*(?:[^*]|\*(?!\/))*\*\/)*(?:$|[\r\n,.;:})\]]|\/\/))/.source),lookbehind:!0,greedy:!0,inside:{"regex-source":{pattern:/^(\/)[\s\S]+(?=\/[a-z]*$)/,lookbehind:!0,alias:"language-regex",inside:c.languages.regex},"regex-delimiter":/^\/|\/$/,"regex-flags":/^[a-z]+$/}},"function-variable":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*[=:]\s*(?:async\s*)?(?:\bfunction\b|(?:\((?:[^()]|\([^()]*\))*\)|(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)\s*=>))/,alias:"function"},parameter:[{pattern:/(function(?:\s+(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)?\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\))/,lookbehind:!0,inside:c.languages.javascript},{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$a-z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*=>)/i,lookbehind:!0,inside:c.languages.javascript},{pattern:/(\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*=>)/,lookbehind:!0,inside:c.languages.javascript},{pattern:/((?:\b|\s|^)(?!(?:as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)(?![$\w\xA0-\uFFFF]))(?:(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*)\(\s*|\]\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*\{)/,lookbehind:!0,inside:c.languages.javascript}],constant:/\b[A-Z](?:[A-Z_]|\dx?)*\b/});c.languages.insertBefore("javascript","string",{hashbang:{pattern:/^#!.*/,greedy:!0,alias:"comment"},"template-string":{pattern:/`(?:\\[\s\S]|\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}|(?!\$\{)[^\\`])*`/,greedy:!0,inside:{"template-punctuation":{pattern:/^`|`$/,alias:"string"},interpolation:{pattern:/((?:^|[^\\])(?:\\{2})*)\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}/,lookbehind:!0,inside:{"interpolation-punctuation":{pattern:/^\$\{|\}$/,alias:"punctuation"},rest:c.languages.javascript}},string:/[\s\S]+/}},"string-property":{pattern:/((?:^|[,{])[ \t]*)(["'])(?:\\(?:\r\n|[\s\S])|(?!\2)[^\\\r\n])*\2(?=\s*:)/m,lookbehind:!0,greedy:!0,alias:"property"}});c.languages.insertBefore("javascript","operator",{"literal-property":{pattern:/((?:^|[,{])[ \t]*)(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*:)/m,lookbehind:!0,alias:"property"}});c.languages.markup&&(c.languages.markup.tag.addInlined("script","javascript"),c.languages.markup.tag.addAttribute(/on(?:abort|blur|change|click|composition(?:end|start|update)|dblclick|error|focus(?:in|out)?|key(?:down|up)|load|mouse(?:down|enter|leave|move|out|over|up)|reset|resize|scroll|select|slotchange|submit|unload|wheel)/.source,"javascript"));c.languages.js=c.languages.javascript;(function(){if(typeof c>"u"||typeof document>"u")return;Element.prototype.matches||(Element.prototype.matches=Element.prototype.msMatchesSelector||Element.prototype.webkitMatchesSelector);var t="Loading\u2026",e=function(k,g){return"\u2716 Error "+k+" while fetching file: "+g},r="\u2716 Error: File does not exist or is empty",i={js:"javascript",py:"python",rb:"ruby",ps1:"powershell",psm1:"powershell",sh:"bash",bat:"batch",h:"c",tex:"latex"},s="data-src-status",d="loading",_="loaded",b="failed",v="pre[data-src]:not(["+s+'="'+_+'"]):not(['+s+'="'+d+'"])';function x(k,g,w){var n=new XMLHttpRequest;n.open("GET",k,!0),n.onreadystatechange=function(){n.readyState==4&&(n.status<400&&n.responseText?g(n.responseText):n.status>=400?w(e(n.status,n.statusText)):w(r))},n.send(null)}function h(k){var g=/^\s*(\d+)\s*(?:(,)\s*(?:(\d+)\s*)?)?$/.exec(k||"");if(g){var w=Number(g[1]),n=g[2],a=g[3];return n?a?[w,Number(a)]:[w,void 0]:[w,w]}}c.hooks.add("before-highlightall",function(k){k.selector+=", "+v}),c.hooks.add("before-sanity-check",function(k){var g=k.element;if(g.matches(v)){k.code="",g.setAttribute(s,d);var w=g.appendChild(document.createElement("CODE"));w.textContent=t;var n=g.getAttribute("data-src"),a=k.language;if(a==="none"){var l=(/\.(\w+)$/.exec(n)||[,"none"])[1];a=i[l]||l}c.util.setLanguage(w,a),c.util.setLanguage(g,a);var o=c.plugins.autoloader;o&&o.loadLanguages(a),x(n,function(u){g.setAttribute(s,_);var p=h(g.getAttribute("data-range"));if(p){var y=u.split(/\r\n?|\n/g),f=p[0],F=p[1]==null?y.length:p[1];f<0&&(f+=y.length),f=Math.max(0,Math.min(f-1,y.length)),F<0&&(F+=y.length),F=Math.max(0,Math.min(F,y.length)),u=y.slice(f,F).join(`
+`),g.hasAttribute("data-start")||g.setAttribute("data-start",String(f+1))}w.textContent=u,c.highlightElement(w)},function(u){g.setAttribute(s,b),w.textContent=u})}}),c.plugins.fileHighlight={highlight:function(g){for(var w=(g||document).querySelectorAll(v),n=0,a;a=w[n++];)c.highlightElement(a)}};var E=!1;c.fileHighlight=function(){E||(console.warn("Prism.fileHighlight is deprecated. Use `Prism.plugins.fileHighlight.highlight` instead."),E=!0),c.plugins.fileHighlight.highlight.apply(this,arguments)}})()});var Hr={};Kt(Hr,{BUILD_ID:()=>qr,TempleComponent:()=>P.TempleComponent,TempleElement:()=>P.TempleElement,TempleEmitter:()=>P.TempleEmitter,TempleException:()=>P.TempleException,TempleRegistry:()=>P.TempleRegistry,children:()=>P.children,components:()=>Rr,data:()=>P.data,emitter:()=>P.emitter,props:()=>P.props,signal:()=>P.signal});var N=T(D());var qt=T(D()),R=T($()),ne=class extends qt.TempleComponent{static component=["layout","Layout_9f3ab204ce271feaf6f7"];styles(){return""}template(){(0,R.classlist)().add("relative","w-full","vh","scroll-hidden");let e=(0,R.children)(),r=e.find(h=>h.nodeName.endsWith("PANEL-MAIN")),i=e.find(h=>h.nodeName.endsWith("PANEL-HEAD")),s=e.find(h=>h.nodeName.endsWith("PANEL-FOOT")),d=e.find(h=>h.nodeName.endsWith("PANEL-LEFT")),_=e.find(h=>h.nodeName.endsWith("PANEL-RIGHT")),b={head:!!i,foot:!!s,left:!!d,right:!!_},v=new Set,x={left:!1,right:!1,change:h=>v.add(h)};return r&&R.TempleRegistry.get(r).setAttribute("show",x).setAttribute("layout",b),i&&R.TempleRegistry.get(i).setAttribute("show",x).setAttribute("layout",b),s&&R.TempleRegistry.get(s).setAttribute("show",x).setAttribute("layout",b),d&&R.TempleRegistry.get(d).setAttribute("show",x).setAttribute("layout",b),_&&R.TempleRegistry.get(_).setAttribute("show",x).setAttribute("layout",b),this.toggle=h=>{x[h]=!x[h],v.forEach(E=>E())},()=>[R.TempleRegistry.createText(`
+`,!1),...this._toNodeList(e)]}};var Fe=T(D()),Ge=T($()),ae=class extends Fe.TempleComponent{static component=["head","Head_2bf4dff19bc88ba4138b"];styles(){return""}template(){let{layout:e,show:r}=this.element.attributes,i=(0,Ge.classlist)(),s=d=>{this.classList.add("absolute","top-0","right-0","h-60","transition-500"),e?.left?(this.classList.remove("left-0"),this.classList.add("left-226")):this.classList.add("left-0"),r.left?(this.classList.remove("md-left-0"),this.classList.add("md-left-226")):(this.classList.remove("md-left-226"),this.classList.add("md-left-0"))};return r.change(s),s(),()=>[Fe.TempleRegistry.createText(`
+`,!1),Fe.TempleRegistry.createElement("header",{class:"block w-full h-full relative"},[...this._toNodeList((0,Ge.children)())]).element]}};var Le=T(D()),We=T($()),ie=class extends Le.TempleComponent{static component=["left","Left_f4ab589e043eee17d229"];styles(){return""}template(){let{layout:e,show:r}=this.element.attributes,i=(0,We.classlist)(),s=d=>{this.classList.add("w-226","absolute","bottom-0","left-0","top-0","transition-500"),r.left?(this.classList.remove("md-left--226"),this.classList.add("md-left-0")):this.classList.add("md-left--226")};return r.change(s),s(),()=>[Le.TempleRegistry.createText(`
+`,!1),Le.TempleRegistry.createElement("aside",{class:"block w-full h-full relative"},[...this._toNodeList((0,We.children)())]).element]}};var Pe=T(D()),Ue=T($()),le=class extends Pe.TempleComponent{static component=["main","Main_847772763f4518728ede"];styles(){return""}template(){let{layout:e,show:r}=this.element.attributes,i=(0,Ue.classlist)(),s=d=>{this.classList.add("absolute","transition-500"),e?.head?(this.classList.remove("top-0"),this.classList.add("top-60")):this.classList.add("top-0"),e?.foot?(this.classList.remove("bottom-0"),this.classList.add("bottom-60")):this.classList.add("bottom-0"),e?.left?(this.classList.remove("left-0"),this.classList.add("left-226")):this.classList.add("left-0"),e?.right?(this.classList.remove("right-0"),this.classList.add("right-200")):this.classList.add("right-0"),r.left?(this.classList.remove("md-left-0"),this.classList.add("md-left-226")):(this.classList.remove("md-left-226"),this.classList.add("md-left-0")),r.right?(this.classList.remove("md-right-0"),this.classList.add("md-right-200")):(this.classList.remove("md-right-200"),this.classList.add("md-right-0"))};return r.change(s),s(),()=>[Pe.TempleRegistry.createText(`
+`,!1),Pe.TempleRegistry.createElement("main",{class:"block w-full h-full relative"},[...this._toNodeList((0,Ue.children)())]).element]}};var X=T(D()),ue=T($()),oe=class extends X.TempleComponent{static component=["tab","Tab_5a341768ef0a010965e3"];styles(){return""}template(){let{group:e,selector:r="",active:i="",inactive:s="",style:d,class:_,...b}=(0,ue.props)(),v=(0,ue.component)(),x=i.split(" "),h=s.split(" ");v.classList.add("cursor-pointer");let E=()=>{let g=v.hasAttribute("on");v.classList.remove(...g?h:x),v.classList.add(...g?x:h),Array.from(document.querySelectorAll(r)).forEach(w=>{w.style.display=g?"block":"none"})},k=()=>{Array.from(document.querySelectorAll(`[group="${e}"]`)).forEach(g=>{let w=g.getAttribute("selector");r===w&&!g.hasAttribute("on")?(g.setAttribute("on",""),Array.from(document.querySelectorAll(r)).forEach(n=>{n.style.display="block"}),typeof g.render=="function"&&g.render()):r!==w&&g.hasAttribute("on")&&(g.removeAttribute("on"),Array.from(document.querySelectorAll(w)).forEach(n=>{n.style.display="none"}),typeof g.render=="function"&&g.render())})};return()=>[X.TempleRegistry.createText(`
+`,!1),X.TempleRegistry.createElement("a",{...b,class:"block h-full w-full",click:k,mount:E},[X.TempleRegistry.createText(`
+  `,!1),...this._toNodeList((0,ue.children)()),X.TempleRegistry.createText(`
+`,!1)]).element]}};var Se=T(D()),Ze=T($()),ce=class extends Se.TempleComponent{static component=["docs","Docs_40562a7bb56d70d971df"];styles(){return""}template(){return(0,Ze.classlist)().add("block","w-full","h-full","scroll-y-auto","scroll-x-hidden"),()=>[Se.TempleRegistry.createText(`
+`,!1),Se.TempleRegistry.createElement("article",{class:"block p-10 tx-t-1"},[...this._toNodeList((0,Ze.children)())]).element]}};var Y=T(D()),Je=T($()),de=class extends Y.TempleComponent{static component=["head","Head_939ecb5f22962d8c2924"];styles(){return""}template(){return(0,Je.classlist)().add("absolute","top-0","right-0","left-170","h-45","bg-t-0","z-1"),()=>[Y.TempleRegistry.createText(`
+`,!1),Y.TempleRegistry.createElement("header",{class:"w-full h-full scroll-x-auto"},[Y.TempleRegistry.createText(`
+  `,!1),...this._toNodeList((0,Je.children)()),Y.TempleRegistry.createText(`
+`,!1)]).element]}};var V=T(D()),Xe=T($()),fe=class extends V.TempleComponent{static component=["left","Left_a7102198c3628da88b4f"];styles(){return""}template(){return(0,Xe.classlist)().add("absolute","top-0","bottom-0","left-0","w-170","bg-h-000000","bd-solid","bd-t-2","bdy-0","bdl-0","bdr-1","z-2"),()=>[V.TempleRegistry.createText(`
+`,!1),V.TempleRegistry.createElement("aside",{class:"w-full h-full scroll-auto"},[V.TempleRegistry.createText(`
+  `,!1),...this._toNodeList((0,Xe.children)()),V.TempleRegistry.createText(`
+`,!1)]).element]}};var K=T(D()),Ye=T($()),pe=class extends K.TempleComponent{static component=["main","Main_bbd0517424ebab9de270"];styles(){return""}template(){return(0,Ye.classlist)().add("absolute","top-45","right-0","left-170","bottom-0","bg-black","bd-solid","bd-t-2","bdx-0","bdb-0","bdt-1"),()=>[K.TempleRegistry.createText(`
+`,!1),K.TempleRegistry.createElement("main",{class:"w-full h-full scroll-auto"},[K.TempleRegistry.createText(`
+  `,!1),...this._toNodeList((0,Ye.children)()),K.TempleRegistry.createText(`
+`,!1)]).element]}};var L=T(D()),Ve=T($()),me=class extends L.TempleComponent{static component=["app","App_381239c61b65b86a1c20"];styles(){return""}template(){let{title:e,height:r}=(0,Ve.props)(),i=r?`height:${r}px`:"";return()=>[L.TempleRegistry.createText(`
+`,!1),L.TempleRegistry.createElement("div",{class:"bd-rad-curved scroll-hidden shadow-0-0-10-0-0-0-5"},[L.TempleRegistry.createText(`
+  `,!1),L.TempleRegistry.createElement("div",{class:"relative flex flex-center-y gap-10 p-10 bg-t-1 tx-c-999999 tx-16"},[L.TempleRegistry.createText(`
+    `,!1),L.TempleRegistry.createElement("span",{class:"bg-h-999999 pill h-10 w-10"},[]).element,L.TempleRegistry.createText(`
+    `,!1),L.TempleRegistry.createElement("span",{class:"bg-h-999999 pill h-10 w-10"},[]).element,L.TempleRegistry.createText(`
+    `,!1),L.TempleRegistry.createElement("span",{class:"bg-h-999999 pill h-10 w-10"},[]).element,L.TempleRegistry.createText(`
+    `,!1),L.TempleRegistry.createElement("span",{class:"flex flex-center h-full w-full absolute top-0 left-0"},[L.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(e),L.TempleRegistry.createText(`
+    `,!1)]).element,L.TempleRegistry.createText(`
+  `,!1)]).element,L.TempleRegistry.createText(`
+  `,!1),L.TempleRegistry.createElement("div",{class:"bg-black tx-t-1 relative",style:i},[...this._toNodeList((0,Ve.children)())]).element,L.TempleRegistry.createText(`
+`,!1)]).element]}};var A=T(D()),pt=T(Ht()),It=T($()),he=class extends A.TempleComponent{static component=["code","Code_5294df1c620ef5ddbd2f"];styles(){return`:host {
     display: block;
     font-size: 14px;
     line-height: 20px;
   }
   :host([inline]) {
-    display: inline;
+    display: inline !important;
   }
   :host([inline]),
   :host([inline]) > pre,
   :host([inline]) > pre > code {
-    display: inline;
+    display: inline !important;
   }
   .snippet {
     background-color: #000000;
     color: #ABB2BF;
+    height: 100%;
     margin: 0;
     padding: 0;
   }
@@ -73,42 +102,38 @@ var TempleAPI=(()=>{var xt=Object.create;var ge=Object.defineProperty;var Tt=Obj
 
   .terminal {
     background-color: #000000;
+    font-family: 'Courier New', Courier, monospace;
     font-size: 15px;
+    height: 100%;
     padding: 10px;
   }
   .terminal span {
     color: #00FF00;
-  }`}template(){let e=this.props,{lang:r="markup",numbers:i=!1,inline:n=!1,trim:p=!1,ltrim:m=!1,rtrim:g=!1,detab:_=0}=e,y=(0,_t.children)(),A=y[0]?.textContent||"";_&&(A=A.replace(new RegExp(`\\n {${_}}`,"g"),`
-`)),p?A=A.trim():m?A=A.replace(/^\s+/,""):g&&(A=A.replace(/\s+$/,""));let F=T=>{if(!A)return;let v=He.default.highlight(A,He.default.languages[r],r);if(T.detail.target.innerHTML=v,i){let E=v.match(/\n(?!$)/g),s=E?E.length+1:1,a=new Array(s+1).join(""),l=document.createElement("span");l.setAttribute("aria-hidden","true"),l.className="line-numbers-rows",l.innerHTML=a,T.detail.target.appendChild(l)}};return()=>[w.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism.min.css"}).element,w.TempleRegistry.createText(`
-`,!1),w.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism-tomorrow.min.css"}).element,w.TempleRegistry.createText(`
-`,!1),...r==="bash"?[w.TempleRegistry.createText(`
-  `,!1),w.TempleRegistry.createElement("div",{class:"terminal"},[w.TempleRegistry.createElement("span",{},[w.TempleRegistry.createText("$",!1)]).element,w.TempleRegistry.createText(" ",!1),...this._toNodeList(y)]).element,w.TempleRegistry.createText(`
-`,!1)]:A?[,w.TempleRegistry.createText(`
-  `,!1),...i?[w.TempleRegistry.createText(`
-    `,!1),w.TempleRegistry.createElement("pre",{class:"snippet line-numbers"},[w.TempleRegistry.createElement("code",{mount:F},[]).element]).element,w.TempleRegistry.createText(`
-  `,!1)]:[,w.TempleRegistry.createText(`
-    `,!1),w.TempleRegistry.createElement("pre",{class:"snippet pad"},[w.TempleRegistry.createElement("code",{mount:F},[]).element]).element,w.TempleRegistry.createText(`
-  `,!1)],w.TempleRegistry.createText(`
-`,!1)]:[]]}};var S=D(I()),Te=D(oe()),J=class extends S.TempleComponent{static component=["app","App_05341fddbfd1fe4f273b"];styles(){return""}template(){let{title:e,panel:r}=(0,Te.props)(),i=`body ${r?"panel":""}`,n=r?`height:${r}px`:"";return()=>[S.TempleRegistry.createText(`
-`,!1),S.TempleRegistry.createElement("div",{class:"window"},[S.TempleRegistry.createText(`
-  `,!1),S.TempleRegistry.createElement("div",{class:"head"},[S.TempleRegistry.createText(`
-    `,!1),S.TempleRegistry.createElement("span",{class:"dot"},[]).element,S.TempleRegistry.createText(`
-    `,!1),S.TempleRegistry.createElement("span",{class:"dot"},[]).element,S.TempleRegistry.createText(`
-    `,!1),S.TempleRegistry.createElement("span",{class:"dot"},[]).element,S.TempleRegistry.createText(`
-    `,!1),S.TempleRegistry.createElement("span",{class:"title"},[...this._toNodeList(e)]).element,S.TempleRegistry.createText(`
-  `,!1)]).element,S.TempleRegistry.createText(`
-  `,!1),S.TempleRegistry.createElement("div",{class:i,style:n},[...this._toNodeList((0,Te.children)())]).element,S.TempleRegistry.createText(`
-`,!1)]).element]}};var ue=D(I()),Ee=D(oe()),X=class extends ue.TempleComponent{static component=["tab","Tab_dd9d261e4f37efc3079c"];styles(){return""}template(){let{group:e,selector:r,class:i,...n}=(0,Ee.props)(),p=()=>{Array.from(document.querySelectorAll(r)).forEach(g=>{g.style.display=i.indexOf("active")>-1?"block":"none"})},m=()=>{Array.from(document.querySelectorAll(`[group="${e}"]`)).forEach(g=>{let _=g.props.selector;r===_?(g.classList.add("active"),Array.from(document.querySelectorAll(r)).forEach(y=>{y.style.display="block"})):(g.classList.remove("active"),Array.from(document.querySelectorAll(_)).forEach(y=>{y.style.display="none"}))})};return()=>[ue.TempleRegistry.createText(`
-`,!1),ue.TempleRegistry.createElement("a",{...n,click:m,mount:p},[...this._toNodeList((0,Ee.children)())]).element]}};var M=D(I());var Ne=function(t,...e){let r=Be(t);for(let i=0;i[M.TempleRegistry.createText(`
-    `,!1),...r?[M.TempleRegistry.createText(`
-      `,!1),M.TempleRegistry.createElement("p",{},[...this._toNodeList(A)]).element,M.TempleRegistry.createText(`
-    `,!1)]:i?[,M.TempleRegistry.createText(`
-      `,!1),M.TempleRegistry.createElement("li",{},[...this._toNodeList(A)]).element,M.TempleRegistry.createText(`
-    `,!1)]:n?[,M.TempleRegistry.createText(`
-      `,!1),M.TempleRegistry.createElement("div",{},[...this._toNodeList(A)]).element,M.TempleRegistry.createText(`
-    `,!1)]:[,M.TempleRegistry.createText(`
-      `,!1),...this._toNodeList(A),M.TempleRegistry.createText(`
-    `,!1)]]}};var k=D(I());C.emitter.once("ready",()=>{let t=document.querySelector("script[data-app]");if(!t)throw C.TempleException.for("APP_DATA not found");try{let m=atob(t.getAttribute("data-app"));window.__APP_DATA__=JSON.parse(m),Object.entries(window.__APP_DATA__).forEach(([g,_])=>{C.data.set(g,_)})}catch{throw C.TempleException.for("APP_DATA is not a valid JSON")}C.data.set("current","document");let e="/docs/static-site.html",r=Ne("Static Site Generator - Temple reactive web component template engine."),i=Ne("How to use Temple to generate static sites."),n=m=>{document.body.classList.toggle("panel-left-open")};C.data.delete("current");let p={0:{class:"head panel-head"},1:{class:"menu fas fa-fw fa-bars",click:n},2:{href:"/temple"},3:{src:"/temple/temple-icon.png",alt:"Temple Logo"},5:{class:"tx-white",href:"/temple"},7:{class:"tx-white",href:"/temple/docs/index.html"},8:{class:"github",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},9:{class:"fab fa-github"},10:{class:"npm",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},11:{class:"fab fa-npm text-white"},12:{class:"discord",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},13:{class:"fab fa-discord text-white"},14:{class:"left panel-left"},16:{href:"/temple"},17:{src:"/temple/temple-icon.png",alt:"Temple Logo"},19:{class:"tx-white",href:"/temple"},20:{class:"toggle fas fa-fw fa-chevron-left",click:n},23:{href:"/temple/docs/index.html"},24:{href:"/temple/docs/getting-started.html"},26:{href:"/temple/docs/markup-syntax.html"},27:{href:"/temple/docs/state-management.html"},28:{href:"/temple/docs/component-strategy.html"},29:{href:"/temple/docs/compiler-api.html"},30:{href:"/temple/docs/client-api.html"},32:{href:"/temple/docs/template-engine.html"},33:{href:"/temple/docs/single-page.html"},34:{href:"/temple/docs/static-site.html"},35:{href:"/temple/docs/component-publisher.html"},36:{href:"/temple/docs/developer-tools.html"},37:{class:"panel-main"},38:{class:"docs container"},40:{p:!0,trim:!0},41:{p:!0,trim:!0},42:{panel:410,title:"My Project"},43:{class:"panel-head"},44:{class:"tabs"},45:{class:"tab active",group:"project",selector:"#index-ts"},46:{class:"tab",group:"project",selector:"#index-dtml"},47:{class:"tab",group:"project",selector:"#package-json"},48:{class:"panel-left"},49:{class:"folder"},50:{class:"fas fa-fw fa-chevron-down"},52:{class:"shift-1 block active",group:"project",selector:"#index-ts"},53:{class:"fas fa-fw fa-file"},54:{class:"folder shift-1"},55:{class:"fas fa-fw fa-chevron-down",style:"margin-left:4px"},57:{class:"shift-2 block",group:"project",selector:"#index-dtml"},58:{class:"fas fa-fw fa-file"},59:{class:"block",group:"project",selector:"#package-json"},60:{class:"fas fa-fw fa-file"},61:{class:"panel-main"},63:{id:"index-ts",lang:"js",numbers:!0,trim:!0,detab:16},64:{id:"index-dtml",style:"display:none",numbers:!0,trim:!0,detab:16},65:{id:"package-json",style:"display:none",lang:"js",numbers:!0,trim:!0,detab:16},66:{p:!0,trim:!0},67:{lang:"bash"},68:{p:!0,trim:!0},69:{lang:"js",inline:!0},70:{class:"pager"},71:{class:"prev",href:"/temple/docs/single-page.html"},72:{class:"fas fa-fw fa-chevron-left"},73:{class:"next",href:"/temple/docs/component-publisher.html"},74:{class:"fas fa-fw fa-chevron-right"},75:{class:"foot"}};for(let m of document.body.querySelectorAll("*")){let g=Object.fromEntries(Array.from(m.attributes).map(y=>[y.nodeName,y.nodeValue.length>0?y.nodeValue:!0])),_=String(C.TempleRegistry.elements.size);p[_]&&(Object.assign(g,p[_]),m.TempleAttributes=p[_]),C.TempleRegistry.register(m,g)}customElements.define("panel-main",Z),customElements.define("ide-code",W),customElements.define("ide-app",J),customElements.define("tui-tab",X),customElements.define("i18n-translate",Y),C.emitter.emit("mounted",document.body)});var ar={PanelMain_fd7f1af6410c5b5c8e1f:Z,IdeCode_6f36bc13bb6a166c7abc:W,IdeApp_05341fddbfd1fe4f273b:J,TuiTab_dd9d261e4f37efc3079c:X,I18nTranslate_7d25e372f5ffb5e39dad:Y},sr="1bf701a55aaad047771e";return Pt(ir);})();
+  }`}template(){let e=this.props,{lang:r="markup",numbers:i=!1,inline:s=!1,trim:d=!1,ltrim:_=!1,rtrim:b=!1,detab:v=0}=e,x=(0,It.children)(),h=x[0]?.textContent||"";v&&(h=h.replace(new RegExp(`\\n {${v}}`,"g"),`
+`)),d?h=h.trim():_?h=h.replace(/^\s+/,""):b&&(h=h.replace(/\s+$/,""));let E=k=>{if(!h)return;let g=pt.default.highlight(h,pt.default.languages[r],r);if(k.detail.target.innerHTML=g,i){let w=g.match(/\n(?!$)/g),n=w?w.length+1:1,a=new Array(n+1).join(""),l=document.createElement("span");l.setAttribute("aria-hidden","true"),l.className="line-numbers-rows",l.innerHTML=a,k.detail.target.appendChild(l)}};return()=>[A.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism.min.css"}).element,A.TempleRegistry.createText(`
+`,!1),A.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism-tomorrow.min.css"}).element,A.TempleRegistry.createText(`
+`,!1),...r==="bash"?[A.TempleRegistry.createText(`
+  `,!1),A.TempleRegistry.createElement("div",{class:"terminal"},[A.TempleRegistry.createElement("span",{},[A.TempleRegistry.createText("$",!1)]).element,A.TempleRegistry.createText(" ",!1),...this._toNodeList(x)]).element,A.TempleRegistry.createText(`
+`,!1)]:h?[,A.TempleRegistry.createText(`
+  `,!1),...i?[A.TempleRegistry.createText(`
+    `,!1),A.TempleRegistry.createElement("pre",{class:"snippet line-numbers"},[A.TempleRegistry.createElement("code",{mount:E},[]).element]).element,A.TempleRegistry.createText(`
+  `,!1)]:[,A.TempleRegistry.createText(`
+    `,!1),A.TempleRegistry.createElement("pre",{class:"snippet pad"},[A.TempleRegistry.createElement("code",{mount:E},[]).element]).element,A.TempleRegistry.createText(`
+  `,!1)],A.TempleRegistry.createText(`
+`,!1)]:[,A.TempleRegistry.createText(`
+  `,!1),A.TempleRegistry.createElement("span",{},[A.TempleRegistry.createText("????",!1)]).element,A.TempleRegistry.createText(`
+`,!1)],A.TempleRegistry.createText(`
+
+`,!1)]}};var O=T(D());var zt=function(t){return t};var Qe=T($()),ge=class extends O.TempleComponent{static component=["translate","Translate_0014b007fc91289b2776"];styles(){return""}template(){let{trim:e=!1,p:r=!1,li:i=!1,div:s=!1}=(0,Qe.props)(),d=(0,Qe.children)(),_=[],b=[];for(let E of d)typeof E=="string"?_.push(E):E instanceof Node&&E.textContent?_.push(E.textContent):(_.push("%s"),b.push(E));let v=_.join("");e&&(v=v.replace(/\s+/," ").trim());let x=zt(v).split("%s"),h=[];for(let E=0;E[O.TempleRegistry.createText(`
+    `,!1),...r?[O.TempleRegistry.createText(`
+      `,!1),O.TempleRegistry.createElement("p",{},[...this._toNodeList(h)]).element,O.TempleRegistry.createText(`
+    `,!1)]:i?[,O.TempleRegistry.createText(`
+      `,!1),O.TempleRegistry.createElement("li",{},[...this._toNodeList(h)]).element,O.TempleRegistry.createText(`
+    `,!1)]:s?[,O.TempleRegistry.createText(`
+      `,!1),O.TempleRegistry.createElement("div",{},[...this._toNodeList(h)]).element,O.TempleRegistry.createText(`
+    `,!1)]:[,O.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(h),O.TempleRegistry.createText(`
+    `,!1)]]}};var mt=function(t,...e){let r=Nr(t);for(let i=0;i{let t=document.querySelector("script[data-app]");if(!t)throw N.TempleException.for("APP_DATA not found");try{let _=atob(t.getAttribute("data-app"));window.__APP_DATA__=JSON.parse(_),Object.entries(window.__APP_DATA__).forEach(([b,v])=>{N.data.set(b,v)})}catch{throw N.TempleException.for("APP_DATA is not a valid JSON")}N.data.set("current","document");let e="/docs/static-site.html",r=mt("Static Site Generator - Temple reactive web component template engine."),i=mt("How to use Temple to generate static sites."),s=()=>{document.getElementsByTagName("panel-layout")[0].toggle("left")};N.data.delete("current");let d={2:{class:"flex flex-center-y px-20 py-15 m-0 bg-t-1"},3:{class:"fas fa-fw fa-bars cursor-pointer py-5 pr-10 none md-inline-block tx-t-1",click:s},4:{class:"flex-grow"},5:{class:"flex flex-center-y"},6:{class:"tx-white",href:"/temple/docs/index.html"},7:{class:"tx-t-1 tx-5xl ml-10",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},8:{class:"fab fa-github"},9:{class:"bg-h-cb3837 pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},10:{class:"fab fa-npm text-white"},11:{class:"bg-h-7289da pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},12:{class:"fab fa-discord text-white"},14:{class:"flex flex-center-y bg-t-2 py-15 pr-5 pl-10"},15:{href:"/temple"},16:{class:"h-26 mr-10",src:"/temple/temple-icon.png",alt:"Temple Logo"},17:{class:"flex-grow m-0 tx-uppercase"},18:{class:"tx-white",href:"/temple"},19:{class:"fas fa-fw fa-chevron-left cursor-pointer none md-inline-block",click:s},20:{class:"bg-t-1 scroll-auto h-calc-full-60"},21:{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-0 pt-20 pb-10 pl-10 tx-uppercase"},22:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/index.html"},23:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/getting-started.html"},24:{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},25:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/markup-syntax.html"},26:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/state-management.html"},27:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-strategy.html"},28:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/compiler-api.html"},29:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/client-api.html"},30:{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},31:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/template-engine.html"},32:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/single-page.html"},33:{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/static-site.html"},34:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-publisher.html"},35:{class:"block tx-t-1 py-10 pl-10 mb-100",href:"/temple/docs/developer-tools.html"},38:{class:"tx-primary tx-uppercase tx-30 py-20"},39:{p:!0,trim:!0,class:"tx-lh-36 py-20"},40:{p:!0,trim:!0,class:"tx-lh-36 py-20"},41:{height:410,title:"My Project"},43:{class:"flex scroll-x-auto pt-5 pl-5"},44:{on:!0,class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"static",selector:"#index-ts"},45:{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"static",selector:"#page-dtml"},46:{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"static",selector:"#package-json"},48:{class:"p-5"},49:{class:"fas fa-fw fa-chevron-down"},51:{on:!0,class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"static",selector:"#index-ts"},52:{class:"fas fa-fw fa-file"},53:{class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"static",selector:"#page-dtml"},54:{class:"fas fa-fw fa-file"},55:{class:"pt-10 block",active:"tx-white",inactive:"tx-muted",group:"static",selector:"#package-json"},56:{class:"fas fa-fw fa-file"},58:{id:"index-ts",lang:"js",numbers:!0,trim:!0,detab:16},59:{id:"index-dtml",style:"display:none",numbers:!0,trim:!0,detab:16},60:{id:"package-json",style:"display:none",lang:"js",numbers:!0,trim:!0,detab:16},61:{p:!0,trim:!0,class:"tx-lh-36 py-20"},62:{lang:"bash"},63:{p:!0,trim:!0,class:"tx-lh-36 py-20"},64:{lang:"js",inline:!0},65:{class:"flex"},66:{class:"tx-primary py-40",href:"/temple/docs/single-page.html"},67:{class:"fas fa-fw fa-chevron-left tx-t-1"},68:{class:"flex-grow tx-right tx-primary py-40",href:"/temple/docs/component-publisher.html"},69:{class:"fas fa-fw fa-chevron-right tx-t-1"},70:{class:"foot"}};for(let _ of document.body.querySelectorAll("*")){let b=Object.fromEntries(Array.from(_.attributes).map(x=>[x.nodeName,x.nodeValue.length>0?x.nodeValue:!0])),v=String(N.TempleRegistry.elements.size);d[v]&&(Object.assign(b,d[v]),_.TempleAttributes=d[v]),N.TempleRegistry.register(_,b)}customElements.define("panel-layout",ne),customElements.define("panel-head",ae),customElements.define("panel-left",ie),customElements.define("panel-main",le),customElements.define("tui-tab",oe),customElements.define("api-docs",ce),customElements.define("app-head",de),customElements.define("app-left",fe),customElements.define("app-main",pe),customElements.define("ide-app",me),customElements.define("ide-code",he),customElements.define("i18n-translate",ge),N.emitter.emit("mounted",document.body)});var Rr={PanelLayout_9f3ab204ce271feaf6f7:ne,PanelHead_2bf4dff19bc88ba4138b:ae,PanelLeft_f4ab589e043eee17d229:ie,PanelMain_847772763f4518728ede:le,TuiTab_5a341768ef0a010965e3:oe,ApiDocs_40562a7bb56d70d971df:ce,AppHead_939ecb5f22962d8c2924:de,AppLeft_a7102198c3628da88b4f:fe,AppMain_bbd0517424ebab9de270:pe,IdeApp_381239c61b65b86a1c20:me,IdeCode_5294df1c620ef5ddbd2f:he,I18nTranslate_0014b007fc91289b2776:ge},qr="1bf701a55aaad047771e";return Qt(Hr);})();
 /*! Bundled license information:
 
 prismjs/prism.js:
diff --git a/docs/build/client/269f8b60f20cebb43be6.css b/docs/build/client/269f8b60f20cebb43be6.css
index caa9040..105df50 100644
--- a/docs/build/client/269f8b60f20cebb43be6.css
+++ b/docs/build/client/269f8b60f20cebb43be6.css
@@ -1,4 +1,246 @@
-.col-2 {
+html, body {
+  height: 100%;
+  margin: 0;
+  padding: 0;
+  width: 100%;
+}
+
+h1, h2, h3, h4, h5, h6, p {
+  margin: 0;
+  padding: 0;
+}
+
+a {
+  text-decoration: none;
+}
+  html-head:not(:defined) { opacity: 0; }
+html-header:not(:defined) { opacity: 0; }
+html-aside:not(:defined) { opacity: 0; }
+panel-layout:not(:defined) { opacity: 0; }
+panel-head:not(:defined) { opacity: 0; }
+panel-left:not(:defined) { opacity: 0; }
+panel-right:not(:defined) { opacity: 0; }
+panel-main:not(:defined) { opacity: 0; }
+tui-alert:not(:defined) { opacity: 0; }
+api-docs:not(:defined) { opacity: 0; }
+api-ui:not(:defined) { opacity: 0; }
+ide-app:not(:defined) { opacity: 0; }
+ide-code:not(:defined) { opacity: 0; }
+i18n-translate:not(:defined) { opacity: 0; }
+  :root {
+  --black: #000000;
+  --white: #FFFFFF;
+  --info: #1474FC;
+  --error: #DC3545;
+  --warning: #FF7B07;
+  --success: #28A745;
+  --muted: #999999;
+}
+
+.light {
+  --bg-0: #EFEFEF;
+  --bg-1: #CFCFCF;
+  --bg-2: #AFAFAF;
+  --bg-3: #8F8F8F;
+  --bg-4: #6F6F6F;
+  --bd-0: #EFEFEF;
+  --bd-1: #CFCFCF;
+  --bd-2: #AFAFAF;
+  --bd-3: #8F8F8F;
+  --bd-4: #6F6F6F;
+  --bg-inverse: #242424;
+  --tx-0: #000000;
+  --tx-1: #242424;
+  --tx-inverse: #CFCFCF;
+}
+
+.dark {
+  --bg-0: #121212;
+  --bg-1: #222222;
+  --bg-2: #323232;
+  --bg-3: #424242;
+  --bg-4: #525252;
+  --bd-0: #121212;
+  --bd-1: #222222;
+  --bd-2: #323232;
+  --bd-3: #424242;
+  --bd-4: #525252;
+  --bg-inverse: #DBDBDB;
+  --tx-0: #FFFFFF;
+  --tx-1: #CFCFCF;
+  --tx-inverse: #222222;
+}
+  html-head { display: block; }
+html-header { display: block; }
+html-aside { display: block; }
+panel-layout { display: block; }
+panel-head { display: block; }
+panel-left { display: block; }
+panel-right { display: block; }
+panel-main { display: block; }
+tui-alert { display: block; }
+api-docs { display: block; }
+api-ui { display: block; }
+api-ide-code { display: block; }
+ide-app { display: block; }
+ide-code { display: block; }
+i18n-translate { display: block; }
+  .arial { font-family: Arial, sans-serif; }
+.none { display: none; }
+.block { display: block; }
+.flex { display: flex; }
+.inline { display: inline; }
+.transparent { opacity: 0; }
+.relative { position: relative; }
+.absolute { position: absolute; }
+.static { position: static; }
+.bottom-0 { bottom: 0px; }
+.bottom-60 { bottom: 60px; }
+.left-0 { left: 0px; }
+.left-226 { left: 226px; }
+.left-0 { left: 0px; }
+.left-226 { left: 226px; }
+.left--226 { left: -226px; }
+.right-0 { right: 0px; }
+.right--200 { right: -200px; }
+.right-0 { right: 0px; }
+.right-200 { right: 200px; }
+.right-200 { right: 200px; }
+.top-0 { top: 0px; }
+.top-60 { top: 60px; }
+.flex-grow { flex-grow: 1; }
+.flex-center { align-items: center; justify-content: center; }
+.flex-center-y { align-items: center; }
+.gap-10 { gap: 10px; }
+.scroll { overflow: scroll; }
+.scroll-auto { overflow: auto; }
+.scroll-hidden { overflow: hidden; }
+.scroll-x-hidden { overflow-x: hidden; }
+.scroll-y-auto { overflow-y: auto; }
+.h-full { height: 100%; }
+.h-26 { height: 26px; }
+.h-7289 { height: 7289px; }
+.h-905496362982981723 { height: 905496362982981723px; }
+.h-60 { height: 60px; }
+.h-24 { height: 24px; }
+.h-999999 { height: 999999px; }
+.h-10 { height: 10px; }
+.h-32 { height: 32px; }
+.h-36 { height: 36px; }
+.h-calc-full-60 { height: calc(100% - 60px); }
+.h-calc-full-40 { height: calc(100% - 40px); }
+.vh { height: 100vh; }
+.w-full { width: 100%; }
+.w-226 { width: 226px; }
+.w-200 { width: 200px; }
+.w-0 { width: 0px; }
+.w-10 { width: 10px; }
+.bg-primary { background-color: var(--primary) !important; }
+.bg-secondary { background-color: var(--secondary) !important; }
+.bg-black { background-color: var(--black) !important; }
+.bg-white { background-color: var(--white) !important; }
+.bg-info { background-color: var(--info) !important; }
+.bg-error { background-color: var(--error) !important; }
+.bg-warning { background-color: var(--warning) !important; }
+.bg-success { background-color: var(--success) !important; }
+.bg-muted { background-color: var(--muted) !important; }
+.bg-t-1 { background-color: var(--bg-1) !important; }
+.bg-t-2 { background-color: var(--bg-2) !important; }
+.bg-t-0 { background-color: var(--bg-0) !important; }
+.bg-h-cb3837 { background-color: #cb3837; }
+.bg-h-7289da { background-color: #7289da; }
+.bg-h-999999 { background-color: #999999; }
+.tx-5 { font-size: 5px; }
+.tx-14 { font-size: 14px; }
+.tx-16 { font-size: 16px; }
+.tx-30 { font-size: 30px; }
+.tx-26 { font-size: 26px; }
+.tx-lg { font-size: 16px; }
+.tx-5xl { font-size: 26px; }
+.tx-center { text-align: center; }
+.tx-left { text-align: left; }
+.tx-right { text-align: right; }
+.tx-bold { font-weight: bold; }
+.tx-underline { text-decoration: underline; }
+.tx-uppercase { text-transform: uppercase; }
+.tx-nowrap { white-space: nowrap; }
+.tx-top { vertical-align: top; }
+.tx-lh-24 { line-height: 24px; }
+.tx-lh-32 { line-height: 32px; }
+.tx-lh-36 { line-height: 36px; }
+.tx-primary { color: var(--primary) !important; }
+.tx-secondary { color: var(--secondary) !important; }
+.tx-white { color: var(--white) !important; }
+.tx-info { color: var(--info) !important; }
+.tx-error { color: var(--error) !important; }
+.tx-warning { color: var(--warning) !important; }
+.tx-success { color: var(--success) !important; }
+.tx-muted { color: var(--muted) !important; }
+.tx-t-1 { color: var(--tx-1) !important; }
+.tx-t-0 { color: var(--tx-0) !important; }
+.bd-solid { border-style: solid; }
+.bd-collapse { border-collapse: collapse; }
+.bd-primary { border-color: var(--primary) !important; }
+.bd-secondary { border-color: var(--secondary) !important; }
+.bd-info { border-color: var(--info) !important; }
+.bd-error { border-color: var(--error) !important; }
+.bd-warning { border-color: var(--warning) !important; }
+.bd-success { border-color: var(--success) !important; }
+.bd-muted { border-color: var(--muted) !important; }
+.bd-t-2 { border-color: var(--bd-2) !important; }
+.bd-t-1 { border-color: var(--bd-1) !important; }
+.bdb-0 { border-bottom-width: 0px; }
+.bdb-1 { border-bottom-width: 1px; }
+.bdt-0 { border-top-width: 0px; }
+.bdt-1 { border-top-width: 1px; }
+.bdx-0 { border-left-width: 0px; border-right-width: 0px; }
+.curved { border-radius: 4px; }
+.rounded { border-radius: 12px; }
+.pill { border-radius: 10000px; }
+.m-0 { margin: 0px; }
+.m-0 { margin: 0px; }
+.m-60 { margin: 60px; }
+.mb-0 { margin-bottom: 0px; }
+.mb-100 { margin-bottom: 100px; }
+.mb-20 { margin-bottom: 20px; }
+.ml-10 { margin-left: 10px; }
+.ml-5 { margin-left: 5px; }
+.mr-10 { margin-right: 10px; }
+.mt-0 { margin-top: 0px; }
+.mt-20 { margin-top: 20px; }
+.my-40 { margin-top: 40px; margin-bottom: 40px; }
+.p-5 { padding: 5px; }
+.p-0 { padding: 0px; }
+.p-60 { padding: 60px; }
+.p-16 { padding: 16px; }
+.p-10 { padding: 10px; }
+.p-10 { padding: 10px; }
+.pb-10 { padding-bottom: 10px; }
+.pl-10 { padding-left: 10px; }
+.pr-10 { padding-right: 10px; }
+.pr-5 { padding-right: 5px; }
+.pt-20 { padding-top: 20px; }
+.pt-40 { padding-top: 40px; }
+.px-20 { padding-left: 20px; padding-right: 20px; }
+.px-10 { padding-left: 10px; padding-right: 10px; }
+.py-15 { padding-top: 15px; padding-bottom: 15px; }
+.py-5 { padding-top: 5px; padding-bottom: 5px; }
+.py-10 { padding-top: 10px; padding-bottom: 10px; }
+.py-20 { padding-top: 20px; padding-bottom: 20px; }
+.py-40 { padding-top: 40px; padding-bottom: 40px; }
+.cursor-pointer { cursor: pointer; }
+.transition-500 { transition: 500ms; }
+.shadow-0-0-10-0-0-0-5 { box-shadow: 0px 0px 10px rgb(0, 0, 0, 0.5); }
+@media (max-width: 767px) {
+  .md-inline-block { display: inline-block; }
+  .md-left-0 { left: 0px; }
+  .md-left-226 { left: 226px; }
+  .md-left--226 { left: -226px; }
+  .md-right--200 { right: -200px; }
+  .md-right-0 { right: 0px; }
+  .md-right-200 { right: 200px; }
+}
+  .col-2 {
     display: grid;
     grid-template-columns: repeat(2, 1fr);
     gap: 1rem;
diff --git a/docs/build/client/269f8b60f20cebb43be6.html b/docs/build/client/269f8b60f20cebb43be6.html
index 522f223..4878caa 100644
--- a/docs/build/client/269f8b60f20cebb43be6.html
+++ b/docs/build/client/269f8b60f20cebb43be6.html
@@ -18,343 +18,444 @@
   
   
   
-  
+  
   
   
   
   
 
-  
-    

-  
-  
-    Temple Logo
-  
-  
Temple

-  
+      
+        
+          

+            On this page
+          

+          
+        
+      
+      
+        
+          

+            State Management
+          

+          
+            Temple provides several ways to manage properties and states 
+            in your components.
+          
 
-        
-        
Props

+          
+          

+            Props
+          

 
-        
-          import { props } from '@ossph/temple';
-          const { title, description } = props();
-        
+          
+            import { props } from '@ossph/temple';
+            const { title, description } = props();
+          
 
-        
-          The props function can be used to access the 
-          properties of a component.
-        
+          
+            The props function can be used to access the 
+            properties of a component.
+          
 
-        
-        
Signals

+          
+          

+            Signals
+          

 
-        

-          Temple provides a reactive state management system that allows 
-          you to manage states in your components. The system is based 
-          on signals, which are reactive variables that can be used to 
-          store and update data. Signals can be used to store any type 
-          of data, including numbers, strings, objects, arrays, and even 
-          functions.
-        

+          
+            Temple provides a reactive state management system that allows 
+            you to manage states in your components. The system is based 
+            on signals, which are reactive variables that can be used to 
+            store and update data. Signals can be used to store any type 
+            of data, including numbers, strings, objects, arrays, and even 
+            functions.
+          
 
-        
-          <script>
-            import { signal } from '@ossph/temple';
-            const count = signal<number>(1);
-          </script>
-          <em class=classlist>Count #{count.value}</em>
-        
+          

+            
+              <script>
+                import { signal } from '@ossph/temple';
+                const count = signal<number>(1);
+              </script>
+              <em class=classlist>Count #{count.value}</em>
+            
+          

 
-        
-          To create a signal, you can use the 
-          signal() 
-          function, which takes an initial value as an argument. Signals 
-          can be read and updated using the value property. 
-          Setting the value will trigger a re-render of the component.
-        
+          
+            To create a signal, you can use the 
+            signal() 
+            function, which takes an initial value as an argument. Signals 
+            can be read and updated using the value property. 
+            Setting the value will trigger a re-render of the component.
+          
 
-        
-          Signals can be used in your components to manage states and 
-          trigger updates when the state changes. You can use signals to 
-          store data that needs to be shared between components, or to 
-          trigger side effects when the state changes. Signals can also 
-          be used to store data that needs to be persisted across page 
-          reloads, such as form data or user preferences.
-        
+          
+            Signals can be used in your components to manage states and 
+            trigger updates when the state changes. You can use signals to 
+            store data that needs to be shared between components, or to 
+            trigger side effects when the state changes. Signals can also 
+            be used to store data that needs to be persisted across page 
+            reloads, such as form data or user preferences.
+          
 
-        
-        
Events

+          
+          

+            Events
+          

 
-        
-          <script>
-            import { signal } from '@ossph/temple';
-            const count = signal<number>(1);
-            const add = e => count.value++;
-          </script>
+          

+            
+              <script>
+                import { signal } from '@ossph/temple';
+                const count = signal<number>(1);
+                const add = e => count.value++;
+              </script>
 
-          <button click=add>{count.value}</button>
+              <button click=add>{count.value}</button>
 
-          <button dblclick=add>{count.value}</button>
-          <button mousedown=add>{count.value}</button>
-          <button mouseup=add>{count.value}</button>
-          <button mousemove=add>{count.value}</button>
-          <button mouseover=add>{count.value}</button>
-          <button mouseout=add>{count.value}</button>
-          <button wheel=add>{count.value}</button>
-          <button keydown=add>{count.value}</button>
-          <button keypress=add>{count.value}</button>
-          <button keyup=add>{count.value}</button>
-        
+              <button dblclick=add>{count.value}</button>
+              <button mousedown=add>{count.value}</button>
+              <button mouseup=add>{count.value}</button>
+              <button mousemove=add>{count.value}</button>
+              <button mouseover=add>{count.value}</button>
+              <button mouseout=add>{count.value}</button>
+              <button wheel=add>{count.value}</button>
+              <button keydown=add>{count.value}</button>
+              <button keypress=add>{count.value}</button>
+              <button keyup=add>{count.value}</button>
+            
+          

 
-        
-          For example, you can use the click 
-          attribute assigned to a function to trigger a function when 
-          the element is clicked. In combination with updating a signal, 
-          can trigger a re-render of the component. The following event 
-          attributes are supported.
-        
+          
+            For example, you can use the click 
+            attribute assigned to a function to trigger a function when 
+            the element is clicked. In combination with updating a signal, 
+            can trigger a re-render of the component. The following event 
+            attributes are supported.
+          
 
-        

-          

-            
Mouse Events

-            
    
-              
  • click
    • 
-              
  • dblclick
    • 
-              
  • mousedown
    • 
-              
  • mouseup
    • 
-              
  • mousemove
    • 
-              
  • mouseover
    • 
-              
  • mouseout
    • 
-              
  • wheel
    • 
-            

-            
Keyboard Events

-            
    
-              
  • keydown
    • 
-              
  • keypress
    • 
-              
  • keyup
    • 
-            

-            
Form Events

-            
    
-              
  • blur
    • 
-              
  • change
    • 
-              
  • contextmenu
    • 
-              
  • focus
    • 
-              
  • input
    • 
-              
  • submit
    • 
-              
  • invalid
    • 
-              
  • reset
    • 
-              
  • search
    • 
-              
  • select
    • 
-            

-            
Clipboard Events

-            
    
-              
  • copy
    • 
-              
  • cut
    • 
-              
  • paste
    • 
-            

-            
Transition Events

-            
    
-              
  • transitionend
    • 
-            

-          

-          

-            
Drag Events

-            
    
-              
  • drag
    • 
-              
  • dragstart
    • 
-              
  • dragend
    • 
-              
  • dragover
    • 
-              
  • dragenter
    • 
-              
  • dragleave
    • 
-              
  • drop
    • 
-              
  • scroll
    • 
-            

-            
Media Events

-            
    
-              
  • durationchange
    • 
-              
  • ended
    • 
-              
  • error
    • 
-              
  • loadeddata
    • 
-              
  • loadedmetadata
    • 
-              
  • loadstart
    • 
-              
  • pause
    • 
-              
  • play
    • 
-              
  • playing
    • 
-              
  • progress
    • 
-              
  • ratechange
    • 
-              
  • seeked
    • 
-              
  • seeking
    • 
-              
  • stalled
    • 
-              
  • suspend
    • 
-              
  • timeupdate
    • 
-              
  • volumechange
    • 
-              
  • waiting
    • 
-            

-            
Animation Events

-            
    
-              
  • animationstart
    • 
-              
  • animationend
    • 
-              
  • animationiteration
    • 
-            

+          

+            

+              
Mouse Events

+              
    
+                
  • click
    • 
+                
  • dblclick
    • 
+                
  • mousedown
    • 
+                
  • mouseup
    • 
+                
  • mousemove
    • 
+                
  • mouseover
    • 
+                
  • mouseout
    • 
+                
  • wheel
    • 
+              

+              
Keyboard Events

+              
    
+                
  • keydown
    • 
+                
  • keypress
    • 
+                
  • keyup
    • 
+              

+              
Form Events

+              
    
+                
  • blur
    • 
+                
  • change
    • 
+                
  • contextmenu
    • 
+                
  • focus
    • 
+                
  • input
    • 
+                
  • submit
    • 
+                
  • invalid
    • 
+                
  • reset
    • 
+                
  • search
    • 
+                
  • select
    • 
+              

+              
Clipboard Events

+              
    
+                
  • copy
    • 
+                
  • cut
    • 
+                
  • paste
    • 
+              

+              
Transition Events

+              
    
+                
  • transitionend
    • 
+              

+            

+            

+              
Drag Events

+              
    
+                
  • drag
    • 
+                
  • dragstart
    • 
+                
  • dragend
    • 
+                
  • dragover
    • 
+                
  • dragenter
    • 
+                
  • dragleave
    • 
+                
  • drop
    • 
+                
  • scroll
    • 
+              

+              
Media Events

+              
    
+                
  • durationchange
    • 
+                
  • ended
    • 
+                
  • error
    • 
+                
  • loadeddata
    • 
+                
  • loadedmetadata
    • 
+                
  • loadstart
    • 
+                
  • pause
    • 
+                
  • play
    • 
+                
  • playing
    • 
+                
  • progress
    • 
+                
  • ratechange
    • 
+                
  • seeked
    • 
+                
  • seeking
    • 
+                
  • stalled
    • 
+                
  • suspend
    • 
+                
  • timeupdate
    • 
+                
  • volumechange
    • 
+                
  • waiting
    • 
+              

+              
Animation Events

+              
    
+                
  • animationstart
    • 
+                
  • animationend
    • 
+                
  • animationiteration
    • 
+              

+            

           

-        

 
-        
-        
Class Names

+          
+          

+            Class Names
+          

 
-        
-          import { classnames } from '@ossph/temple';
-          const classlist = classnames(); //--> 'class1 class2 class3'
-        
+          

+            
+              import { classnames } from '@ossph/temple';
+              const classlist = classnames(); //--> 'class1 class2 class3'
+            
+          

 
-        
-          The classnames function can be used to generate 
-          a list of class names based on the properties of an object.
-        
+          
+            The classnames function can be used to generate 
+            a list of class names based on the properties of an object.
+          
 
-        
-        
Children

+          
+          

+            Children
+          

 
-        
-          import { children } from '@ossph/temple';
-          const childlist = children(); //--> Node[]
-        
-        
-          The children function can be used to render 
-          child components in a parent component.
-        
+          

+            
+              import { children } from '@ossph/temple';
+              const childlist = children(); //--> Node[]
+            
+          

+          
+            The children function can be used to render 
+            child components in a parent component.
+          
 
-        
-        
Environment Variables

+          
+          

+            Component
+          

 
-        
-          <script>
-            import { env } from '@ossph/temple';
-            const { BUILD_ID, NODE_ENV } = env();
-          </script>
-          <if true={NODE_ENV === 'development'}>
-            <p>Development mode</p>
-          </if>
-        
-        
-          The env function can be used to access environment 
-          variables in a component.
-        
+          

+            
+              import { component } from '@ossph/temple';
+              const button = component(); //--> HTMLElement
+              console.log(button.querySelector('span'));
+            
+          

+          
+            For other edge cases, the component function 
+            can be used to get raw access to the component's 
+            functionality.
+          
 
-        
-        
this

+          
+          

+            Environment Variables
+          

 
-        
-          
+          
             <script>
-              this.props;
-              this.style;
-              this.classList;
-              this.parentNode;
-              this.innerHTML;
-              this.appendChild();
-              this.querySelector('p');
+              import { env } from '@ossph/temple';
+              const { BUILD_ID, NODE_ENV } = env();
             </script>
+            <if true={NODE_ENV === 'development'}>
+              <p>Development mode</p>
+            </if>
           
-        
+          
+            The env function can be used to access environment 
+            variables in a component.
+          
+
+          
+          

+            this
+          

+
+          
+            
+              <script>
+                this.props;
+                this.style;
+                this.classList;
+                this.parentNode;
+                this.innerHTML;
+                this.appendChild();
+                this.querySelector('p');
+              </script>
+            
+          
+
+          
+            this refers to the 
+            TempleComponent that extends 
+            HTMLElement. This means all
+            components in Temple are in fact are HTML elements and has
+            access to the common functionality like 
+            innerHTML and
+            querySelector() to name a 
+            few. TempleComponent has the
+            additional following properties and methods that you can access
+            using this.
+          
 
-        
-          this refers to the 
-          TempleComponent that extends 
-          HTMLElement. This means all
-          components in Temple are in fact are HTML elements and has
-          access to the common functionality like 
-          innerHTML and
-          querySelector() to name a 
-          few. TempleComponent has the
-          additional following properties and methods that you can access
-          using this.
-        
+          
 
-        
+          
+            
+            Info: You can discover more methods and properties
+            of the HTMLElement class on the
+            
+              MDN Web Docs
+            .
+          
 
-        
-          
-          Info: You can discover more methods and properties
-          of the HTMLElement class on the
-          
-            MDN Web Docs
-          .
-        
-        
-        
-      

-      

-    
+          
+          

+        
+      
+    
   
 
\ No newline at end of file
diff --git a/docs/build/client/269f8b60f20cebb43be6.js b/docs/build/client/269f8b60f20cebb43be6.js
index 8c6146d..a0ef3bb 100644
--- a/docs/build/client/269f8b60f20cebb43be6.js
+++ b/docs/build/client/269f8b60f20cebb43be6.js
@@ -1,21 +1,30 @@
-var TempleAPI=(()=>{var Ft=Object.create;var xe=Object.defineProperty;var Rt=Object.getOwnPropertyDescriptor;var St=Object.getOwnPropertyNames;var Dt=Object.getPrototypeOf,Ct=Object.prototype.hasOwnProperty;var P=(t,e)=>()=>(e||t((e={exports:{}}).exports,e),e.exports),Pt=(t,e)=>{for(var r in e)xe(t,r,{get:e[r],enumerable:!0})},Ke=(t,e,r,l)=>{if(e&&typeof e=="object"||typeof e=="function")for(let i of St(e))!Ct.call(t,i)&&i!==r&&xe(t,i,{get:()=>e[i],enumerable:!(l=Rt(e,i))||l.enumerable});return t};var M=(t,e,r)=>(r=t!=null?Ft(Dt(t)):{},Ke(e||!t||!t.__esModule?xe(r,"default",{value:t,enumerable:!0}):r,t)),jt=t=>Ke(xe({},"__esModule",{value:!0}),t);var Ie=P(Le=>{"use strict";Object.defineProperty(Le,"__esModule",{value:!0});var Me=class extends Error{static for(e,...r){return r.forEach(function(l){e=e.replace("%s",l)}),new this(e)}static forErrorsFound(e){let r=new this("Invalid Parameters");return r.errors=e,r}static require(e,r,...l){if(!e){for(let i of l)r=r.replace("%s",i);throw new this(r)}}constructor(e,r=500){super(),this.errors={},this.start=0,this.end=0,this.message=e,this.name=this.constructor.name,this.code=r}withCode(e){return this.code=e,this}withPosition(e,r){return this.start=e,this.end=r,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};Le.default=Me});var ie=P(ne=>{"use strict";Object.defineProperty(ne,"__esModule",{value:!0});ne.TempleEmitter=void 0;var ke=class extends EventTarget{emit(e,r){return this.dispatchEvent(new CustomEvent(e,{detail:r})),this}on(e,r){if(e==="ready"&&document.readyState!=="loading"){let l=new CustomEvent("ready");return setTimeout(()=>r(l),1),this}return this.addEventListener(e,r),this}once(e,r){let l=i=>{this.unbind(e,l),r(i)};return this.on(e,l),this}unbind(e,r){return this.removeEventListener(e,r),this}};ne.TempleEmitter=ke;var Qe=new ke;document.onreadystatechange=()=>{document.readyState!=="loading"&&Qe.emit("ready")};ne.default=Qe});var Ne=P(se=>{"use strict";var Mt=se&&se.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(se,"__esModule",{value:!0});var Oe=Mt(ie()),$e=class{get attributes(){return Object.assign({},this._attributes)}get element(){return this._element}constructor(e,r){this._element=e,this._attributes=r}hasAttribute(e){return e in this._attributes}getAttribute(e){return this._attributes[e]}removeAttribute(e,r=!1){let l=this.getAttribute(e);return typeof l>"u"?this:(delete this._attributes[e],this._element.removeAttribute(e),r||Oe.default.emit("attribute-remove",{element:this,key:e,previous:l}),this)}setAttribute(e,r,l=!1){if(typeof r>"u")return this.removeAttribute(e,l);let i=this.getAttribute(e);return i===r?this:(this._attributes[e]=r,typeof r=="string"&&this._element.setAttribute(e,r),l||(typeof i>"u"?Oe.default.emit("attribute-create",{element:this,key:e,value:r}):Oe.default.emit("attribute-update",{element:this,key:e,value:r,previous:i})),this)}setAttributes(e,r=!1){for(let[i,g]of Object.entries(e))this.setAttribute(i,g,r);let l=Object.keys(e);for(let i of Object.keys(this._attributes))l.includes(i)||this.removeAttribute(i,r);return this}};se.default=$e});var Te=P(ae=>{"use strict";var Lt=ae&&ae.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ae,"__esModule",{value:!0});var It=Lt(Ne()),ve=class{static get elements(){return this._elements}static createComponent(e,r,l,i=[]){let g=document.createElement("template");g.innerHTML=`<${e}>`;let d=g.content.querySelector(`${e}`);Object.setPrototypeOf(d,r.prototype),d.constructor=r.constructor,d.constructor.component=r.component;for(let[x,k]of Object.entries(l))typeof k=="string"?d.setAttribute(x,k):k===!0&&d.setAttribute(x,x);return d._TempleAttributes=l,d.props=l,i.forEach(x=>d.appendChild(x)),d.register(),customElements.get(e)||d.connectedCallback(),this.register(d,l)}static createElement(e,r,l=[]){let i=document.createElement(e);for(let[g,h]of Object.entries(r))typeof h=="string"?i.setAttribute(g,h):h===!0&&i.setAttribute(g,g);return l.filter(g=>typeof g<"u").forEach(g=>i.appendChild(g)),this.register(i,r)}static createText(e,r=!1){return document.createTextNode(e)}static filter(e){let r=[];return this._elements.forEach((l,i)=>{e(l,i)&&r.push(l)}),r}static get(e){return this._elements.get(e)||null}static has(e){return this._elements.has(e)}static map(e){let r=[];return this._elements.forEach((l,i)=>{r.push(e(l,i))}),r}static register(e,r){if(this.has(e))return this.get(e);let l=new It.default(e,r||{});return this._elements.set(e,l),l}};ve._elements=new Map;ae.default=ve});var z=P(le=>{"use strict";Object.defineProperty(le,"__esModule",{value:!0});le.TempleDataMap=void 0;var _e=class{constructor(){window.__APP_DATA__||(window.__APP_DATA__={})}clear(){return window.__APP_DATA__={},this}delete(e){return this.has(e)?(delete window.__APP_DATA__[e],!0):!1}entries(){return Object.entries(window.__APP_DATA__)}has(e){return e in window.__APP_DATA__}get(e){return window.__APP_DATA__[e]}keys(){return Object.keys(window.__APP_DATA__)}set(e,r){return window.__APP_DATA__[e]=r,this}values(){return Object.values(window.__APP_DATA__)}};le.TempleDataMap=_e;var Ot=new _e;le.default=Ot});var tt=P(pe=>{"use strict";var He=pe&&pe.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(pe,"__esModule",{value:!0});var oe=He(Te()),we=He(ie()),et=He(z()),Be=class t extends HTMLElement{constructor(){super(...arguments),this._initiated=!1,this._template=null,this._attributes={},this._props={},this._children=void 0,this._rendering=!1}static register(){customElements.define(this.component[0],this)}get attr(){return this._attributes}get element(){return oe.default.has(this)?oe.default.get(this):oe.default.register(this,this._TempleAttributes||{})}get metadata(){let[e,r]=this.constructor.component;return{tagname:e,classname:r}}get originalChildren(){return this._children}get initiated(){return this._initiated}get props(){return this._props}set props(e){this._props=Object.assign({},e),this._attributes=Object.fromEntries(Object.entries(e).filter(r=>typeof r[1]=="string"||r[1]===!0))}adoptedCallback(){this.render()}attributeChangedCallback(e,r,l){this.props=Object.assign(Object.assign({},this.props),{[e]:l}),this.render()}connectedCallback(){this.wait()}disconnectedCallback(){}getParentComponent(){let e=this.parentElement;for(;e;){if(e instanceof t)return e;e=e.parentElement}return null}register(){oe.default.register(this,this._props)}render(){let e=this.getParentComponent();if(e&&!e.initiated)return;if(this._rendering)return;this._rendering=!0,et.default.set("current",this);let r=this.styles();this._template?we.default.emit("unmounted",this):this._template=this.template();let l=this._template().filter(Boolean);if(r.length===0)this.textContent="",l.forEach(i=>this.appendChild(i));else{this.shadowRoot||this.attachShadow({mode:"open"});let i=this.shadowRoot;this.textContent="",i.textContent="";let g=document.createElement("style");g.innerText=r,i.appendChild(g),l.forEach(h=>{var d;return(d=this.shadowRoot)===null||d===void 0?void 0:d.appendChild(h)})}return et.default.delete("current"),this._initiated=!0,we.default.emit("mounted",this),this._rendering=!1,this.shadowRoot?this.shadowRoot.innerHTML:this.innerHTML}wait(){if(document.readyState!=="loading")this._update();else{let e=()=>{this._update(),we.default.unbind("ready",e)};we.default.on("ready",e)}}_toNodeList(e){return e instanceof Node?[e]:Array.isArray(e)&&e.every(r=>r instanceof Node)?e:[oe.default.createText(String(e))]}_update(){typeof this._children>"u"&&(this._children=Array.from(this.childNodes||[]));let e=this.element;e&&(this.props=Object.assign({},e.attributes),this.render()),this._initiated||this.render()}};pe.default=Be});var rt=P(ce=>{"use strict";var $t=ce&&ce.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ce,"__esModule",{value:!0});var Nt=$t(z());function Bt(t){let e=Nt.default.get("env")||{};return t?e[t]||null:e}ce.default=Bt});var qe=P(de=>{"use strict";var Ht=de&&de.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(de,"__esModule",{value:!0});de.default=qt;var nt=Ht(z());function qt(t=null){return t||(t=nt.default.get("current")||null),t?t==="document"?nt.default.get("props")||{}:t.props:{}}});var it=P(ue=>{"use strict";var zt=ue&&ue.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ue,"__esModule",{value:!0});ue.default=Gt;var Jt=zt(qe());function Gt(t=null){return(0,Jt.default)(t).class}});var at=P(W=>{"use strict";var Ut=W&&W.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(W,"__esModule",{value:!0});W.innerHTML=Zt;W.default=st;var Wt=Ut(z());function Zt(t=null){let e=st(t),r=document.createElement("template");return r.append(...e),r.innerHTML}function st(t=null){return t||(t=Wt.default.get("current")||null),t?t.originalChildren||[]:[]}});var pt=P(J=>{"use strict";var ot=J&&J.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(J,"__esModule",{value:!0});J.SignalRegistry=void 0;J.default=Yt;var lt=ot(Ie()),Xt=ot(z()),Z=class t{static observe(e,r){let l={getter:()=>i.raw,setter:h=>h},i={raw:r,getter(h){return l.getter=h,i},setter(h){return l.setter=h,i}};Object.defineProperty(i,"value",{get(){return l.getter()},set(h){let d=l.setter(h),x=t.serialize(d)!==t.serialize(i.raw);i.raw=d,x&&e.render()}});let g=this._observers.get(e);return g?(g.observed++,g.values.push(i)):this._observers.set(e,{observed:1,values:[i]}),i}static observer(e){return this._observers.get(e)||null}static serialize(e){return JSON.stringify(e)}};J.SignalRegistry=Z;Z._observers=new Map;function Yt(t,e=null){if(e||(e=Xt.default.get("current")||null),!e)throw lt.default.for("Signals can only be created within a Temple component");if(!e.initiated)return Z.observe(e,t);let r=Z.observer(e);if(!r)throw lt.default.for("State mismatch");return r.values[r.observed++%r.values.length]}});var ft=P(Ae=>{"use strict";var dt=Ae&&Ae.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Ae,"__esModule",{value:!0});var ct=dt(Te()),ut=dt(ie()),mt=(t,e)=>Array.from(t.querySelectorAll("*")).filter(r=>{let l=ct.default.get(r);return l&&l.hasAttribute(e)}).map(r=>ct.default.get(r));function ze(t,e){ut.default.on("mounted",r=>{if(!r.detail)return;let l=r.detail;mt(l.shadowRoot||l,t).forEach(e)})}function Vt(t,e){ut.default.on("unmounted",r=>{if(!r.detail)return;let l=r.detail;mt(l.shadowRoot||l,t).forEach(e)})}ze("mount",t=>{let e=t.getAttribute("mount");if(typeof e=="function"){let r=new CustomEvent("mount",{detail:{node:t,target:t.element}});e(r)}});Vt("unmount",t=>{let e=t.getAttribute("unmount");if(typeof e=="function"){let r=new CustomEvent("unmount",{detail:{node:t,target:t.element}});e(r)}});ze("if",t=>{let e=t.getAttribute("if");(e===!1||e==="false"||typeof e=="function"&&!e())&&t.element.remove()});["click","dblclick","mousedown","mouseup","mousemove","mouseover","mouseout","wheel","keydown","keypress","keyup","blur","change","contextmenu","focus","input","submit","invalid","reset","search","select","copy","cut","paste","drag","dragstart","dragend","dragover","dragenter","dragleave","drop","scroll","durationchange","ended","error","loadeddata","loadedmetadata","loadstart","pause","play","playing","progress","ratechange","seeked","seeking","stalled","suspend","timeupdate","volumechange","waiting","animationstart","animationend","animationiteration","transitionend","toggle"].forEach(t=>ze(t,e=>{let r=e.getAttribute(t);typeof r=="function"&&(e.element.removeEventListener(t,r),e.element.addEventListener(t,r))}))});var Je=P(y=>{"use strict";var Kt=y&&y.__createBinding||(Object.create?function(t,e,r,l){l===void 0&&(l=r);var i=Object.getOwnPropertyDescriptor(e,r);(!i||("get"in i?!e.__esModule:i.writable||i.configurable))&&(i={enumerable:!0,get:function(){return e[r]}}),Object.defineProperty(t,l,i)}:function(t,e,r,l){l===void 0&&(l=r),t[l]=e[r]}),Qt=y&&y.__setModuleDefault||(Object.create?function(t,e){Object.defineProperty(t,"default",{enumerable:!0,value:e})}:function(t,e){t.default=e}),Ee=y&&y.__importStar||function(t){if(t&&t.__esModule)return t;var e={};if(t!=null)for(var r in t)r!=="default"&&Object.prototype.hasOwnProperty.call(t,r)&&Kt(e,t,r);return Qt(e,t),e},G=y&&y.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(y,"__esModule",{value:!0});y.SignalRegistry=y.TempleException=y.TempleEmitter=y.TempleElement=y.TempleRegistry=y.TempleComponent=y.TempleDataMap=y.emitter=y.signal=y.innerHTML=y.children=y.classnames=y.props=y.env=y.data=void 0;var er=G(Ie());y.TempleException=er.default;var tr=G(tt());y.TempleComponent=tr.default;var rr=G(Te());y.TempleRegistry=rr.default;var nr=G(Ne());y.TempleElement=nr.default;var gt=Ee(ie());y.emitter=gt.default;Object.defineProperty(y,"TempleEmitter",{enumerable:!0,get:function(){return gt.TempleEmitter}});var ht=Ee(z());y.data=ht.default;Object.defineProperty(y,"TempleDataMap",{enumerable:!0,get:function(){return ht.TempleDataMap}});var ir=G(rt());y.env=ir.default;var sr=G(qe());y.props=sr.default;var ar=G(it());y.classnames=ar.default;var yt=Ee(at());y.children=yt.default;Object.defineProperty(y,"innerHTML",{enumerable:!0,get:function(){return yt.innerHTML}});var bt=Ee(pt());y.signal=bt.default;Object.defineProperty(y,"SignalRegistry",{enumerable:!0,get:function(){return bt.SignalRegistry}});ft()});var $=P((Er,xt)=>{xt.exports={...Je()}});var kt=P((Rr,Re)=>{var lr=typeof window<"u"?window:typeof WorkerGlobalScope<"u"&&self instanceof WorkerGlobalScope?self:{};var u=function(t){var e=/(?:^|\s)lang(?:uage)?-([\w-]+)(?=\s|$)/i,r=0,l={},i={manual:t.Prism&&t.Prism.manual,disableWorkerMessageHandler:t.Prism&&t.Prism.disableWorkerMessageHandler,util:{encode:function n(s){return s instanceof g?new g(s.type,n(s.content),s.alias):Array.isArray(s)?s.map(n):s.replace(/&/g,"&").replace(/"u")return null;if("currentScript"in document)return document.currentScript;try{throw new Error}catch(p){var n=(/at [^(\r\n]*\((.*):[^:]+:[^:]+\)$/i.exec(p.stack)||[])[1];if(n){var s=document.getElementsByTagName("script");for(var o in s)if(s[o].src==n)return s[o]}return null}},isActive:function(n,s,o){for(var p="no-"+s;n;){var c=n.classList;if(c.contains(s))return!0;if(c.contains(p))return!1;n=n.parentElement}return!!o}},languages:{plain:l,plaintext:l,text:l,txt:l,extend:function(n,s){var o=i.util.clone(i.languages[n]);for(var p in s)o[p]=s[p];return o},insertBefore:function(n,s,o,p){p=p||i.languages;var c=p[n],f={};for(var b in c)if(c.hasOwnProperty(b)){if(b==s)for(var m in o)o.hasOwnProperty(m)&&(f[m]=o[m]);o.hasOwnProperty(b)||(f[b]=c[b])}var F=p[n];return p[n]=f,i.languages.DFS(i.languages,function(D,N){N===F&&D!=n&&(this[D]=f)}),f},DFS:function n(s,o,p,c){c=c||{};var f=i.util.objId;for(var b in s)if(s.hasOwnProperty(b)){o.call(s,b,s[b],p||b);var m=s[b],F=i.util.type(m);F==="Object"&&!c[f(m)]?(c[f(m)]=!0,n(m,o,null,c)):F==="Array"&&!c[f(m)]&&(c[f(m)]=!0,n(m,o,b,c))}}},plugins:{},highlightAll:function(n,s){i.highlightAllUnder(document,n,s)},highlightAllUnder:function(n,s,o){var p={callback:o,container:n,selector:'code[class*="language-"], [class*="language-"] code, code[class*="lang-"], [class*="lang-"] code'};i.hooks.run("before-highlightall",p),p.elements=Array.prototype.slice.apply(p.container.querySelectorAll(p.selector)),i.hooks.run("before-all-elements-highlight",p);for(var c=0,f;f=p.elements[c++];)i.highlightElement(f,s===!0,p.callback)},highlightElement:function(n,s,o){var p=i.util.getLanguage(n),c=i.languages[p];i.util.setLanguage(n,p);var f=n.parentElement;f&&f.nodeName.toLowerCase()==="pre"&&i.util.setLanguage(f,p);var b=n.textContent,m={element:n,language:p,grammar:c,code:b};function F(N){m.highlightedCode=N,i.hooks.run("before-insert",m),m.element.innerHTML=m.highlightedCode,i.hooks.run("after-highlight",m),i.hooks.run("complete",m),o&&o.call(m.element)}if(i.hooks.run("before-sanity-check",m),f=m.element.parentElement,f&&f.nodeName.toLowerCase()==="pre"&&!f.hasAttribute("tabindex")&&f.setAttribute("tabindex","0"),!m.code){i.hooks.run("complete",m),o&&o.call(m.element);return}if(i.hooks.run("before-highlight",m),!m.grammar){F(i.util.encode(m.code));return}if(s&&t.Worker){var D=new Worker(i.filename);D.onmessage=function(N){F(N.data)},D.postMessage(JSON.stringify({language:m.language,code:m.code,immediateClose:!0}))}else F(i.highlight(m.code,m.grammar,m.language))},highlight:function(n,s,o){var p={code:n,grammar:s,language:o};if(i.hooks.run("before-tokenize",p),!p.grammar)throw new Error('The language "'+p.language+'" has no grammar.');return p.tokens=i.tokenize(p.code,p.grammar),i.hooks.run("after-tokenize",p),g.stringify(i.util.encode(p.tokens),p.language)},tokenize:function(n,s){var o=s.rest;if(o){for(var p in o)s[p]=o[p];delete s.rest}var c=new x;return k(c,c.head,n),d(n,c,s,c.head,0),E(c)},hooks:{all:{},add:function(n,s){var o=i.hooks.all;o[n]=o[n]||[],o[n].push(s)},run:function(n,s){var o=i.hooks.all[n];if(!(!o||!o.length))for(var p=0,c;c=o[p++];)c(s)}},Token:g};t.Prism=i;function g(n,s,o,p){this.type=n,this.content=s,this.alias=o,this.length=(p||"").length|0}g.stringify=function n(s,o){if(typeof s=="string")return s;if(Array.isArray(s)){var p="";return s.forEach(function(F){p+=n(F,o)}),p}var c={type:s.type,content:n(s.content,o),tag:"span",classes:["token",s.type],attributes:{},language:o},f=s.alias;f&&(Array.isArray(f)?Array.prototype.push.apply(c.classes,f):c.classes.push(f)),i.hooks.run("wrap",c);var b="";for(var m in c.attributes)b+=" "+m+'="'+(c.attributes[m]||"").replace(/"/g,""")+'"';return"<"+c.tag+' class="'+c.classes.join(" ")+'"'+b+">"+c.content+""};function h(n,s,o,p){n.lastIndex=s;var c=n.exec(o);if(c&&p&&c[1]){var f=c[1].length;c.index+=f,c[0]=c[0].slice(f)}return c}function d(n,s,o,p,c,f){for(var b in o)if(!(!o.hasOwnProperty(b)||!o[b])){var m=o[b];m=Array.isArray(m)?m:[m];for(var F=0;F=f.reach);O+=C.value.length,C=C.next){var U=C.value;if(s.length>n.length)return;if(!(U instanceof g)){var ge=1,I;if(Xe){if(I=h(Ye,O,n,Ze),!I||I.index>=n.length)break;var he=I.index,At=I.index+I[0].length,B=O;for(B+=C.value.length;he>=B;)C=C.next,B+=C.value.length;if(B-=C.value.length,O=B,C.value instanceof g)continue;for(var re=C;re!==s.tail&&(Bf.reach&&(f.reach=Pe);var be=C.prev;Ce&&(be=k(s,be,Ce),O+=Ce.length),T(s,be,ge);var Et=new g(b,N?i.tokenize(ye,N):ye,_t,ye);if(C=k(s,be,Et),Ve&&k(s,C,Ve),ge>1){var je={cause:b+","+F,reach:Pe};d(n,s,o,C.prev,O,je),f&&je.reach>f.reach&&(f.reach=je.reach)}}}}}}function x(){var n={value:null,prev:null,next:null},s={value:null,prev:n,next:null};n.next=s,this.head=n,this.tail=s,this.length=0}function k(n,s,o){var p=s.next,c={value:o,prev:s,next:p};return s.next=c,p.prev=c,n.length++,c}function T(n,s,o){for(var p=s.next,c=0;c/,greedy:!0},prolog:{pattern:/<\?[\s\S]+?\?>/,greedy:!0},doctype:{pattern:/"'[\]]|"[^"]*"|'[^']*')+(?:\[(?:[^<"'\]]|"[^"]*"|'[^']*'|<(?!!--)|)*\]\s*)?>/i,greedy:!0,inside:{"internal-subset":{pattern:/(^[^\[]*\[)[\s\S]+(?=\]>$)/,lookbehind:!0,greedy:!0,inside:null},string:{pattern:/"[^"]*"|'[^']*'/,greedy:!0},punctuation:/^$|[[\]]/,"doctype-tag":/^DOCTYPE/i,name:/[^\s<>'"]+/}},cdata:{pattern://i,greedy:!0},tag:{pattern:/<\/?(?!\d)[^\s>\/=$<%]+(?:\s(?:\s*[^\s>\/=]+(?:\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))|(?=[\s/>])))+)?\s*\/?>/,greedy:!0,inside:{tag:{pattern:/^<\/?[^\s>\/]+/,inside:{punctuation:/^<\/?/,namespace:/^[^\s>\/:]+:/}},"special-attr":[],"attr-value":{pattern:/=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+)/,inside:{punctuation:[{pattern:/^=/,alias:"attr-equals"},{pattern:/^(\s*)["']|["']$/,lookbehind:!0}]}},punctuation:/\/?>/,"attr-name":{pattern:/[^\s>\/]+/,inside:{namespace:/^[^\s>\/:]+:/}}}},entity:[{pattern:/&[\da-z]{1,8};/i,alias:"named-entity"},/&#x?[\da-f]{1,8};/i]};u.languages.markup.tag.inside["attr-value"].inside.entity=u.languages.markup.entity;u.languages.markup.doctype.inside["internal-subset"].inside=u.languages.markup;u.hooks.add("wrap",function(t){t.type==="entity"&&(t.attributes.title=t.content.replace(/&/,"&"))});Object.defineProperty(u.languages.markup.tag,"addInlined",{value:function(e,r){var l={};l["language-"+r]={pattern:/(^$)/i,lookbehind:!0,inside:u.languages[r]},l.cdata=/^$/i;var i={"included-cdata":{pattern://i,inside:l}};i["language-"+r]={pattern:/[\s\S]+/,inside:u.languages[r]};var g={};g[e]={pattern:RegExp(/(<__[^>]*>)(?:))*\]\]>|(?!)/.source.replace(/__/g,function(){return e}),"i"),lookbehind:!0,greedy:!0,inside:i},u.languages.insertBefore("markup","cdata",g)}});Object.defineProperty(u.languages.markup.tag,"addAttribute",{value:function(t,e){u.languages.markup.tag.inside["special-attr"].push({pattern:RegExp(/(^|["'\s])/.source+"(?:"+t+")"+/\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))/.source,"i"),lookbehind:!0,inside:{"attr-name":/^[^\s=]+/,"attr-value":{pattern:/=[\s\S]+/,inside:{value:{pattern:/(^=\s*(["']|(?!["'])))\S[\s\S]*(?=\2$)/,lookbehind:!0,alias:[e,"language-"+e],inside:u.languages[e]},punctuation:[{pattern:/^=/,alias:"attr-equals"},/"|'/]}}}})}});u.languages.html=u.languages.markup;u.languages.mathml=u.languages.markup;u.languages.svg=u.languages.markup;u.languages.xml=u.languages.extend("markup",{});u.languages.ssml=u.languages.xml;u.languages.atom=u.languages.xml;u.languages.rss=u.languages.xml;(function(t){var e=/(?:"(?:\\(?:\r\n|[\s\S])|[^"\\\r\n])*"|'(?:\\(?:\r\n|[\s\S])|[^'\\\r\n])*')/;t.languages.css={comment:/\/\*[\s\S]*?\*\//,atrule:{pattern:RegExp("@[\\w-](?:"+/[^;{\s"']|\s+(?!\s)/.source+"|"+e.source+")*?"+/(?:;|(?=\s*\{))/.source),inside:{rule:/^@[\w-]+/,"selector-function-argument":{pattern:/(\bselector\s*\(\s*(?![\s)]))(?:[^()\s]|\s+(?![\s)])|\((?:[^()]|\([^()]*\))*\))+(?=\s*\))/,lookbehind:!0,alias:"selector"},keyword:{pattern:/(^|[^\w-])(?:and|not|only|or)(?![\w-])/,lookbehind:!0}}},url:{pattern:RegExp("\\burl\\((?:"+e.source+"|"+/(?:[^\\\r\n()"']|\\[\s\S])*/.source+")\\)","i"),greedy:!0,inside:{function:/^url/i,punctuation:/^\(|\)$/,string:{pattern:RegExp("^"+e.source+"$"),alias:"url"}}},selector:{pattern:RegExp(`(^|[{}\\s])[^{}\\s](?:[^{};"'\\s]|\\s+(?![\\s{])|`+e.source+")*(?=\\s*\\{)"),lookbehind:!0},string:{pattern:e,greedy:!0},property:{pattern:/(^|[^-\w\xA0-\uFFFF])(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*(?=\s*:)/i,lookbehind:!0},important:/!important\b/i,function:{pattern:/(^|[^-a-z0-9])[-a-z0-9]+(?=\()/i,lookbehind:!0},punctuation:/[(){};:,]/},t.languages.css.atrule.inside.rest=t.languages.css;var r=t.languages.markup;r&&(r.tag.addInlined("style","css"),r.tag.addAttribute("style","css"))})(u);u.languages.clike={comment:[{pattern:/(^|[^\\])\/\*[\s\S]*?(?:\*\/|$)/,lookbehind:!0,greedy:!0},{pattern:/(^|[^\\:])\/\/.*/,lookbehind:!0,greedy:!0}],string:{pattern:/(["'])(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/,greedy:!0},"class-name":{pattern:/(\b(?:class|extends|implements|instanceof|interface|new|trait)\s+|\bcatch\s+\()[\w.\\]+/i,lookbehind:!0,inside:{punctuation:/[.\\]/}},keyword:/\b(?:break|catch|continue|do|else|finally|for|function|if|in|instanceof|new|null|return|throw|try|while)\b/,boolean:/\b(?:false|true)\b/,function:/\b\w+(?=\()/,number:/\b0x[\da-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:e[+-]?\d+)?/i,operator:/[<>]=?|[!=]=?=?|--?|\+\+?|&&?|\|\|?|[?*/~^%]/,punctuation:/[{}[\];(),.:]/};u.languages.javascript=u.languages.extend("clike",{"class-name":[u.languages.clike["class-name"],{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$A-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\.(?:constructor|prototype))/,lookbehind:!0}],keyword:[{pattern:/((?:^|\})\s*)catch\b/,lookbehind:!0},{pattern:/(^|[^.]|\.\.\.\s*)\b(?:as|assert(?=\s*\{)|async(?=\s*(?:function\b|\(|[$\w\xA0-\uFFFF]|$))|await|break|case|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally(?=\s*(?:\{|$))|for|from(?=\s*(?:['"]|$))|function|(?:get|set)(?=\s*(?:[#\[$\w\xA0-\uFFFF]|$))|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)\b/,lookbehind:!0}],function:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*(?:\.\s*(?:apply|bind|call)\s*)?\()/,number:{pattern:RegExp(/(^|[^\w$])/.source+"(?:"+(/NaN|Infinity/.source+"|"+/0[bB][01]+(?:_[01]+)*n?/.source+"|"+/0[oO][0-7]+(?:_[0-7]+)*n?/.source+"|"+/0[xX][\dA-Fa-f]+(?:_[\dA-Fa-f]+)*n?/.source+"|"+/\d+(?:_\d+)*n/.source+"|"+/(?:\d+(?:_\d+)*(?:\.(?:\d+(?:_\d+)*)?)?|\.\d+(?:_\d+)*)(?:[Ee][+-]?\d+(?:_\d+)*)?/.source)+")"+/(?![\w$])/.source),lookbehind:!0},operator:/--|\+\+|\*\*=?|=>|&&=?|\|\|=?|[!=]==|<<=?|>>>?=?|[-+*/%&|^!=<>]=?|\.{3}|\?\?=?|\?\.?|[~:]/});u.languages.javascript["class-name"][0].pattern=/(\b(?:class|extends|implements|instanceof|interface|new)\s+)[\w.\\]+/;u.languages.insertBefore("javascript","keyword",{regex:{pattern:RegExp(/((?:^|[^$\w\xA0-\uFFFF."'\])\s]|\b(?:return|yield))\s*)/.source+/\//.source+"(?:"+/(?:\[(?:[^\]\\\r\n]|\\.)*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}/.source+"|"+/(?:\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.)*\])*\])*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}v[dgimyus]{0,7}/.source+")"+/(?=(?:\s|\/\*(?:[^*]|\*(?!\/))*\*\/)*(?:$|[\r\n,.;:})\]]|\/\/))/.source),lookbehind:!0,greedy:!0,inside:{"regex-source":{pattern:/^(\/)[\s\S]+(?=\/[a-z]*$)/,lookbehind:!0,alias:"language-regex",inside:u.languages.regex},"regex-delimiter":/^\/|\/$/,"regex-flags":/^[a-z]+$/}},"function-variable":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*[=:]\s*(?:async\s*)?(?:\bfunction\b|(?:\((?:[^()]|\([^()]*\))*\)|(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)\s*=>))/,alias:"function"},parameter:[{pattern:/(function(?:\s+(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)?\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\))/,lookbehind:!0,inside:u.languages.javascript},{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$a-z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*=>)/i,lookbehind:!0,inside:u.languages.javascript},{pattern:/(\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*=>)/,lookbehind:!0,inside:u.languages.javascript},{pattern:/((?:\b|\s|^)(?!(?:as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)(?![$\w\xA0-\uFFFF]))(?:(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*)\(\s*|\]\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*\{)/,lookbehind:!0,inside:u.languages.javascript}],constant:/\b[A-Z](?:[A-Z_]|\dx?)*\b/});u.languages.insertBefore("javascript","string",{hashbang:{pattern:/^#!.*/,greedy:!0,alias:"comment"},"template-string":{pattern:/`(?:\\[\s\S]|\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}|(?!\$\{)[^\\`])*`/,greedy:!0,inside:{"template-punctuation":{pattern:/^`|`$/,alias:"string"},interpolation:{pattern:/((?:^|[^\\])(?:\\{2})*)\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}/,lookbehind:!0,inside:{"interpolation-punctuation":{pattern:/^\$\{|\}$/,alias:"punctuation"},rest:u.languages.javascript}},string:/[\s\S]+/}},"string-property":{pattern:/((?:^|[,{])[ \t]*)(["'])(?:\\(?:\r\n|[\s\S])|(?!\2)[^\\\r\n])*\2(?=\s*:)/m,lookbehind:!0,greedy:!0,alias:"property"}});u.languages.insertBefore("javascript","operator",{"literal-property":{pattern:/((?:^|[,{])[ \t]*)(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*:)/m,lookbehind:!0,alias:"property"}});u.languages.markup&&(u.languages.markup.tag.addInlined("script","javascript"),u.languages.markup.tag.addAttribute(/on(?:abort|blur|change|click|composition(?:end|start|update)|dblclick|error|focus(?:in|out)?|key(?:down|up)|load|mouse(?:down|enter|leave|move|out|over|up)|reset|resize|scroll|select|slotchange|submit|unload|wheel)/.source,"javascript"));u.languages.js=u.languages.javascript;(function(){if(typeof u>"u"||typeof document>"u")return;Element.prototype.matches||(Element.prototype.matches=Element.prototype.msMatchesSelector||Element.prototype.webkitMatchesSelector);var t="Loading\u2026",e=function(_,v){return"\u2716 Error "+_+" while fetching file: "+v},r="\u2716 Error: File does not exist or is empty",l={js:"javascript",py:"python",rb:"ruby",ps1:"powershell",psm1:"powershell",sh:"bash",bat:"batch",h:"c",tex:"latex"},i="data-src-status",g="loading",h="loaded",d="failed",x="pre[data-src]:not(["+i+'="'+h+'"]):not(['+i+'="'+g+'"])';function k(_,v,w){var n=new XMLHttpRequest;n.open("GET",_,!0),n.onreadystatechange=function(){n.readyState==4&&(n.status<400&&n.responseText?v(n.responseText):n.status>=400?w(e(n.status,n.statusText)):w(r))},n.send(null)}function T(_){var v=/^\s*(\d+)\s*(?:(,)\s*(?:(\d+)\s*)?)?$/.exec(_||"");if(v){var w=Number(v[1]),n=v[2],s=v[3];return n?s?[w,Number(s)]:[w,void 0]:[w,w]}}u.hooks.add("before-highlightall",function(_){_.selector+=", "+x}),u.hooks.add("before-sanity-check",function(_){var v=_.element;if(v.matches(x)){_.code="",v.setAttribute(i,g);var w=v.appendChild(document.createElement("CODE"));w.textContent=t;var n=v.getAttribute("data-src"),s=_.language;if(s==="none"){var o=(/\.(\w+)$/.exec(n)||[,"none"])[1];s=l[o]||o}u.util.setLanguage(w,s),u.util.setLanguage(v,s);var p=u.plugins.autoloader;p&&p.loadLanguages(s),k(n,function(c){v.setAttribute(i,h);var f=T(v.getAttribute("data-range"));if(f){var b=c.split(/\r\n?|\n/g),m=f[0],F=f[1]==null?b.length:f[1];m<0&&(m+=b.length),m=Math.max(0,Math.min(m-1,b.length)),F<0&&(F+=b.length),F=Math.max(0,Math.min(F,b.length)),c=b.slice(m,F).join(`
-`),v.hasAttribute("data-start")||v.setAttribute("data-start",String(m+1))}w.textContent=c,u.highlightElement(w)},function(c){v.setAttribute(i,d),w.textContent=c})}}),u.plugins.fileHighlight={highlight:function(v){for(var w=(v||document).querySelectorAll(x),n=0,s;s=w[n++];)u.highlightElement(s)}};var E=!1;u.fileHighlight=function(){E||(console.warn("Prism.fileHighlight is deprecated. Use `Prism.plugins.fileHighlight.highlight` instead."),E=!0),u.plugins.fileHighlight.highlight.apply(this,arguments)}})()});var Y=P((Sr,vt)=>{vt.exports={...Je()}});var dr={};Pt(dr,{BUILD_ID:()=>cr,TempleComponent:()=>R.TempleComponent,TempleElement:()=>R.TempleElement,TempleEmitter:()=>R.TempleEmitter,TempleException:()=>R.TempleException,TempleRegistry:()=>R.TempleRegistry,children:()=>R.children,components:()=>pr,data:()=>R.data,emitter:()=>R.emitter,props:()=>R.props,signal:()=>R.signal});var L=M($());var Fe=M($()),X=class extends Fe.TempleComponent{static component=["main","Main_fd7f1af6410c5b5c8e1f"];styles(){return""}template(){let e=this.props,r=()=>this.originalChildren;return()=>[Fe.TempleRegistry.createElement("main",{},[...this._toNodeList(r())]).element]}};var A=M($()),Ge=M(kt()),Tt=M(Y()),H=class extends A.TempleComponent{static component=["code","Code_6f36bc13bb6a166c7abc"];styles(){return`:host {
+var TempleAPI=(()=>{var Xt=Object.create;var Ne=Object.defineProperty;var Yt=Object.getOwnPropertyDescriptor;var Vt=Object.getOwnPropertyNames;var Kt=Object.getPrototypeOf,Qt=Object.prototype.hasOwnProperty;var j=(t,e)=>()=>(e||t((e={exports:{}}).exports,e),e.exports),er=(t,e)=>{for(var r in e)Ne(t,r,{get:e[r],enumerable:!0})},vt=(t,e,r,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let n of Vt(e))!Qt.call(t,n)&&n!==r&&Ne(t,n,{get:()=>e[n],enumerable:!(i=Yt(e,n))||i.enumerable});return t};var w=(t,e,r)=>(r=t!=null?Xt(Kt(t)):{},vt(e||!t||!t.__esModule?Ne(r,"default",{value:t,enumerable:!0}):r,t)),tr=t=>vt(Ne({},"__esModule",{value:!0}),t);var ye=j(st=>{"use strict";Object.defineProperty(st,"__esModule",{value:!0});var nt=class extends Error{static for(e,...r){return r.forEach(function(i){e=e.replace("%s",i)}),new this(e)}static forErrorsFound(e){let r=new this("Invalid Parameters");return r.errors=e,r}static require(e,r,...i){if(!e){for(let n of i)r=r.replace("%s",n);throw new this(r)}}constructor(e,r=500){super(),this.errors={},this.start=0,this.end=0,this.message=e,this.name=this.constructor.name,this.code=r}withCode(e){return this.code=e,this}withPosition(e,r){return this.start=e,this.end=r,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};st.default=nt});var $e=j(M=>{"use strict";var rr=M&&M.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(M,"__esModule",{value:!0});M.match=M.TempleEmitter=M.events=void 0;M.bindAttribute=G;M.unbindAttribute=_t;var Tt=rr(He());M.events=["click","dblclick","mousedown","mouseup","mousemove","mouseover","mouseout","wheel","keydown","keypress","keyup","blur","change","contextmenu","focus","input","submit","invalid","reset","search","select","copy","cut","paste","drag","dragstart","dragend","dragover","dragenter","dragleave","drop","scroll","durationchange","ended","error","loadeddata","loadedmetadata","loadstart","pause","play","playing","progress","ratechange","seeked","seeking","stalled","suspend","timeupdate","volumechange","waiting","animationstart","animationend","animationiteration","transitionend","toggle"];var Ie=class extends EventTarget{emit(e,r){return this.dispatchEvent(new CustomEvent(e,{detail:r})),this}on(e,r){if(e==="ready"&&document.readyState!=="loading"){let i=new CustomEvent("ready");return setTimeout(()=>r(i),1),this}return this.addEventListener(e,r),this}once(e,r){let i=n=>{this.unbind(e,i),r(n)};return this.on(e,i),this}unbind(e,r){return this.removeEventListener(e,r),this}};M.TempleEmitter=Ie;var nr=(t,e)=>Array.from(t.querySelectorAll("*")).filter(r=>{let i=Tt.default.get(r),n=i&&i.hasAttribute(e)&&!i.hasEvent(e);return n&&i.addEvent(e),n}).map(r=>Tt.default.get(r));M.match=nr;function G(t,e){Oe.on("mounted",r=>{if(!r.detail)return;let i=r.detail;(0,M.match)(i.shadowRoot||i,t).forEach(e)})}function _t(t,e){Oe.on("unmounted",r=>{if(!r.detail)return;let i=r.detail;(0,M.match)(i.shadowRoot||i,t).forEach(e)})}var Oe=new Ie;M.default=(document.onreadystatechange=()=>{document.readyState!=="loading"&&Oe.emit("ready")},G("mount",t=>{let e=t.getAttribute("mount");if(typeof e=="function"){let r=new CustomEvent("mount",{detail:{node:t,target:t.element}});e(r)}}),_t("unmount",t=>{let e=t.getAttribute("unmount");if(typeof e=="function"){let r=new CustomEvent("unmount",{detail:{node:t,target:t.element}});e(r)}}),G("connect",t=>{let e=t.getAttribute("connect");if(typeof e=="function"){let r=new CustomEvent("connect",{detail:{node:t,target:t.element}});e(r)}}),G("disconnect",t=>{let e=t.getAttribute("disconnect");if(typeof e=="function"){let r=new CustomEvent("disconnect",{detail:{node:t,target:t.element}});e(r)}}),G("adopt",t=>{let e=t.getAttribute("adopt");if(typeof e=="function"){let r=new CustomEvent("adopt",{detail:{node:t,target:t.element}});e(r)}}),G("if",t=>{let e=t.getAttribute("if");(e===!1||e==="false"||typeof e=="function"&&!e())&&t.element.remove()}),M.events.forEach(t=>G(t,e=>{let r=e.getAttribute(t);typeof r=="function"&&(e.element.removeEventListener(t,r),e.element.addEventListener(t,r))})),Oe)});var lt=j(be=>{"use strict";var sr=be&&be.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(be,"__esModule",{value:!0});var it=sr($e()),at=class{get attributes(){return Object.assign({},this._attributes)}get element(){return this._element}get events(){return this._events}constructor(e,r){this._events=new Set,this._element=e,this._attributes=r}addEvent(e){return this._events.add(e),this}getAttribute(e){return this._attributes[e]}hasAttribute(e){return e in this._attributes}hasEvent(e){return this._events.has(e)}removeAttribute(e,r=!1){let i=this.getAttribute(e);return typeof i>"u"?this:(delete this._attributes[e],this._element.removeAttribute(e),r||it.default.emit("attribute-remove",{element:this,key:e,previous:i}),this)}setAttribute(e,r,i=!1){if(typeof r>"u")return this.removeAttribute(e,i);let n=this.getAttribute(e);return n===r?this:(this._attributes[e]=r,typeof r=="string"&&this._element.setAttribute(e,r),i||(typeof n>"u"?it.default.emit("attribute-create",{element:this,key:e,value:r}):it.default.emit("attribute-update",{element:this,key:e,value:r,previous:n})),this)}setAttributes(e,r=!1){for(let[n,u]of Object.entries(e))this.setAttribute(n,u,r);let i=Object.keys(e);for(let n of Object.keys(this._attributes))i.includes(n)||this.removeAttribute(n,r);return this}};be.default=at});var He=j(xe=>{"use strict";var ir=xe&&xe.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(xe,"__esModule",{value:!0});var ar=ir(lt()),wt=document.createElement("textarea"),lr=t=>(wt.innerHTML=t,wt.value),Be=class{static get elements(){return this._elements}static createComponent(e,r,i,n=[]){let u=document.createElement("template");u.innerHTML=`<${e}>`;let d=u.content.querySelector(`${e}`);return Object.setPrototypeOf(d,r.prototype),d.constructor=r.constructor,d.constructor.component=r.component,d.register(i,n),d.element}static createElement(e,r,i=[]){let n=document.createElement(e);for(let[u,y]of Object.entries(r))typeof y=="string"?n.setAttribute(u,y):y===!0&&n.setAttribute(u,u);return i.filter(u=>typeof u<"u").forEach(u=>n.appendChild(u)),this.register(n,r)}static createText(e,r=!0){return document.createTextNode(lr(e))}static filter(e){let r=[];return this._elements.forEach((i,n)=>{e(i,n)&&r.push(i)}),r}static get(e){return this._elements.get(e)||null}static has(e){return this._elements.has(e)}static map(e){let r=[];return this._elements.forEach((i,n)=>{r.push(e(i,n))}),r}static register(e,r){if(this.has(e))return this.get(e);let i=new ar.default(e,r||{});return this._elements.set(e,i),i}};Be._elements=new Map;xe.default=Be});var ee=j(ke=>{"use strict";Object.defineProperty(ke,"__esModule",{value:!0});ke.TempleDataMap=void 0;var qe=class{constructor(){window.__APP_DATA__||(window.__APP_DATA__={})}clear(){return window.__APP_DATA__={},this}delete(e){return this.has(e)?(delete window.__APP_DATA__[e],!0):!1}entries(){return Object.entries(window.__APP_DATA__)}has(e){return e in window.__APP_DATA__}get(e){return window.__APP_DATA__[e]}keys(){return Object.keys(window.__APP_DATA__)}set(e,r){return window.__APP_DATA__[e]=r,this}values(){return Object.values(window.__APP_DATA__)}};ke.TempleDataMap=qe;var or=new qe;ke.default=or});var At=j(ve=>{"use strict";var Je=ve&&ve.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ve,"__esModule",{value:!0});var Et=Je(ye()),W=Je(He()),U=Je($e()),ze=Je(ee()),ot=class t extends HTMLElement{static register(){customElements.define(this.component[0],this)}get attr(){return Object.fromEntries(Array.from(this.attributes).map(e=>[e.name,e.value]))}get element(){if(!W.default.has(this))throw Et.default.for("Component not mapped.");return W.default.get(this)}get metadata(){let[e,r]=this.constructor.component;return{tagname:e,classname:r}}get originalChildren(){return this._children}get initiated(){return this._initiated}get props(){return this.getAttributes()}get virtual(){return this._virtual}set props(e){this.setAttributes(e)}constructor(){if(super(),this._initiated=!1,this._template=null,this._children=void 0,this._rendering=!1,this._observer=null,this._virtual=!1,!W.default.has(this))throw Et.default.for("Component not mapped.")}adoptedCallback(){this.render(),U.default.emit("adopt",this)}connectedCallback(){this.wait(),U.default.emit("connect",this)}disconnectedCallback(){U.default.emit("disconnect",this)}getAttribute(e){return this.element.getAttribute(e)}getAttributes(){return Object.assign({},this.element.attributes)}getParentComponent(){let e=this.parentElement;for(;e;){if(e instanceof t)return e;e=e.parentElement}return null}hasAttribute(e){return this.element.hasAttribute(e)}register(e={},r=[]){W.default.has(this)?W.default.get(this).setAttributes(e):W.default.register(this,e);for(let[i,n]of Object.entries(e))typeof n=="string"?super.setAttribute(i,n):n===!0&&super.setAttribute(i,i);this._children=r,this._virtual=!0,this.connectedCallback()}removeAttribute(e){this.hasAttribute(e)&&this.element.removeAttribute(e),super.hasAttribute(e)&&super.removeAttribute(e)}render(){let e=this.getParentComponent();if(e&&!e.initiated)return;if(this._rendering)return;this._rendering=!0;let r=ze.default.get("current");ze.default.set("current",this);let i=this.styles();this._template?U.default.emit("unmounted",this):this._template=this.template();let n=this._template().filter(Boolean);if(i.length===0)this.textContent="",n.forEach(u=>this.appendChild(u));else{this.shadowRoot||this.attachShadow({mode:"open"});let u=this.shadowRoot;this.textContent="",u.textContent="";let y=document.createElement("style");y.innerText=i,u.appendChild(y),n.forEach(d=>{var k;return(k=this.shadowRoot)===null||k===void 0?void 0:k.appendChild(d)})}return r?ze.default.set("current",r):ze.default.delete("current"),this._initiated=!0,this._rendering=!1,U.default.emit("mounted",this),this.shadowRoot?this.shadowRoot.innerHTML:this.innerHTML}setAttribute(e,r){this.element.setAttribute(e,r),(typeof r=="string"||r===!0)&&super.setAttribute(e,r)}setAttributes(e){this.element.setAttributes(e)}wait(){if(document.readyState!=="loading")this._update();else{let e=()=>{this._update(),U.default.unbind("ready",e)};U.default.on("ready",e)}}_toNodeList(e){return e instanceof Node?[e]:Array.isArray(e)&&e.every(r=>r instanceof Node)?e:[W.default.createText(String(e))]}_update(){typeof this._children>"u"&&(this._children=Array.from(this.childNodes||[])),this._initiated||this.render()}};ve.default=ot});var te=j(Te=>{"use strict";var Lt=Te&&Te.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Te,"__esModule",{value:!0});Te.default=dr;var pr=Lt(ye()),cr=Lt(ee());function dr(t=null,e=!1){if(!t&&(t=cr.default.get("current"),!t)){if(!e)throw pr.default.for("Not called within a Temple component");return null}return t}});var Rt=j(_e=>{"use strict";var ur=_e&&_e.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(_e,"__esModule",{value:!0});var mr=ur(ee());function fr(t){let e=mr.default.get("env")||{};return t?e[t]||null:e}_e.default=fr});var pt=j(we=>{"use strict";var Ft=we&&we.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(we,"__esModule",{value:!0});we.default=yr;var hr=Ft(te()),gr=Ft(ee());function yr(t=null){let e=(0,hr.default)(t,!0);return typeof e=="string"?gr.default.get("props")||{}:e?e.props:{}}});var Dt=j(re=>{"use strict";var St=re&&re.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(re,"__esModule",{value:!0});re.classlist=kr;re.default=vr;var br=St(te()),xr=St(pt());function kr(t=null){var e;if(t==="body")return document.body.classList;if(t==="head")return document.head.classList;if(t==="document")return(e=document.body.parentElement)===null||e===void 0?void 0:e.classList;let r=(0,br.default)(t);return r?.classList}function vr(t=null){return(0,xr.default)(t).class}});var Ct=j(Z=>{"use strict";var Tr=Z&&Z.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Z,"__esModule",{value:!0});Z.innerHTML=wr;Z.innerText=Er;Z.default=ct;var _r=Tr(te());function wr(t=null){let e=ct(t),r=document.createElement("template");return r.append(...e.map(i=>i.cloneNode(!0))),r.innerHTML}function Er(t=null){let e=ct(t),r=document.createElement("template");return r.append(...e.map(i=>i.cloneNode(!0))),r.innerText}function ct(t=null){let e=(0,_r.default)(t,!0);return typeof e!="string"&&e?e.originalChildren||[]:[]}});var jt=j(X=>{"use strict";var Pt=X&&X.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(X,"__esModule",{value:!0});X.SignalRegistry=void 0;X.default=Rr;var Ar=Pt(te()),Lr=Pt(ye()),ne=class t{static observe(e,r){let i={getter:()=>u.raw,setter:d=>d},n=new Set,u={raw:r,change(d){n.add(d)},getter(d){return i.getter=d,u},setter(d){return i.setter=d,u}};Object.defineProperty(u,"value",{get(){return i.getter()},set(d){let k=i.setter(d),x=t.serialize(k)!==t.serialize(u.raw);u.raw=k,x&&(n.forEach(f=>f(k)),e.render())}});let y=this._observers.get(e);return y?(y.observed++,y.values.push(u)):this._observers.set(e,{observed:1,values:[u]}),u}static observer(e){return this._observers.get(e)||null}static serialize(e){return JSON.stringify(e)}};X.SignalRegistry=ne;ne._observers=new Map;function Rr(t,e=null){let r=(0,Ar.default)(e);if(!r.initiated)return ne.observe(r,t);let i=ne.observer(r);if(!i)throw Lr.default.for("Signal state mismatch");return i.values[i.observed++%i.values.length]}});var ut=j(b=>{"use strict";var Fr=b&&b.__createBinding||(Object.create?function(t,e,r,i){i===void 0&&(i=r);var n=Object.getOwnPropertyDescriptor(e,r);(!n||("get"in n?!e.__esModule:n.writable||n.configurable))&&(n={enumerable:!0,get:function(){return e[r]}}),Object.defineProperty(t,i,n)}:function(t,e,r,i){i===void 0&&(i=r),t[i]=e[r]}),Sr=b&&b.__setModuleDefault||(Object.create?function(t,e){Object.defineProperty(t,"default",{enumerable:!0,value:e})}:function(t,e){t.default=e}),Ee=b&&b.__importStar||function(t){if(t&&t.__esModule)return t;var e={};if(t!=null)for(var r in t)r!=="default"&&Object.prototype.hasOwnProperty.call(t,r)&&Fr(e,t,r);return Sr(e,t),e},Y=b&&b.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(b,"__esModule",{value:!0});b.SignalRegistry=b.TempleException=b.TempleEmitter=b.TempleElement=b.TempleRegistry=b.TempleComponent=b.TempleDataMap=b.emitter=b.signal=b.innerHTML=b.innerText=b.children=b.classnames=b.classlist=b.props=b.env=b.data=b.component=void 0;var Dr=Y(ye());b.TempleException=Dr.default;var Cr=Y(At());b.TempleComponent=Cr.default;var Pr=Y(He());b.TempleRegistry=Pr.default;var jr=Y(lt());b.TempleElement=jr.default;var Mt=Ee($e());b.emitter=Mt.default;Object.defineProperty(b,"TempleEmitter",{enumerable:!0,get:function(){return Mt.TempleEmitter}});var Mr=Y(te());b.component=Mr.default;var Nt=Ee(ee());b.data=Nt.default;Object.defineProperty(b,"TempleDataMap",{enumerable:!0,get:function(){return Nt.TempleDataMap}});var Nr=Y(Rt());b.env=Nr.default;var Ir=Y(pt());b.props=Ir.default;var It=Ee(Dt());b.classnames=It.default;Object.defineProperty(b,"classlist",{enumerable:!0,get:function(){return It.classlist}});var dt=Ee(Ct());b.children=dt.default;Object.defineProperty(b,"innerHTML",{enumerable:!0,get:function(){return dt.innerHTML}});Object.defineProperty(b,"innerText",{enumerable:!0,get:function(){return dt.innerText}});var Ot=Ee(jt());b.signal=Ot.default;Object.defineProperty(b,"SignalRegistry",{enumerable:!0,get:function(){return Ot.SignalRegistry}})});var N=j((sn,$t)=>{$t.exports={...ut()}});var O=j((an,Ht)=>{Ht.exports={...ut()}});var mt=j((fn,Ve)=>{var Or=typeof window<"u"?window:typeof WorkerGlobalScope<"u"&&self instanceof WorkerGlobalScope?self:{};var m=function(t){var e=/(?:^|\s)lang(?:uage)?-([\w-]+)(?=\s|$)/i,r=0,i={},n={manual:t.Prism&&t.Prism.manual,disableWorkerMessageHandler:t.Prism&&t.Prism.disableWorkerMessageHandler,util:{encode:function l(a){return a instanceof u?new u(a.type,l(a.content),a.alias):Array.isArray(a)?a.map(l):a.replace(/&/g,"&").replace(/"u")return null;if("currentScript"in document)return document.currentScript;try{throw new Error}catch(c){var l=(/at [^(\r\n]*\((.*):[^:]+:[^:]+\)$/i.exec(c.stack)||[])[1];if(l){var a=document.getElementsByTagName("script");for(var p in a)if(a[p].src==l)return a[p]}return null}},isActive:function(l,a,p){for(var c="no-"+a;l;){var o=l.classList;if(o.contains(a))return!0;if(o.contains(c))return!1;l=l.parentElement}return!!p}},languages:{plain:i,plaintext:i,text:i,txt:i,extend:function(l,a){var p=n.util.clone(n.languages[l]);for(var c in a)p[c]=a[c];return p},insertBefore:function(l,a,p,c){c=c||n.languages;var o=c[l],h={};for(var v in o)if(o.hasOwnProperty(v)){if(v==a)for(var g in p)p.hasOwnProperty(g)&&(h[g]=p[g]);p.hasOwnProperty(v)||(h[v]=o[v])}var F=c[l];return c[l]=h,n.languages.DFS(n.languages,function(C,z){z===F&&C!=l&&(this[C]=h)}),h},DFS:function l(a,p,c,o){o=o||{};var h=n.util.objId;for(var v in a)if(a.hasOwnProperty(v)){p.call(a,v,a[v],c||v);var g=a[v],F=n.util.type(g);F==="Object"&&!o[h(g)]?(o[h(g)]=!0,l(g,p,null,o)):F==="Array"&&!o[h(g)]&&(o[h(g)]=!0,l(g,p,v,o))}}},plugins:{},highlightAll:function(l,a){n.highlightAllUnder(document,l,a)},highlightAllUnder:function(l,a,p){var c={callback:p,container:l,selector:'code[class*="language-"], [class*="language-"] code, code[class*="lang-"], [class*="lang-"] code'};n.hooks.run("before-highlightall",c),c.elements=Array.prototype.slice.apply(c.container.querySelectorAll(c.selector)),n.hooks.run("before-all-elements-highlight",c);for(var o=0,h;h=c.elements[o++];)n.highlightElement(h,a===!0,c.callback)},highlightElement:function(l,a,p){var c=n.util.getLanguage(l),o=n.languages[c];n.util.setLanguage(l,c);var h=l.parentElement;h&&h.nodeName.toLowerCase()==="pre"&&n.util.setLanguage(h,c);var v=l.textContent,g={element:l,language:c,grammar:o,code:v};function F(z){g.highlightedCode=z,n.hooks.run("before-insert",g),g.element.innerHTML=g.highlightedCode,n.hooks.run("after-highlight",g),n.hooks.run("complete",g),p&&p.call(g.element)}if(n.hooks.run("before-sanity-check",g),h=g.element.parentElement,h&&h.nodeName.toLowerCase()==="pre"&&!h.hasAttribute("tabindex")&&h.setAttribute("tabindex","0"),!g.code){n.hooks.run("complete",g),p&&p.call(g.element);return}if(n.hooks.run("before-highlight",g),!g.grammar){F(n.util.encode(g.code));return}if(a&&t.Worker){var C=new Worker(n.filename);C.onmessage=function(z){F(z.data)},C.postMessage(JSON.stringify({language:g.language,code:g.code,immediateClose:!0}))}else F(n.highlight(g.code,g.grammar,g.language))},highlight:function(l,a,p){var c={code:l,grammar:a,language:p};if(n.hooks.run("before-tokenize",c),!c.grammar)throw new Error('The language "'+c.language+'" has no grammar.');return c.tokens=n.tokenize(c.code,c.grammar),n.hooks.run("after-tokenize",c),u.stringify(n.util.encode(c.tokens),c.language)},tokenize:function(l,a){var p=a.rest;if(p){for(var c in p)a[c]=p[c];delete a.rest}var o=new k;return x(o,o.head,l),d(l,o,a,o.head,0),_(o)},hooks:{all:{},add:function(l,a){var p=n.hooks.all;p[l]=p[l]||[],p[l].push(a)},run:function(l,a){var p=n.hooks.all[l];if(!(!p||!p.length))for(var c=0,o;o=p[c++];)o(a)}},Token:u};t.Prism=n;function u(l,a,p,c){this.type=l,this.content=a,this.alias=p,this.length=(c||"").length|0}u.stringify=function l(a,p){if(typeof a=="string")return a;if(Array.isArray(a)){var c="";return a.forEach(function(F){c+=l(F,p)}),c}var o={type:a.type,content:l(a.content,p),tag:"span",classes:["token",a.type],attributes:{},language:p},h=a.alias;h&&(Array.isArray(h)?Array.prototype.push.apply(o.classes,h):o.classes.push(h)),n.hooks.run("wrap",o);var v="";for(var g in o.attributes)v+=" "+g+'="'+(o.attributes[g]||"").replace(/"/g,""")+'"';return"<"+o.tag+' class="'+o.classes.join(" ")+'"'+v+">"+o.content+""};function y(l,a,p,c){l.lastIndex=a;var o=l.exec(p);if(o&&c&&o[1]){var h=o[1].length;o.index+=h,o[0]=o[0].slice(h)}return o}function d(l,a,p,c,o,h){for(var v in p)if(!(!p.hasOwnProperty(v)||!p[v])){var g=p[v];g=Array.isArray(g)?g:[g];for(var F=0;F=h.reach);q+=P.value.length,P=P.next){var Q=P.value;if(a.length>l.length)return;if(!(Q instanceof u)){var Ce=1,B;if(bt){if(B=y(xt,q,l,yt),!B||B.index>=l.length)break;var Pe=B.index,Ut=B.index+B[0].length,J=q;for(J+=P.value.length;Pe>=J;)P=P.next,J+=P.value.length;if(J-=P.value.length,q=J,P.value instanceof u)continue;for(var ge=P;ge!==a.tail&&(Jh.reach&&(h.reach=tt);var Me=P.prev;et&&(Me=x(a,Me,et),q+=et.length),f(a,Me,Ce);var Zt=new u(v,z?n.tokenize(je,z):je,Gt,je);if(P=x(a,Me,Zt),kt&&x(a,P,kt),Ce>1){var rt={cause:v+","+F,reach:tt};d(l,a,p,P.prev,q,rt),h&&rt.reach>h.reach&&(h.reach=rt.reach)}}}}}}function k(){var l={value:null,prev:null,next:null},a={value:null,prev:l,next:null};l.next=a,this.head=l,this.tail=a,this.length=0}function x(l,a,p){var c=a.next,o={value:p,prev:a,next:c};return a.next=o,c.prev=o,l.length++,o}function f(l,a,p){for(var c=a.next,o=0;o/,greedy:!0},prolog:{pattern:/<\?[\s\S]+?\?>/,greedy:!0},doctype:{pattern:/"'[\]]|"[^"]*"|'[^']*')+(?:\[(?:[^<"'\]]|"[^"]*"|'[^']*'|<(?!!--)|)*\]\s*)?>/i,greedy:!0,inside:{"internal-subset":{pattern:/(^[^\[]*\[)[\s\S]+(?=\]>$)/,lookbehind:!0,greedy:!0,inside:null},string:{pattern:/"[^"]*"|'[^']*'/,greedy:!0},punctuation:/^$|[[\]]/,"doctype-tag":/^DOCTYPE/i,name:/[^\s<>'"]+/}},cdata:{pattern://i,greedy:!0},tag:{pattern:/<\/?(?!\d)[^\s>\/=$<%]+(?:\s(?:\s*[^\s>\/=]+(?:\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))|(?=[\s/>])))+)?\s*\/?>/,greedy:!0,inside:{tag:{pattern:/^<\/?[^\s>\/]+/,inside:{punctuation:/^<\/?/,namespace:/^[^\s>\/:]+:/}},"special-attr":[],"attr-value":{pattern:/=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+)/,inside:{punctuation:[{pattern:/^=/,alias:"attr-equals"},{pattern:/^(\s*)["']|["']$/,lookbehind:!0}]}},punctuation:/\/?>/,"attr-name":{pattern:/[^\s>\/]+/,inside:{namespace:/^[^\s>\/:]+:/}}}},entity:[{pattern:/&[\da-z]{1,8};/i,alias:"named-entity"},/&#x?[\da-f]{1,8};/i]};m.languages.markup.tag.inside["attr-value"].inside.entity=m.languages.markup.entity;m.languages.markup.doctype.inside["internal-subset"].inside=m.languages.markup;m.hooks.add("wrap",function(t){t.type==="entity"&&(t.attributes.title=t.content.replace(/&/,"&"))});Object.defineProperty(m.languages.markup.tag,"addInlined",{value:function(e,r){var i={};i["language-"+r]={pattern:/(^$)/i,lookbehind:!0,inside:m.languages[r]},i.cdata=/^$/i;var n={"included-cdata":{pattern://i,inside:i}};n["language-"+r]={pattern:/[\s\S]+/,inside:m.languages[r]};var u={};u[e]={pattern:RegExp(/(<__[^>]*>)(?:))*\]\]>|(?!)/.source.replace(/__/g,function(){return e}),"i"),lookbehind:!0,greedy:!0,inside:n},m.languages.insertBefore("markup","cdata",u)}});Object.defineProperty(m.languages.markup.tag,"addAttribute",{value:function(t,e){m.languages.markup.tag.inside["special-attr"].push({pattern:RegExp(/(^|["'\s])/.source+"(?:"+t+")"+/\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))/.source,"i"),lookbehind:!0,inside:{"attr-name":/^[^\s=]+/,"attr-value":{pattern:/=[\s\S]+/,inside:{value:{pattern:/(^=\s*(["']|(?!["'])))\S[\s\S]*(?=\2$)/,lookbehind:!0,alias:[e,"language-"+e],inside:m.languages[e]},punctuation:[{pattern:/^=/,alias:"attr-equals"},/"|'/]}}}})}});m.languages.html=m.languages.markup;m.languages.mathml=m.languages.markup;m.languages.svg=m.languages.markup;m.languages.xml=m.languages.extend("markup",{});m.languages.ssml=m.languages.xml;m.languages.atom=m.languages.xml;m.languages.rss=m.languages.xml;(function(t){var e=/(?:"(?:\\(?:\r\n|[\s\S])|[^"\\\r\n])*"|'(?:\\(?:\r\n|[\s\S])|[^'\\\r\n])*')/;t.languages.css={comment:/\/\*[\s\S]*?\*\//,atrule:{pattern:RegExp("@[\\w-](?:"+/[^;{\s"']|\s+(?!\s)/.source+"|"+e.source+")*?"+/(?:;|(?=\s*\{))/.source),inside:{rule:/^@[\w-]+/,"selector-function-argument":{pattern:/(\bselector\s*\(\s*(?![\s)]))(?:[^()\s]|\s+(?![\s)])|\((?:[^()]|\([^()]*\))*\))+(?=\s*\))/,lookbehind:!0,alias:"selector"},keyword:{pattern:/(^|[^\w-])(?:and|not|only|or)(?![\w-])/,lookbehind:!0}}},url:{pattern:RegExp("\\burl\\((?:"+e.source+"|"+/(?:[^\\\r\n()"']|\\[\s\S])*/.source+")\\)","i"),greedy:!0,inside:{function:/^url/i,punctuation:/^\(|\)$/,string:{pattern:RegExp("^"+e.source+"$"),alias:"url"}}},selector:{pattern:RegExp(`(^|[{}\\s])[^{}\\s](?:[^{};"'\\s]|\\s+(?![\\s{])|`+e.source+")*(?=\\s*\\{)"),lookbehind:!0},string:{pattern:e,greedy:!0},property:{pattern:/(^|[^-\w\xA0-\uFFFF])(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*(?=\s*:)/i,lookbehind:!0},important:/!important\b/i,function:{pattern:/(^|[^-a-z0-9])[-a-z0-9]+(?=\()/i,lookbehind:!0},punctuation:/[(){};:,]/},t.languages.css.atrule.inside.rest=t.languages.css;var r=t.languages.markup;r&&(r.tag.addInlined("style","css"),r.tag.addAttribute("style","css"))})(m);m.languages.clike={comment:[{pattern:/(^|[^\\])\/\*[\s\S]*?(?:\*\/|$)/,lookbehind:!0,greedy:!0},{pattern:/(^|[^\\:])\/\/.*/,lookbehind:!0,greedy:!0}],string:{pattern:/(["'])(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/,greedy:!0},"class-name":{pattern:/(\b(?:class|extends|implements|instanceof|interface|new|trait)\s+|\bcatch\s+\()[\w.\\]+/i,lookbehind:!0,inside:{punctuation:/[.\\]/}},keyword:/\b(?:break|catch|continue|do|else|finally|for|function|if|in|instanceof|new|null|return|throw|try|while)\b/,boolean:/\b(?:false|true)\b/,function:/\b\w+(?=\()/,number:/\b0x[\da-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:e[+-]?\d+)?/i,operator:/[<>]=?|[!=]=?=?|--?|\+\+?|&&?|\|\|?|[?*/~^%]/,punctuation:/[{}[\];(),.:]/};m.languages.javascript=m.languages.extend("clike",{"class-name":[m.languages.clike["class-name"],{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$A-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\.(?:constructor|prototype))/,lookbehind:!0}],keyword:[{pattern:/((?:^|\})\s*)catch\b/,lookbehind:!0},{pattern:/(^|[^.]|\.\.\.\s*)\b(?:as|assert(?=\s*\{)|async(?=\s*(?:function\b|\(|[$\w\xA0-\uFFFF]|$))|await|break|case|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally(?=\s*(?:\{|$))|for|from(?=\s*(?:['"]|$))|function|(?:get|set)(?=\s*(?:[#\[$\w\xA0-\uFFFF]|$))|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)\b/,lookbehind:!0}],function:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*(?:\.\s*(?:apply|bind|call)\s*)?\()/,number:{pattern:RegExp(/(^|[^\w$])/.source+"(?:"+(/NaN|Infinity/.source+"|"+/0[bB][01]+(?:_[01]+)*n?/.source+"|"+/0[oO][0-7]+(?:_[0-7]+)*n?/.source+"|"+/0[xX][\dA-Fa-f]+(?:_[\dA-Fa-f]+)*n?/.source+"|"+/\d+(?:_\d+)*n/.source+"|"+/(?:\d+(?:_\d+)*(?:\.(?:\d+(?:_\d+)*)?)?|\.\d+(?:_\d+)*)(?:[Ee][+-]?\d+(?:_\d+)*)?/.source)+")"+/(?![\w$])/.source),lookbehind:!0},operator:/--|\+\+|\*\*=?|=>|&&=?|\|\|=?|[!=]==|<<=?|>>>?=?|[-+*/%&|^!=<>]=?|\.{3}|\?\?=?|\?\.?|[~:]/});m.languages.javascript["class-name"][0].pattern=/(\b(?:class|extends|implements|instanceof|interface|new)\s+)[\w.\\]+/;m.languages.insertBefore("javascript","keyword",{regex:{pattern:RegExp(/((?:^|[^$\w\xA0-\uFFFF."'\])\s]|\b(?:return|yield))\s*)/.source+/\//.source+"(?:"+/(?:\[(?:[^\]\\\r\n]|\\.)*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}/.source+"|"+/(?:\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.)*\])*\])*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}v[dgimyus]{0,7}/.source+")"+/(?=(?:\s|\/\*(?:[^*]|\*(?!\/))*\*\/)*(?:$|[\r\n,.;:})\]]|\/\/))/.source),lookbehind:!0,greedy:!0,inside:{"regex-source":{pattern:/^(\/)[\s\S]+(?=\/[a-z]*$)/,lookbehind:!0,alias:"language-regex",inside:m.languages.regex},"regex-delimiter":/^\/|\/$/,"regex-flags":/^[a-z]+$/}},"function-variable":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*[=:]\s*(?:async\s*)?(?:\bfunction\b|(?:\((?:[^()]|\([^()]*\))*\)|(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)\s*=>))/,alias:"function"},parameter:[{pattern:/(function(?:\s+(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)?\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\))/,lookbehind:!0,inside:m.languages.javascript},{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$a-z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*=>)/i,lookbehind:!0,inside:m.languages.javascript},{pattern:/(\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*=>)/,lookbehind:!0,inside:m.languages.javascript},{pattern:/((?:\b|\s|^)(?!(?:as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)(?![$\w\xA0-\uFFFF]))(?:(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*)\(\s*|\]\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*\{)/,lookbehind:!0,inside:m.languages.javascript}],constant:/\b[A-Z](?:[A-Z_]|\dx?)*\b/});m.languages.insertBefore("javascript","string",{hashbang:{pattern:/^#!.*/,greedy:!0,alias:"comment"},"template-string":{pattern:/`(?:\\[\s\S]|\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}|(?!\$\{)[^\\`])*`/,greedy:!0,inside:{"template-punctuation":{pattern:/^`|`$/,alias:"string"},interpolation:{pattern:/((?:^|[^\\])(?:\\{2})*)\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}/,lookbehind:!0,inside:{"interpolation-punctuation":{pattern:/^\$\{|\}$/,alias:"punctuation"},rest:m.languages.javascript}},string:/[\s\S]+/}},"string-property":{pattern:/((?:^|[,{])[ \t]*)(["'])(?:\\(?:\r\n|[\s\S])|(?!\2)[^\\\r\n])*\2(?=\s*:)/m,lookbehind:!0,greedy:!0,alias:"property"}});m.languages.insertBefore("javascript","operator",{"literal-property":{pattern:/((?:^|[,{])[ \t]*)(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*:)/m,lookbehind:!0,alias:"property"}});m.languages.markup&&(m.languages.markup.tag.addInlined("script","javascript"),m.languages.markup.tag.addAttribute(/on(?:abort|blur|change|click|composition(?:end|start|update)|dblclick|error|focus(?:in|out)?|key(?:down|up)|load|mouse(?:down|enter|leave|move|out|over|up)|reset|resize|scroll|select|slotchange|submit|unload|wheel)/.source,"javascript"));m.languages.js=m.languages.javascript;(function(){if(typeof m>"u"||typeof document>"u")return;Element.prototype.matches||(Element.prototype.matches=Element.prototype.msMatchesSelector||Element.prototype.webkitMatchesSelector);var t="Loading\u2026",e=function(L,T){return"\u2716 Error "+L+" while fetching file: "+T},r="\u2716 Error: File does not exist or is empty",i={js:"javascript",py:"python",rb:"ruby",ps1:"powershell",psm1:"powershell",sh:"bash",bat:"batch",h:"c",tex:"latex"},n="data-src-status",u="loading",y="loaded",d="failed",k="pre[data-src]:not(["+n+'="'+y+'"]):not(['+n+'="'+u+'"])';function x(L,T,R){var l=new XMLHttpRequest;l.open("GET",L,!0),l.onreadystatechange=function(){l.readyState==4&&(l.status<400&&l.responseText?T(l.responseText):l.status>=400?R(e(l.status,l.statusText)):R(r))},l.send(null)}function f(L){var T=/^\s*(\d+)\s*(?:(,)\s*(?:(\d+)\s*)?)?$/.exec(L||"");if(T){var R=Number(T[1]),l=T[2],a=T[3];return l?a?[R,Number(a)]:[R,void 0]:[R,R]}}m.hooks.add("before-highlightall",function(L){L.selector+=", "+k}),m.hooks.add("before-sanity-check",function(L){var T=L.element;if(T.matches(k)){L.code="",T.setAttribute(n,u);var R=T.appendChild(document.createElement("CODE"));R.textContent=t;var l=T.getAttribute("data-src"),a=L.language;if(a==="none"){var p=(/\.(\w+)$/.exec(l)||[,"none"])[1];a=i[p]||p}m.util.setLanguage(R,a),m.util.setLanguage(T,a);var c=m.plugins.autoloader;c&&c.loadLanguages(a),x(l,function(o){T.setAttribute(n,y);var h=f(T.getAttribute("data-range"));if(h){var v=o.split(/\r\n?|\n/g),g=h[0],F=h[1]==null?v.length:h[1];g<0&&(g+=v.length),g=Math.max(0,Math.min(g-1,v.length)),F<0&&(F+=v.length),F=Math.max(0,Math.min(F,v.length)),o=v.slice(g,F).join(`
+`),T.hasAttribute("data-start")||T.setAttribute("data-start",String(g+1))}R.textContent=o,m.highlightElement(R)},function(o){T.setAttribute(n,d),R.textContent=o})}}),m.plugins.fileHighlight={highlight:function(T){for(var R=(T||document).querySelectorAll(k),l=0,a;a=R[l++];)m.highlightElement(a)}};var _=!1;m.fileHighlight=function(){_||(console.warn("Prism.fileHighlight is deprecated. Use `Prism.plugins.fileHighlight.highlight` instead."),_=!0),m.plugins.fileHighlight.highlight.apply(this,arguments)}})()});var zr={};er(zr,{BUILD_ID:()=>qr,TempleComponent:()=>D.TempleComponent,TempleElement:()=>D.TempleElement,TempleEmitter:()=>D.TempleEmitter,TempleException:()=>D.TempleException,TempleRegistry:()=>D.TempleRegistry,children:()=>D.children,components:()=>Br,data:()=>D.data,emitter:()=>D.emitter,props:()=>D.props,signal:()=>D.signal});var $=w(N());var Bt=w(N()),H=w(O()),se=class extends Bt.TempleComponent{static component=["layout","Layout_9f3ab204ce271feaf6f7"];styles(){return""}template(){(0,H.classlist)().add("relative","w-full","vh","scroll-hidden");let e=(0,H.children)(),r=e.find(f=>f.nodeName.endsWith("PANEL-MAIN")),i=e.find(f=>f.nodeName.endsWith("PANEL-HEAD")),n=e.find(f=>f.nodeName.endsWith("PANEL-FOOT")),u=e.find(f=>f.nodeName.endsWith("PANEL-LEFT")),y=e.find(f=>f.nodeName.endsWith("PANEL-RIGHT")),d={head:!!i,foot:!!n,left:!!u,right:!!y},k=new Set,x={left:!1,right:!1,change:f=>k.add(f)};return r&&H.TempleRegistry.get(r).setAttribute("show",x).setAttribute("layout",d),i&&H.TempleRegistry.get(i).setAttribute("show",x).setAttribute("layout",d),n&&H.TempleRegistry.get(n).setAttribute("show",x).setAttribute("layout",d),u&&H.TempleRegistry.get(u).setAttribute("show",x).setAttribute("layout",d),y&&H.TempleRegistry.get(y).setAttribute("show",x).setAttribute("layout",d),this.toggle=f=>{x[f]=!x[f],k.forEach(_=>_())},()=>[H.TempleRegistry.createText(`
+`,!1),...this._toNodeList(e)]}};var Ae=w(N()),Ge=w(O()),ie=class extends Ae.TempleComponent{static component=["head","Head_2bf4dff19bc88ba4138b"];styles(){return""}template(){let{layout:e,show:r}=this.element.attributes,i=(0,Ge.classlist)(),n=u=>{this.classList.add("absolute","top-0","right-0","h-60","transition-500"),e?.left?(this.classList.remove("left-0"),this.classList.add("left-226")):this.classList.add("left-0"),r.left?(this.classList.remove("md-left-0"),this.classList.add("md-left-226")):(this.classList.remove("md-left-226"),this.classList.add("md-left-0"))};return r.change(n),n(),()=>[Ae.TempleRegistry.createText(`
+`,!1),Ae.TempleRegistry.createElement("header",{class:"block w-full h-full relative"},[...this._toNodeList((0,Ge.children)())]).element]}};var Le=w(N()),We=w(O()),ae=class extends Le.TempleComponent{static component=["left","Left_f4ab589e043eee17d229"];styles(){return""}template(){let{layout:e,show:r}=this.element.attributes,i=(0,We.classlist)(),n=u=>{this.classList.add("w-226","absolute","bottom-0","left-0","top-0","transition-500"),r.left?(this.classList.remove("md-left--226"),this.classList.add("md-left-0")):this.classList.add("md-left--226")};return r.change(n),n(),()=>[Le.TempleRegistry.createText(`
+`,!1),Le.TempleRegistry.createElement("aside",{class:"block w-full h-full relative"},[...this._toNodeList((0,We.children)())]).element]}};var Re=w(N()),Ue=w(O()),le=class extends Re.TempleComponent{static component=["right","Right_4ce97029791442c57f8d"];styles(){return""}template(){let{layout:e,show:r}=this.element.attributes,i=(0,Ue.classlist)(),n=u=>{this.classList.add("w-200","absolute","right-0","transition-500"),e?.foot?(this.classList.remove("bottom-0"),this.classList.add("bottom-60")):this.classList.add("bottom-0"),e?.head?(this.classList.remove("top-0"),this.classList.add("top-60")):this.classList.add("top-0"),r.right?(this.classList.remove("md-right--200"),this.classList.add("md-right-0")):this.classList.add("md-right--200")};return r.change(n),n(),()=>[Re.TempleRegistry.createText(`
+`,!1),Re.TempleRegistry.createElement("aside",{class:"block w-full h-full relative"},[...this._toNodeList((0,Ue.children)())]).element]}};var Fe=w(N()),Ze=w(O()),oe=class extends Fe.TempleComponent{static component=["main","Main_847772763f4518728ede"];styles(){return""}template(){let{layout:e,show:r}=this.element.attributes,i=(0,Ze.classlist)(),n=u=>{this.classList.add("absolute","transition-500"),e?.head?(this.classList.remove("top-0"),this.classList.add("top-60")):this.classList.add("top-0"),e?.foot?(this.classList.remove("bottom-0"),this.classList.add("bottom-60")):this.classList.add("bottom-0"),e?.left?(this.classList.remove("left-0"),this.classList.add("left-226")):this.classList.add("left-0"),e?.right?(this.classList.remove("right-0"),this.classList.add("right-200")):this.classList.add("right-0"),r.left?(this.classList.remove("md-left-0"),this.classList.add("md-left-226")):(this.classList.remove("md-left-226"),this.classList.add("md-left-0")),r.right?(this.classList.remove("md-right-0"),this.classList.add("md-right-200")):(this.classList.remove("md-right-200"),this.classList.add("md-right-0"))};return r.change(n),n(),()=>[Fe.TempleRegistry.createText(`
+`,!1),Fe.TempleRegistry.createElement("main",{class:"block w-full h-full relative"},[...this._toNodeList((0,Ze.children)())]).element]}};var Xe=w(N()),ce=w(O()),pe=class extends Xe.TempleComponent{static component=["alert","Alert_f0fe98801b4b833c4233"];styles(){return""}template(){let{curved:e,rounded:r,pill:i,info:n,warning:u,success:y,error:d,muted:k,primary:x,color:f,secondary:_,outline:L,transparent:T,solid:R,style:l,class:a,...p}=(0,ce.props)(),c=(0,ce.component)(),o=document.createElement("div");(0,ce.children)().forEach(v=>o.appendChild(v)),c.classList.add("block"),o.classList.add("block","p-16"),e?o.classList.add("curved"):r?o.classList.add("rounded"):i&&o.classList.add("pill");let h=L?"outline":T?"transparent":"solid";return h==="outline"||h==="transparent"?(o.classList.add("bd-solid","bd-thin"),h==="outline"&&o.classList.add("bg-white"),f?(o.style.color=f,o.style.borderColor=f):n?o.classList.add("bd-info","tx-info"):u?o.classList.add("bd-warning","tx-warning"):y?o.classList.add("bd-success","tx-success"):d?o.classList.add("bd-error","tx-error"):k?o.classList.add("bd-muted","tx-muted"):x?o.classList.add("bd-primary","tx-primary"):_&&o.classList.add("bd-secondary","tx-secondary")):(o.classList.add("tx-white"),f?o.style.backgroundColor=f:n?o.classList.add("bg-info"):u?o.classList.add("bg-warning"):y?o.classList.add("bg-success"):d?o.classList.add("bg-error"):k?o.classList.add("bg-muted"):x?o.classList.add("bg-primary"):_&&o.classList.add("bg-secondary")),()=>[Xe.TempleRegistry.createText(`
+`,!1),...this._toNodeList([o])]}};var Se=w(N()),Ye=w(O()),de=class extends Se.TempleComponent{static component=["docs","Docs_40562a7bb56d70d971df"];styles(){return""}template(){return(0,Ye.classlist)().add("block","w-full","h-full","scroll-y-auto","scroll-x-hidden"),()=>[Se.TempleRegistry.createText(`
+`,!1),Se.TempleRegistry.createElement("article",{class:"block p-10 tx-t-1"},[...this._toNodeList((0,Ye.children)())]).element]}};var s=w(N());var E=w(N()),ft=w(mt()),qt=w(O()),V=class extends E.TempleComponent{static component=["code","Code_6f36bc13bb6a166c7abc"];styles(){return`:host {
     display: block;
     font-size: 14px;
     line-height: 20px;
   }
   :host([inline]) {
-    display: inline;
+    display: inline !important;
   }
   :host([inline]),
   :host([inline]) > pre,
   :host([inline]) > pre > code {
-    display: inline;
+    display: inline !important;
   }
   .snippet {
     background-color: #000000;
     color: #ABB2BF;
+    height: 100%;
     margin: 0;
+    overflow: auto;
     padding: 0;
   }
 
@@ -73,32 +82,30 @@ var TempleAPI=(()=>{var Ft=Object.create;var xe=Object.defineProperty;var Rt=Obj
 
   .terminal {
     background-color: #000000;
+    font-family: 'Courier New', Courier, monospace;
     font-size: 15px;
+    height: 100%;
+    overflow: auto;
     padding: 10px;
   }
   .terminal span {
     color: #00FF00;
-  }`}template(){let e=this.props,{lang:r="markup",numbers:l=!1,inline:i=!1,trim:g=!1,ltrim:h=!1,rtrim:d=!1,detab:x=0}=e,k=(0,Tt.children)(),T=k[0]?.textContent||"";x&&(T=T.replace(new RegExp(`\\n {${x}}`,"g"),`
-`)),g?T=T.trim():h?T=T.replace(/^\s+/,""):d&&(T=T.replace(/\s+$/,""));let E=_=>{if(!T)return;let v=Ge.default.highlight(T,Ge.default.languages[r],r);if(_.detail.target.innerHTML=v,l){let w=v.match(/\n(?!$)/g),n=w?w.length+1:1,s=new Array(n+1).join(""),o=document.createElement("span");o.setAttribute("aria-hidden","true"),o.className="line-numbers-rows",o.innerHTML=s,_.detail.target.appendChild(o)}};return()=>[A.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism.min.css"}).element,A.TempleRegistry.createText(`
-`,!1),A.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism-tomorrow.min.css"}).element,A.TempleRegistry.createText(`
-`,!1),...r==="bash"?[A.TempleRegistry.createText(`
-  `,!1),A.TempleRegistry.createElement("div",{class:"terminal"},[A.TempleRegistry.createElement("span",{},[A.TempleRegistry.createText("$",!1)]).element,A.TempleRegistry.createText(" ",!1),...this._toNodeList(k)]).element,A.TempleRegistry.createText(`
-`,!1)]:T?[,A.TempleRegistry.createText(`
-  `,!1),...l?[A.TempleRegistry.createText(`
-    `,!1),A.TempleRegistry.createElement("pre",{class:"snippet line-numbers"},[A.TempleRegistry.createElement("code",{mount:E},[]).element]).element,A.TempleRegistry.createText(`
-  `,!1)]:[,A.TempleRegistry.createText(`
-    `,!1),A.TempleRegistry.createElement("pre",{class:"snippet pad"},[A.TempleRegistry.createElement("code",{mount:E},[]).element]).element,A.TempleRegistry.createText(`
-  `,!1)],A.TempleRegistry.createText(`
-`,!1)]:[]]}};var S=M($()),Se=M(Y()),V=class extends S.TempleComponent{static component=["app","App_05341fddbfd1fe4f273b"];styles(){return""}template(){let{title:e,panel:r}=(0,Se.props)(),l=`body ${r?"panel":""}`,i=r?`height:${r}px`:"";return()=>[S.TempleRegistry.createText(`
-`,!1),S.TempleRegistry.createElement("div",{class:"window"},[S.TempleRegistry.createText(`
-  `,!1),S.TempleRegistry.createElement("div",{class:"head"},[S.TempleRegistry.createText(`
-    `,!1),S.TempleRegistry.createElement("span",{class:"dot"},[]).element,S.TempleRegistry.createText(`
-    `,!1),S.TempleRegistry.createElement("span",{class:"dot"},[]).element,S.TempleRegistry.createText(`
-    `,!1),S.TempleRegistry.createElement("span",{class:"dot"},[]).element,S.TempleRegistry.createText(`
-    `,!1),S.TempleRegistry.createElement("span",{class:"title"},[...this._toNodeList(e)]).element,S.TempleRegistry.createText(`
-  `,!1)]).element,S.TempleRegistry.createText(`
-  `,!1),S.TempleRegistry.createElement("div",{class:l,style:i},[...this._toNodeList((0,Se.children)())]).element,S.TempleRegistry.createText(`
-`,!1)]).element]}};var a=M($());var fe=M(Y());var me={Asset:{type:{kind:"property",list:!1,type:["text/html","text/javascript","text/css","text/plain"],description:"The MIME type of the build file asset"},content:{kind:"property",list:!1,type:"string",description:"The source code of the build file asset."}},Path:{path:{kind:"property",list:!1,type:"string",description:"The file path",example:"'/path/to/file'"},type:{kind:"property",list:!1,type:"string",description:"The type of path.",example:"'file'"}},Config:{brand:{kind:"property",list:!1,type:"string",description:"The brand prefixed before the component tag name.",example:"'temple'"},cwd:{kind:"property",list:!1,type:"string",description:"The project's current working directory (cwd).",example:"'/path/to/project'"},fs:{kind:"property",list:!1,type:"FileSystem",description:"The file system being used to read/write files.",example:`import fs from 'fs';
+  }`}template(){let e=this.props,{lang:r="markup",numbers:i=!1,inline:n=!1,trim:u=!1,ltrim:y=!1,rtrim:d=!1,detab:k=0}=e,x=(0,qt.children)(),f=x[0]?.textContent||"";k&&(f=f.replace(new RegExp(`\\n {${k}}`,"g"),`
+`)),u?f=f.trim():y?f=f.replace(/^\s+/,""):d&&(f=f.replace(/\s+$/,""));let _=L=>{if(!f)return;let T=ft.default.highlight(f,ft.default.languages[r],r);if(L.detail.target.innerHTML=T,i){let R=T.match(/\n(?!$)/g),l=R?R.length+1:1,a=new Array(l+1).join(""),p=document.createElement("span");p.setAttribute("aria-hidden","true"),p.className="line-numbers-rows",p.innerHTML=a,L.detail.target.appendChild(p)}};return()=>[E.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism.min.css"}).element,E.TempleRegistry.createText(`
+`,!1),E.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism-tomorrow.min.css"}).element,E.TempleRegistry.createText(`
+`,!1),...r==="bash"?[E.TempleRegistry.createText(`
+  `,!1),E.TempleRegistry.createElement("div",{class:"terminal"},[E.TempleRegistry.createElement("span",{},[E.TempleRegistry.createText("$",!1)]).element,E.TempleRegistry.createText(" ",!1),...this._toNodeList(x)]).element,E.TempleRegistry.createText(`
+`,!1)]:f?[,E.TempleRegistry.createText(`
+  `,!1),...i?[E.TempleRegistry.createText(`
+    `,!1),E.TempleRegistry.createElement("pre",{class:"snippet line-numbers"},[E.TempleRegistry.createElement("code",{mount:_},[]).element]).element,E.TempleRegistry.createText(`
+  `,!1)]:[,E.TempleRegistry.createText(`
+    `,!1),E.TempleRegistry.createElement("pre",{class:"snippet pad"},[E.TempleRegistry.createElement("code",{mount:_},[]).element]).element,E.TempleRegistry.createText(`
+  `,!1)],E.TempleRegistry.createText(`
+`,!1)]:[,E.TempleRegistry.createText(`
+  `,!1),E.TempleRegistry.createElement("span",{},[E.TempleRegistry.createText("????",!1)]).element,E.TempleRegistry.createText(`
+`,!1)],E.TempleRegistry.createText(`
+
+`,!1)]}};var K=w(O());var De={Asset:{type:{kind:"property",list:!1,type:["text/html","text/javascript","text/css","text/plain"],description:"The MIME type of the build file asset"},content:{kind:"property",list:!1,type:"string",description:"The source code of the build file asset."}},Path:{path:{kind:"property",list:!1,type:"string",description:"The file path",example:"'/path/to/file'"},type:{kind:"property",list:!1,type:"string",description:"The type of path.",example:"'file'"}},Config:{brand:{kind:"property",list:!1,type:"string",description:"The brand prefixed before the component tag name.",example:"'temple'"},cwd:{kind:"property",list:!1,type:"string",description:"The project's current working directory (cwd).",example:"'/path/to/project'"},fs:{kind:"property",list:!1,type:"FileSystem",description:"The file system being used to read/write files.",example:`import fs from 'fs';
 
 fs`},emitter:{kind:"property",list:!1,type:"EventEmitter",description:"The NodeJS EventEmitter instance being used.",example:`import EventEmitter from 'events';
 
@@ -180,342 +187,218 @@ const compiler = temple({ emitter });'`},"minify?":{kind:"property",list:!1,type
   { href: '/' }
 ); ]`},TempleEmitter:{kind:"property",list:!1,type:"TempleEmitter",description:"The Temple emitter class used to create custom events.",example:"new TempleAPI.TempleEmitter();"},TempleException:{kind:"property",list:!1,type:"TempleException",description:"The Temple exception class used to create custom errors.",example:"throw TempleAPI.TempleException.for('error message');"},TempleRegistry:{kind:"property",list:!1,type:"TempleRegistry",description:"The Temple registry class used to store custom elements.",example:"new TempleAPI.TempleRegistry.createElement('a', { href: '/' });"},children:{kind:"function",args:[{kind:"property",list:!1,name:"component",type:"TempleComponent"}],returns:{kind:"property",list:!0,type:"Node"},description:"Returns an array of child nodes.",example:"TempleAPI.children(component); //--> [ Element, Text, Element, ... ]"},components:{kind:"property",list:!1,type:"Record",description:"Returns an object of Temple components classes used in the DOM.",example:"new TempleAPI.components['fancy-button']; //--> TempleComponent"},data:{kind:"property",list:!1,type:"TempleDataMap",description:"The Temple data map used to bring server side data to the client.",example:"TempleAPI.data.get('props');"},emitter:{kind:"property",list:!1,type:"TempleEmitter",description:"The Temple emitter class used to create custom events.",example:"TempleAPI.emitter.on('click', () => {});"},props:{kind:"function",args:[{kind:"property",list:!1,name:"component",type:"TempleComponent"}],returns:{kind:"property",list:!0,type:"Hash"},description:"Returns an object of component attributes",example:"TempleAPI.props(component); //--> { foo: 'bar', count: 4 }"},signal:{kind:"function",args:[{kind:"property",list:!1,name:"component",type:"TempleComponent"}],returns:{kind:"property",list:!1,type:"Signal"},description:"Returns a signal object used to re-render components whenever its value changes",example:"const count = TempleAPI.signal(1, component)"}},"Render Methods":{asset:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"assetFile",type:"string"}],returns:{kind:"property",list:!1,type:"Asset"},description:"Returns a compiled build asset, given an asset file name.",example:"await compiler.asset('abc123.css'); //--> { type: 'text/css', content: '...' }"},client:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"sourceFile",type:"string"}],returns:{kind:"property",list:!1,type:"string"},description:"Returns a compiled client script, given the the template source file.",example:"await compiler.client('./docs/api.dtml'); //client script"},markup:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"sourceFile",type:"string"}],returns:{kind:"property",list:!1,type:"string"},description:"Returns a compiled markup, given the the template source file.",example:"await compiler.markup('./docs/api.dtml'); //--> ..."},render:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"sourceFile",type:"string"},{kind:"property",list:!1,name:"props",type:"Hash"}],returns:{kind:"property",list:!1,type:"string"},description:"Returns the final HTML markup, given the the template source file.",example:`await compiler.render('./docs/api.dtml', {
   title: 'API Documentation'
-});`},server:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"sourceFile",type:"string"}],returns:{kind:"property",list:!1,type:"string"},description:"Returns compiled server code, given the the template source file.",example:"await compiler.server('./docs/api.dtml'); // server script"},styles:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"sourceFile",type:"string"}],returns:{kind:"property",list:!1,type:"string"},description:"Returns compiled css styles, given the the template source file.",example:"await compiler.styles('./docs/api.dtml'); //css styles"}}};var K=class extends a.TempleComponent{static component=["ui","Ui_dcdb1ec28ab9a6dac63a"];styles(){return`:host {
-    border-radius: 5px;
-    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
+});`},server:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"sourceFile",type:"string"}],returns:{kind:"property",list:!1,type:"string"},description:"Returns compiled server code, given the the template source file.",example:"await compiler.server('./docs/api.dtml'); // server script"},styles:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"sourceFile",type:"string"}],returns:{kind:"property",list:!1,type:"string"},description:"Returns compiled css styles, given the the template source file.",example:"await compiler.styles('./docs/api.dtml'); //css styles"}},DeveloperOptions:{"cwd?":{kind:"property",list:!1,type:"string",description:"The current working directory",example:"const { refresh, router } = dev({ cwd: process.cwd() })"},"emitter?":{kind:"property",list:!1,type:"EventEmitter",description:"The NodeJS EventEmitter instance being used.",example:`import emitter from 'events';
+
+const { refresh, router } = dev({ emitter });'`},"include?":{kind:"property",list:!0,type:"string",description:"An array of extension names to watch for",example:"const { refresh, router } = dev({ include: [ '.js', '.ts', '.tml', '.dtml' ] });'"},"ignore?":{kind:"property",list:!0,type:"(string|RegExp)",description:"An array of extension names to ignore",example:"const { refresh, router } = dev({ ignore: [ '*.test.*' ] });'"},"route?":{kind:"property",list:!1,type:"string",description:"The route path to use for the client watcher",example:"const { refresh, router } = dev({ route: '/__temple_dev__' })"},"tsconfig?":{kind:"property",list:!1,type:"string",description:"The path to the tsconfig.json file",example:"const { refresh, router } = dev({ tsconfig: '/path/to/tsconfig.json' })"},"extname?":{kind:"property",list:!1,type:"string",description:"the component file extension",example:"const { refresh, router } = dev({ extname: '.tml' })"}},RefreshServer:{cwd:{kind:"property",list:!1,type:"string",description:"The current working directory",example:"refresh.cwd"},emitter:{kind:"property",list:!1,type:"EventEmitter",description:"The NodeJS EventEmitter instance being used.",example:`refresh.emitter.on('render', e => {
+  console.log(e.params);
+});`},sync:{kind:"function",args:[{kind:"property",name:"builder",list:!1,type:"DocumentBuilder"}],returns:{kind:"property",list:!1,type:"void"},description:"Registers a document builder to a client watcher list",example:`refresh.emitter.on('render', e => {
+  console.log(e.params);
+});`},close:{kind:"function",args:[],returns:{kind:"property",list:!1,type:"RefreshServer"},description:"Closes the server and stops the watchers.",example:"refresh.close();"},refresh:{kind:"function",args:[{kind:"property",list:!1,name:"filePath",type:"string"}],returns:{kind:"property",list:!1,type:"Promise"},description:"Whenever a file is changed this will be called to instruct each client watcher how to update their document.",example:"await refresh.refresh('/some/file.tml');"},wait:{kind:"function",args:[{kind:"property",list:!1,name:"req",type:"Request"},{kind:"property",list:!1,name:"res",type:"Response"}],returns:{kind:"property",list:!1,type:"RefreshServer"},description:"Opens a connection to the server via SSE and waits for changes.",example:"refresh.wait(req, res);"},watch:{kind:"function",args:[],returns:{kind:"property",list:!1,type:"RefreshServer"},description:"Starts the server that watches for file changes.",example:"refresh.watch();"}},"Developer Tools":{refresh:{kind:"property",list:!1,type:"RefreshServer",description:"The refresh server instance used to update clients.",example:`const { refresh } = dev();
+refresh.sync(builder);`},router:{kind:"property",list:!1,type:"Function",description:"HTTP middleware to handle developer tool routes like '/dev.js' and '/__temple_dev__'.",example:`const { router } = dev();
+app.use(router);`}},"Express Developer Tools":{refresh:{kind:"property",list:!1,type:"RefreshServer",description:"The refresh server instance used to update clients.",example:`const { refresh } = dev();
+refresh.sync(builder);`},router:{kind:"property",list:!1,type:"Function",description:"Express middleware to handle developer tool routes like '/dev.js' and '/__temple_dev__'.",example:`const { router } = dev();
+app.use(router);`},view:{kind:"property",list:!1,type:"Function",description:"Middleware used to setup an express view engine.",example:`const { view } = dev();
+app.engine('dtml', view(compiler));`}}};var ue=class extends s.TempleComponent{static component=["ui","Ui_0ec6f6ca4b362d125365"];styles(){return""}template(){(0,K.classlist)().add("block","my-40","scroll-hidden","curved","shadow-0-0-10-0-0-0-5");let{start:e="TempleCompiler"}=(0,K.props)(),r=(0,K.signal)([e]),i=(0,K.signal)(e),n=y=>{let d=y.target.getAttribute("data-type");r.value=[...r.value,d],i.value=d},u=()=>{r.value=r.value.slice(0,r.value.length-1),i.value=r.value[r.value.length-1]};return()=>[s.TempleRegistry.createText(`
+`,!1),s.TempleRegistry.createElement("h3",{class:"tx-secondary bg-t-2 tx-16 m-0 p-10"},[s.TempleRegistry.createText(`
+  `,!1),...r.value.length>1?[s.TempleRegistry.createText(`
+    `,!1),s.TempleRegistry.createElement("a",{class:"tx-t-1 cursor-pointer",click:u},[s.TempleRegistry.createText(`
+      `,!1),s.TempleRegistry.createElement("i",{class:"fas fa-arrow-left"},[]).element,s.TempleRegistry.createText(`
+    `,!1)]).element,s.TempleRegistry.createText(`
+  `,!1)]:[],s.TempleRegistry.createText(`
+  API: `,!1),...this._toNodeList(i.value),s.TempleRegistry.createText(`
+`,!1)]).element,s.TempleRegistry.createText(`
+`,!1),s.TempleRegistry.createElement("div",{class:"bg-t-0 p-10"},[s.TempleRegistry.createText(`
+  `,!1),s.TempleRegistry.createElement("div",{class:"relative mb-20 scroll-auto"},[s.TempleRegistry.createText(`
+    `,!1),s.TempleRegistry.createElement("table",{class:"w-full bd-collapse"},[s.TempleRegistry.createText(`
+      `,!1),s.TempleRegistry.createElement("thead",{},[s.TempleRegistry.createText(`
+        `,!1),s.TempleRegistry.createElement("th",{class:"p-10 tx-left tx-uppercase"},[s.TempleRegistry.createText("Property",!1)]).element,s.TempleRegistry.createText(`
+        `,!1),...i.value.includes("Emitter")?[]:[s.TempleRegistry.createText(`
+          `,!1),s.TempleRegistry.createElement("th",{class:"p-10 tx-left tx-uppercase"},[s.TempleRegistry.createText("Returns",!1)]).element,s.TempleRegistry.createText(`
+        `,!1)],s.TempleRegistry.createText(`
+        `,!1),s.TempleRegistry.createElement("th",{class:"p-10 tx-left tx-uppercase"},[s.TempleRegistry.createText("Description",!1)]).element,s.TempleRegistry.createText(`
+      `,!1)]).element,s.TempleRegistry.createText(`
+      `,!1),s.TempleRegistry.createElement("tbody",{},[s.TempleRegistry.createText(`
+        `,!1),...Object.entries(De[i.value]).map(([y,d])=>[s.TempleRegistry.createText(`
+          `,!1),s.TempleRegistry.createElement("tr",{},[s.TempleRegistry.createText(`
+            `,!1),...d.kind==="property"?[s.TempleRegistry.createText(`
+              `,!1),s.TempleRegistry.createElement("td",{class:"tx-primary tx-top tx-nowrap bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10"},[s.TempleRegistry.createText(`
+                `,!1),...this._toNodeList(y),s.TempleRegistry.createText(`
+              `,!1)]).element,s.TempleRegistry.createText(`
+              `,!1),...De[d.type]?[s.TempleRegistry.createText(`
+                `,!1),s.TempleRegistry.createElement("td",{class:"tx-top tx-nowrap bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10"},[s.TempleRegistry.createText(`
+                  `,!1),s.TempleRegistry.createElement("a",{"data-type":d.type,click:n},[s.TempleRegistry.createText(`
+                    `,!1),...this._toNodeList(d.type),s.TempleRegistry.createText(`
+                  `,!1)]).element,...this._toNodeList(d.list?"[]":""),s.TempleRegistry.createText(`
+                `,!1)]).element,s.TempleRegistry.createText(`
+              `,!1)]:[,s.TempleRegistry.createText(`
+                `,!1),s.TempleRegistry.createElement("td",{class:"tx-top tx-nowrap bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10"},[s.TempleRegistry.createText(`
+                  `,!1),...this._toNodeList(d.type),...this._toNodeList(d.list?"[]":""),s.TempleRegistry.createText(`
+                `,!1)]).element,s.TempleRegistry.createText(`
+              `,!1)],s.TempleRegistry.createText(`
+            `,!1)]:d.kind==="function"?[,s.TempleRegistry.createText(`
+              `,!1),s.TempleRegistry.createElement("td",{class:"tx-primary tx-top bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10",nowrap:!0},[s.TempleRegistry.createText(`
+                `,!1),...this._toNodeList(y),s.TempleRegistry.createText(`(
+                  `,!1),...Object.entries(d.args).map(([k,x])=>[s.TempleRegistry.createText(`
+                    `,!1),...k>0?[s.TempleRegistry.createText(", ",!1)]:[],s.TempleRegistry.createText(`
+                    `,!1),...this._toNodeList(x.name),s.TempleRegistry.createText(`: 
+                    `,!1),...De[x.type]?[s.TempleRegistry.createText(`
+                      `,!1),s.TempleRegistry.createElement("a",{"data-type":x.type,click:n},[s.TempleRegistry.createText(`
+                        `,!1),...this._toNodeList(x.type),s.TempleRegistry.createText(`
+                      `,!1)]).element,...this._toNodeList(x.list?"[]":""),s.TempleRegistry.createText(`
+                    `,!1)]:[,s.TempleRegistry.createText(`
+                      `,!1),...this._toNodeList(x.type),...this._toNodeList(x.list?"[]":""),s.TempleRegistry.createText(`
+                    `,!1)],s.TempleRegistry.createText(`
+                  `,!1)]).flat(),s.TempleRegistry.createText(`
+                )
+              `,!1)]).element,s.TempleRegistry.createText(`
+              `,!1),...De[d.returns.type]?[s.TempleRegistry.createText(`
+                `,!1),s.TempleRegistry.createElement("td",{class:"tx-top tx-nowrap bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10"},[s.TempleRegistry.createText(`
+                  `,!1),s.TempleRegistry.createElement("a",{"data-type":d.returns.type,click:n},[s.TempleRegistry.createText(`
+                    `,!1),...this._toNodeList(d.returns.type),s.TempleRegistry.createText(`
+                  `,!1)]).element,...this._toNodeList(d.returns.list?"[]":""),s.TempleRegistry.createText(`
+                `,!1)]).element,s.TempleRegistry.createText(`
+              `,!1)]:[,s.TempleRegistry.createText(`
+                `,!1),s.TempleRegistry.createElement("td",{class:"tx-top tx-nowrap bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10"},[s.TempleRegistry.createText(`
+                  `,!1),...this._toNodeList(d.returns.type),...this._toNodeList(d.returns.list?"[]":""),s.TempleRegistry.createText(`
+                `,!1)]).element,s.TempleRegistry.createText(`
+              `,!1)],s.TempleRegistry.createText(`
+            `,!1)]:d.kind==="event"?[,s.TempleRegistry.createText(`
+              `,!1),s.TempleRegistry.createElement("td",{class:"tx-primary tx-top bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10",nowrap:!0},[s.TempleRegistry.createText(`
+                `,!1),...this._toNodeList(`on('${y}', (event: Event) => void)`),s.TempleRegistry.createText(`
+              `,!1)]).element,s.TempleRegistry.createText(`
+            `,!1)]:[],s.TempleRegistry.createText(`
+            `,!1),s.TempleRegistry.createElement("td",{class:"tx-top tx-lh-24 bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10"},[s.TempleRegistry.createText(`
+              `,!1),...d.description?[s.TempleRegistry.createText(`
+                `,!1),s.TempleRegistry.createElement("p",{class:"pb-10"},[...this._toNodeList(d.description)]).element,s.TempleRegistry.createText(`
+                `,!1),...d.example?[s.TempleRegistry.createText(`
+                  `,!1),s.TempleRegistry.createElement("h5",{},[s.TempleRegistry.createText("Example",!1)]).element,s.TempleRegistry.createText(`
+                  `,!1),s.TempleRegistry.createComponent("api-ide-code",V,{lang:"js"},[...this._toNodeList(d.example)]).element,s.TempleRegistry.createText(` 
+                `,!1)]:[],s.TempleRegistry.createText(`
+              `,!1)]:[],s.TempleRegistry.createText(`
+            `,!1)]).element,s.TempleRegistry.createText(`
+          `,!1)]).element,s.TempleRegistry.createText(`
+        `,!1)]).flat(),s.TempleRegistry.createText(`
+      `,!1)]).element,s.TempleRegistry.createText(`
+    `,!1)]).element,s.TempleRegistry.createText(`
+  `,!1)]).element,s.TempleRegistry.createText(`
+`,!1)]).element]}};var S=w(N()),Ke=w(O()),me=class extends S.TempleComponent{static component=["app","App_381239c61b65b86a1c20"];styles(){return""}template(){let{title:e,height:r}=(0,Ke.props)(),i=r?`height:${r}px`:"";return()=>[S.TempleRegistry.createText(`
+`,!1),S.TempleRegistry.createElement("div",{class:"bd-rad-curved scroll-hidden shadow-0-0-10-0-0-0-5"},[S.TempleRegistry.createText(`
+  `,!1),S.TempleRegistry.createElement("div",{class:"relative flex flex-center-y gap-10 p-10 bg-t-1 tx-c-999999 tx-16"},[S.TempleRegistry.createText(`
+    `,!1),S.TempleRegistry.createElement("span",{class:"bg-h-999999 pill h-10 w-10"},[]).element,S.TempleRegistry.createText(`
+    `,!1),S.TempleRegistry.createElement("span",{class:"bg-h-999999 pill h-10 w-10"},[]).element,S.TempleRegistry.createText(`
+    `,!1),S.TempleRegistry.createElement("span",{class:"bg-h-999999 pill h-10 w-10"},[]).element,S.TempleRegistry.createText(`
+    `,!1),S.TempleRegistry.createElement("span",{class:"flex flex-center h-full w-full absolute top-0 left-0"},[S.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(e),S.TempleRegistry.createText(`
+    `,!1)]).element,S.TempleRegistry.createText(`
+  `,!1)]).element,S.TempleRegistry.createText(`
+  `,!1),S.TempleRegistry.createElement("div",{class:"bg-black tx-t-1 relative",style:i},[...this._toNodeList((0,Ke.children)())]).element,S.TempleRegistry.createText(`
+`,!1)]).element]}};var A=w(N()),ht=w(mt()),zt=w(O()),fe=class extends A.TempleComponent{static component=["code","Code_5294df1c620ef5ddbd2f"];styles(){return`:host {
     display: block;
-    margin: 40px 0;
-    overflow: hidden;
-  }
-  a {
-    color: #007BFF;
-    cursor: pointer;
-  }
-  th {
-    padding: 10px;
-    text-align: left;
-    text-transform: uppercase;
-  }
-  td {
-    border-color: #666666;
-    border-top-style: solid;
-    border-top-width: 1px;
-    padding: 10px;
+    font-size: 14px;
+    line-height: 20px;
   }
-  .tbl-container {
-    position: relative;
-    margin-bottom: 20px;
-    overflow: auto;
+  :host([inline]) {
+    display: inline !important;
   }
-  .tbl {
-    border-collapse: collapse;
-    display: table;
-    width: 100%;
+  :host([inline]),
+  :host([inline]) > pre,
+  :host([inline]) > pre > code {
+    display: inline !important;
   }
-
-  .tbl-scroll {
-    overflow: auto;
-    flex-grow: 1;
+  .snippet {
+    background-color: #000000;
+    color: #ABB2BF;
     height: 100%;
-    width: 100%;
-  }
-
-  .tbl-valign="top" nowrap {
-    white-space: valign="top" nowrap;
-  }
-
-  .tbl-z0 {
-    z-index: 0;
-  }
-  .tbl-z1 {
-    z-index: 1;
-  }
-  .tbl-z2 {
-    z-index: 2;
-  }
-  .tbl-z3 {
-    z-index: 3;
-  }
-  .tbl-z4 {
-    z-index: 4;
-  }
-
-  .tbl-sticky {
-    position: sticky;
-  }
-  .tbl-sticky-b {
-    bottom: 0;
-  }
-  .tbl-sticky-l {
-    left: 0;
-  }
-  .tbl-sticky-t {
-    top: 0;
-  }
-  .tbl-sticky-r {
-    right: 0;
+    margin: 0;
+    padding: 0;
   }
 
-  .tbl-col {
-    border-color: black;
-    border-style: solid;
-    border-top-width: 1px;
-    padding-bottom: 16px;
-    padding-left: 12px;
-    padding-right: 12px;
-    padding-top: 16px;
+  .line-numbers {
+    position: relative;
+    padding-left: 3.8em;
+    counter-reset: linenumber;
   }
-
-  .tbl-foot {
-    border-color: black;
-    border-style: solid;
-    border-top-width: 1px;
-    padding-bottom: 16px;
-    padding-left: 12px;
-    padding-right: 12px;
-    padding-top: 16px;
+  :host([inline]) .line-numbers {
+    position: static;
+    padding-left: 0;
   }
 
-  .tbl-row {
-    padding-bottom: 16px;
-    padding-left: 12px;
-    padding-right: 12px;
-    padding-top: 16px;
+  .line-numbers > code {
+    position: relative;
+    white-space: inherit;
   }
 
-  .tbl-head {
-    border-color: black;
-    border-style: solid;
-    border-top-width: 1px;
-    padding-bottom: 16px;
-    padding-left: 12px;
-    padding-right: 12px;
-    padding-top: 16px;
-  }
+  .line-numbers .line-numbers-rows {
+    position: absolute;
+    pointer-events: none;
+    top: 0;
+    font-size: 100%;
+    left: -3.8em;
+    width: 3em; /* works for line-numbers below 1000 lines */
+    letter-spacing: -1px;
+    border-right: 1px solid #999;
 
-  tr td:first-child {
-    color: #E49F1A;
-  }
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
 
-  h3 {
-    color: #DA532C;
-    background: #1A1A1A;
-    border-bottom: 1px solid #29252A;
-    font-size: 16px;
-    margin: 0;
-    padding: 10px;
-  }
-  h5 {
-    font-weight: normal;
-    margin: 15px 0 5px;
-    text-transform: uppercase;
-  }
-  td p {
-    margin: 0 0 10px;
-  }
-  .container {
-    background-color: #020202;
-    padding: 10px;
-  }`}template(){let{start:e="TempleCompiler"}=(0,fe.props)(),r=(0,fe.signal)([e]),l=(0,fe.signal)(e),i=h=>{let d=h.target.getAttribute("data-type");r.value=[...r.value,d],l.value=d},g=()=>{r.value=r.value.slice(0,r.value.length-1),l.value=r.value[r.value.length-1]};return()=>[a.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/fontawesome/all.css"}).element,a.TempleRegistry.createText(`
-`,!1),a.TempleRegistry.createElement("div",{},[a.TempleRegistry.createText(`
-  `,!1),a.TempleRegistry.createElement("h3",{},[a.TempleRegistry.createText(`
-    `,!1),...r.value.length>1?[a.TempleRegistry.createText(`
-      `,!1),a.TempleRegistry.createElement("a",{click:g},[a.TempleRegistry.createText(`
-        `,!1),a.TempleRegistry.createElement("i",{class:"fas fa-arrow-left"},[]).element,a.TempleRegistry.createText(`
-      `,!1)]).element,a.TempleRegistry.createText(`
-    `,!1)]:[],a.TempleRegistry.createText(`
-    API: `,!1),...this._toNodeList(l.value),a.TempleRegistry.createText(`
-  `,!1)]).element,a.TempleRegistry.createText(`
-  `,!1),a.TempleRegistry.createElement("div",{class:"container"},[a.TempleRegistry.createText(`
-    `,!1),a.TempleRegistry.createElement("div",{class:"tbl-container"},[a.TempleRegistry.createText(`
-      `,!1),a.TempleRegistry.createElement("table",{class:"tbl"},[a.TempleRegistry.createText(`
-        `,!1),a.TempleRegistry.createElement("thead",{},[a.TempleRegistry.createText(`
-          `,!1),a.TempleRegistry.createElement("th",{},[a.TempleRegistry.createText("Property",!1)]).element,a.TempleRegistry.createText(`
-          `,!1),...l.value.includes("Emitter")?[]:[a.TempleRegistry.createText(`
-            `,!1),a.TempleRegistry.createElement("th",{},[a.TempleRegistry.createText("Returns",!1)]).element,a.TempleRegistry.createText(`
-          `,!1)],a.TempleRegistry.createText(`
-          `,!1),a.TempleRegistry.createElement("th",{},[a.TempleRegistry.createText("Description",!1)]).element,a.TempleRegistry.createText(`
-        `,!1)]).element,a.TempleRegistry.createText(`
-        `,!1),a.TempleRegistry.createElement("tbody",{},[a.TempleRegistry.createText(`
-          `,!1),...Object.entries(me[l.value]).map(([h,d])=>[a.TempleRegistry.createText(`
-            `,!1),a.TempleRegistry.createElement("tr",{},[a.TempleRegistry.createText(`
-              `,!1),...d.kind==="property"?[a.TempleRegistry.createText(`
-                `,!1),a.TempleRegistry.createElement("td",{valign:"top",nowrap:!0},[...this._toNodeList(h)]).element,a.TempleRegistry.createText(`
-                `,!1),...me[d.type]?[a.TempleRegistry.createText(`
-                  `,!1),a.TempleRegistry.createElement("td",{valign:"top",nowrap:!0},[a.TempleRegistry.createText(`
-                    `,!1),a.TempleRegistry.createElement("a",{"data-type":d.type,click:i},[a.TempleRegistry.createText(`
-                      `,!1),...this._toNodeList(d.type),a.TempleRegistry.createText(`
-                    `,!1)]).element,...this._toNodeList(d.list?"[]":""),a.TempleRegistry.createText(`
-                  `,!1)]).element,a.TempleRegistry.createText(`
-                `,!1)]:[,a.TempleRegistry.createText(`
-                  `,!1),a.TempleRegistry.createElement("td",{valign:"top",nowrap:!0},[...this._toNodeList(d.type),...this._toNodeList(d.list?"[]":"")]).element,a.TempleRegistry.createText(`
-                `,!1)],a.TempleRegistry.createText(`
-              `,!1)]:d.kind==="function"?[,a.TempleRegistry.createText(`
-                `,!1),a.TempleRegistry.createElement("td",{valign:"top",nowrap:!0},[a.TempleRegistry.createText(`
-                  `,!1),...this._toNodeList(h),a.TempleRegistry.createText(`(
-                    `,!1),...Object.entries(d.args).map(([x,k])=>[a.TempleRegistry.createText(`
-                      `,!1),...x>0?[a.TempleRegistry.createText(", ",!1)]:[],a.TempleRegistry.createText(`
-                      `,!1),...this._toNodeList(k.name),a.TempleRegistry.createText(`: 
-                      `,!1),...me[k.type]?[a.TempleRegistry.createText(`
-                        `,!1),a.TempleRegistry.createElement("a",{"data-type":k.type,click:i},[a.TempleRegistry.createText(`
-                          `,!1),...this._toNodeList(k.type),a.TempleRegistry.createText(`
-                        `,!1)]).element,...this._toNodeList(k.list?"[]":""),a.TempleRegistry.createText(`
-                      `,!1)]:[,a.TempleRegistry.createText(`
-                        `,!1),...this._toNodeList(k.type),...this._toNodeList(k.list?"[]":""),a.TempleRegistry.createText(`
-                      `,!1)],a.TempleRegistry.createText(`
-                    `,!1)]).flat(),a.TempleRegistry.createText(`
-                  )
-                `,!1)]).element,a.TempleRegistry.createText(`
-                `,!1),...me[d.returns.type]?[a.TempleRegistry.createText(`
-                  `,!1),a.TempleRegistry.createElement("td",{valign:"top",nowrap:!0},[a.TempleRegistry.createText(`
-                    `,!1),a.TempleRegistry.createElement("a",{"data-type":d.returns.type,click:i},[a.TempleRegistry.createText(`
-                      `,!1),...this._toNodeList(d.returns.type),a.TempleRegistry.createText(`
-                    `,!1)]).element,...this._toNodeList(d.returns.list?"[]":""),a.TempleRegistry.createText(`
-                  `,!1)]).element,a.TempleRegistry.createText(`
-                `,!1)]:[,a.TempleRegistry.createText(`
-                  `,!1),a.TempleRegistry.createElement("td",{valign:"top",nowrap:!0},[...this._toNodeList(d.returns.type),...this._toNodeList(d.returns.list?"[]":"")]).element,a.TempleRegistry.createText(`
-                `,!1)],a.TempleRegistry.createText(`
-              `,!1)]:d.kind==="event"?[,a.TempleRegistry.createText(`
-                `,!1),a.TempleRegistry.createElement("td",{valign:"top",nowrap:!0},[...this._toNodeList(`on('${h}', (event: Event) => void)`)]).element,a.TempleRegistry.createText(`
-              `,!1)]:[],a.TempleRegistry.createText(`
-              `,!1),a.TempleRegistry.createElement("td",{},[a.TempleRegistry.createText(`
-                `,!1),...d.description?[a.TempleRegistry.createText(`
-                  `,!1),a.TempleRegistry.createElement("p",{},[...this._toNodeList(d.description)]).element,a.TempleRegistry.createText(`
-                  `,!1),...d.example?[a.TempleRegistry.createText(`
-                    `,!1),a.TempleRegistry.createElement("h5",{},[a.TempleRegistry.createText("Example",!1)]).element,a.TempleRegistry.createText(`
-                    `,!1),a.TempleRegistry.createComponent("ide-code",H,{lang:"js"},[...this._toNodeList(d.example)]).element,a.TempleRegistry.createText(` 
-                  `,!1)]:[],a.TempleRegistry.createText(`
-                `,!1)]:[],a.TempleRegistry.createText(`
-              `,!1)]).element,a.TempleRegistry.createText(`
-            `,!1)]).element,a.TempleRegistry.createText(`
-          `,!1)]).flat(),a.TempleRegistry.createText(`
-        `,!1)]).element,a.TempleRegistry.createText(`
-      `,!1)]).element,a.TempleRegistry.createText(`
-    `,!1)]).element,a.TempleRegistry.createText(`
-  `,!1)]).element,a.TempleRegistry.createText(`
-`,!1)]).element]}};var q=M($()),ee=M(Y()),Q=class extends q.TempleComponent{static component=["alert","Alert_6b81bcb0566ce7f0cd2d"];styles(){return`:host {
-    --black: #222222;
-    --white: #FCFCFC;
-    --info: #1474FC;
-    --error: #DC3545;
-    --warning: #FF7B07;
-    --success: #28A745;
-    --muted: #999999;
-    --primary: #E49F1A;
-    --secondary: #DA532C;
   }
 
-  /* Text Colors
-  ---------------------------------*/
-  .tx-white, .tx-white a {
-    color: var(--info);
-  }
-  .tx-white, .tx-white a {
-    color: var(--white);
-  }
-  .tx-error, .tx-error a {
-    color: var(--error);
-  }
-  .tx-warning, .tx-warning a {
-    color: var(--warning);
-  }
-  .tx-success, .tx-success a {
-    color: var(--success);
-  }
-  .tx-muted, .tx-muted a {
-    color: var(--muted);
-  }
-  .tx-primary, .tx-primary a {
-    color: var(--primary);
-  }
-  .tx-secondary, .tx-secondary a {
-    color: var(--secondary);
+  :host([inline]) .line-numbers .line-numbers-rows {
+    display: none;
   }
 
-  /* Borders
-  ---------------------------------*/
-  .curved {
-    border-radius: 5px;
-  }
-  .rounded {
-    border-radius:12px;
-  }
-  .pill {
-    border-radius: 10000px;
-  }
-  .solid {
-    border-style: solid;
-  }
-  .thin {
-    border-width: 1px;
+  .line-numbers-rows > span {
+    display: block;
+    counter-increment: linenumber;
   }
 
-  .bd-info {
-    border-color: var(--info);
-  }
-  .bd-error {
-    border-color: var(--error);
-  }
-  .bd-warning {
-    border-color: var(--warning);
-  }
-  .bd-success {
-    border-color: var(--success);
-  }
-  .bd-muted {
-    border-color: var(--muted);
-  }
-  .bd-primary {
-    border-color: var(--primary);
+  .line-numbers-rows > span:before {
+    content: counter(linenumber);
+    color: #999;
+    display: block;
+    padding-right: 0.8em;
+    text-align: right;
   }
-  .bd-secondary {
-    border-color: var(--secondary);
+  .pad {
+    padding: 5px;
   }
 
-  /* Backgrounds
-  ---------------------------------*/
-  .bg-white {
-    background-color: var(--white);
-  }
-  .bg-info {
-    background-color: var(--info);
-  }
-  .bg-error {
-    background-color: var(--error);
-  }
-  .bg-warning {
-    background-color: var(--warning);
-  }
-  .bg-success {
-    background-color: var(--success);
-  }
-  .bg-muted {
-    background-color: var(--muted);
-  }
-  .bg-primary {
-    background-color: var(--primary);
-  }
-  .bg-secondary {
-    background-color: var(--secondary);
+  .terminal {
+    background-color: #000000;
+    font-family: 'Courier New', Courier, monospace;
+    font-size: 15px;
+    height: 100%;
+    padding: 10px;
   }
+  .terminal span {
+    color: #00FF00;
+  }`}template(){let e=this.props,{lang:r="markup",numbers:i=!1,inline:n=!1,trim:u=!1,ltrim:y=!1,rtrim:d=!1,detab:k=0}=e,x=(0,zt.children)(),f=x[0]?.textContent||"";k&&(f=f.replace(new RegExp(`\\n {${k}}`,"g"),`
+`)),u?f=f.trim():y?f=f.replace(/^\s+/,""):d&&(f=f.replace(/\s+$/,""));let _=L=>{if(!f)return;let T=ht.default.highlight(f,ht.default.languages[r],r);if(L.detail.target.innerHTML=T,i){let R=T.match(/\n(?!$)/g),l=R?R.length+1:1,a=new Array(l+1).join(""),p=document.createElement("span");p.setAttribute("aria-hidden","true"),p.className="line-numbers-rows",p.innerHTML=a,L.detail.target.appendChild(p)}};return()=>[A.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism.min.css"}).element,A.TempleRegistry.createText(`
+`,!1),A.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism-tomorrow.min.css"}).element,A.TempleRegistry.createText(`
+`,!1),...r==="bash"?[A.TempleRegistry.createText(`
+  `,!1),A.TempleRegistry.createElement("div",{class:"terminal"},[A.TempleRegistry.createElement("span",{},[A.TempleRegistry.createText("$",!1)]).element,A.TempleRegistry.createText(" ",!1),...this._toNodeList(x)]).element,A.TempleRegistry.createText(`
+`,!1)]:f?[,A.TempleRegistry.createText(`
+  `,!1),...i?[A.TempleRegistry.createText(`
+    `,!1),A.TempleRegistry.createElement("pre",{class:"snippet line-numbers"},[A.TempleRegistry.createElement("code",{mount:_},[]).element]).element,A.TempleRegistry.createText(`
+  `,!1)]:[,A.TempleRegistry.createText(`
+    `,!1),A.TempleRegistry.createElement("pre",{class:"snippet pad"},[A.TempleRegistry.createElement("code",{mount:_},[]).element]).element,A.TempleRegistry.createText(`
+  `,!1)],A.TempleRegistry.createText(`
+`,!1)]:[,A.TempleRegistry.createText(`
+  `,!1),A.TempleRegistry.createElement("span",{},[A.TempleRegistry.createText("????",!1)]).element,A.TempleRegistry.createText(`
+`,!1)],A.TempleRegistry.createText(`
 
-  /* Alert
-  ---------------------------------*/
-  .alert {
-    padding: 16px;
-  }`}template(){let{color:e,info:r,warning:l,success:i,error:g,muted:h,primary:d,secondary:x,solid:k,outline:T,curved:E,rounded:_,pill:v,style:w}=(0,ee.props)(),n={classes:["alert"],styles:""},s=T?"outline":"solid";E?n.classes.push("curved"):_?n.classes.push("rounded"):v&&n.classes.push("pill"),s==="outline"?(n.classes.push("solid","thin"),e?(n.styles+=`border-color: ${e};`,n.styles+=`color: ${e};`):r?n.classes.push("bd-info","tx-info"):l?n.classes.push("bd-warning","tx-warning"):i?n.classes.push("bd-success","tx-success"):g?n.classes.push("bd-error","tx-error"):h?n.classes.push("bd-muted","tx-muted"):d?n.classes.push("bd-primary","tx-primary"):x&&n.classes.push("bd-secondary","tx-secondary")):(n.classes.push("tx-white"),e?n.styles+=`background-color: ${e};`:r?n.classes.push("bg-info"):l?n.classes.push("bg-warning"):i?n.classes.push("bg-success"):g?n.classes.push("bg-error"):h?n.classes.push("bg-muted"):d?n.classes.push("bg-primary"):x&&n.classes.push("bg-secondary"));let o={classes:[...n.classes,(0,ee.classnames)()].join(" "),styles:{...n.styles,...w}};return()=>[q.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/fontawesome/all.css"}).element,q.TempleRegistry.createText(`
-`,!1),q.TempleRegistry.createElement("div",{class:o.classes,style:o.styles},[q.TempleRegistry.createText(`
-  `,!1),...this._toNodeList((0,ee.children)()),q.TempleRegistry.createText(`
-`,!1)]).element]}};var j=M($());var Ue=function(t,...e){let r=We(t);for(let l=0;l[j.TempleRegistry.createText(`
-    `,!1),...r?[j.TempleRegistry.createText(`
-      `,!1),j.TempleRegistry.createElement("p",{},[...this._toNodeList(T)]).element,j.TempleRegistry.createText(`
-    `,!1)]:l?[,j.TempleRegistry.createText(`
-      `,!1),j.TempleRegistry.createElement("li",{},[...this._toNodeList(T)]).element,j.TempleRegistry.createText(`
-    `,!1)]:i?[,j.TempleRegistry.createText(`
-      `,!1),j.TempleRegistry.createElement("div",{},[...this._toNodeList(T)]).element,j.TempleRegistry.createText(`
-    `,!1)]:[,j.TempleRegistry.createText(`
-      `,!1),...this._toNodeList(T),j.TempleRegistry.createText(`
-    `,!1)]]}};var R=M($());L.emitter.once("ready",()=>{let t=document.querySelector("script[data-app]");if(!t)throw L.TempleException.for("APP_DATA not found");try{let h=atob(t.getAttribute("data-app"));window.__APP_DATA__=JSON.parse(h),Object.entries(window.__APP_DATA__).forEach(([d,x])=>{L.data.set(d,x)})}catch{throw L.TempleException.for("APP_DATA is not a valid JSON")}L.data.set("current","document");let e="/docs/state-management.html",r=Ue("State Management - Temple reactive web component template engine."),l=Ue("Learn how to manage states in Temple."),i=h=>{document.body.classList.toggle("panel-left-open")};L.data.delete("current");let g={0:{class:"head panel-head"},1:{class:"menu fas fa-fw fa-bars",click:i},2:{href:"/temple"},3:{src:"/temple/temple-icon.png",alt:"Temple Logo"},5:{class:"tx-white",href:"/temple"},7:{class:"tx-white",href:"/temple/docs/index.html"},8:{class:"github",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},9:{class:"fab fa-github"},10:{class:"npm",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},11:{class:"fab fa-npm text-white"},12:{class:"discord",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},13:{class:"fab fa-discord text-white"},14:{class:"left panel-left"},16:{href:"/temple"},17:{src:"/temple/temple-icon.png",alt:"Temple Logo"},19:{class:"tx-white",href:"/temple"},20:{class:"toggle fas fa-fw fa-chevron-left",click:i},23:{href:"/temple/docs/index.html"},24:{href:"/temple/docs/getting-started.html"},26:{href:"/temple/docs/markup-syntax.html"},27:{href:"/temple/docs/state-management.html"},28:{href:"/temple/docs/component-strategy.html"},29:{href:"/temple/docs/compiler-api.html"},30:{href:"/temple/docs/client-api.html"},32:{href:"/temple/docs/template-engine.html"},33:{href:"/temple/docs/single-page.html"},34:{href:"/temple/docs/static-site.html"},35:{href:"/temple/docs/component-publisher.html"},36:{href:"/temple/docs/developer-tools.html"},37:{class:"panel-right right"},40:{href:"#props"},41:{href:"#signals"},42:{href:"#events"},43:{href:"#classnames"},44:{href:"#children"},45:{href:"#env"},46:{href:"#this"},47:{class:"panel-main"},48:{class:"docs container"},50:{p:!0,trim:!0},51:{name:"props"},53:{lang:"js",trim:!0,detab:10},54:{p:!0,trim:!0},56:{name:"signals"},59:{trim:!0,detab:10},60:{p:!0,trim:!0},61:{type:"javascript",inline:!0},63:{p:!0,trim:!0},64:{name:"events"},66:{trim:!0,number:!0,detab:10},67:{p:!0,trim:!0},68:{inline:!0},69:{class:"col-2"},74:{inline:!0},76:{inline:!0},78:{inline:!0},80:{inline:!0},82:{inline:!0},84:{inline:!0},86:{inline:!0},88:{inline:!0},92:{inline:!0},94:{inline:!0},96:{inline:!0},100:{inline:!0},102:{inline:!0},104:{inline:!0},106:{inline:!0},108:{inline:!0},110:{inline:!0},112:{inline:!0},114:{inline:!0},116:{inline:!0},118:{inline:!0},122:{inline:!0},124:{inline:!0},126:{inline:!0},130:{inline:!0},135:{inline:!0},137:{inline:!0},139:{inline:!0},141:{inline:!0},143:{inline:!0},145:{inline:!0},147:{inline:!0},149:{inline:!0},153:{inline:!0},155:{inline:!0},157:{inline:!0},159:{inline:!0},161:{inline:!0},163:{inline:!0},165:{inline:!0},167:{inline:!0},169:{inline:!0},171:{inline:!0},173:{inline:!0},175:{inline:!0},177:{inline:!0},179:{inline:!0},181:{inline:!0},183:{inline:!0},185:{inline:!0},187:{inline:!0},191:{inline:!0},193:{inline:!0},195:{inline:!0},196:{name:"classnames"},198:{lang:"js",trim:!0,detab:10},199:{p:!0,trim:!0},201:{name:"children"},203:{lang:"js",trim:!0,detab:10},204:{p:!0,trim:!0},206:{name:"env"},208:{trim:!0,detab:10},209:{p:!0,trim:!0},211:{name:"this"},213:{title:"What's this"},214:{numbers:!0,detab:12},215:{p:!0,trim:!0},216:{inline:!0},217:{inline:!0},218:{inline:!0},219:{inline:!0},220:{inline:!0},221:{inline:!0},222:{inline:!0},223:{start:"TempleComponent"},224:{curved:!0,info:!0},225:{class:"fas fa-fw fa-info-circle"},228:{target:"_blank",href:"https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement"},229:{class:"pager"},230:{class:"prev",href:"/temple/docs/markup-syntax.html"},231:{class:"fas fa-fw fa-chevron-left"},232:{class:"next",href:"/temple/docs/component-strategy.html"},233:{class:"fas fa-fw fa-chevron-right"},234:{class:"foot"}};for(let h of document.body.querySelectorAll("*")){let d=Object.fromEntries(Array.from(h.attributes).map(k=>[k.nodeName,k.nodeValue.length>0?k.nodeValue:!0])),x=String(L.TempleRegistry.elements.size);g[x]&&(Object.assign(d,g[x]),h.TempleAttributes=g[x]),L.TempleRegistry.register(h,d)}customElements.define("panel-main",X),customElements.define("ide-code",H),customElements.define("ide-app",V),customElements.define("api-ui",K),customElements.define("tui-alert",Q),customElements.define("i18n-translate",te),L.emitter.emit("mounted",document.body)});var pr={PanelMain_fd7f1af6410c5b5c8e1f:X,IdeCode_6f36bc13bb6a166c7abc:H,IdeApp_05341fddbfd1fe4f273b:V,ApiUi_dcdb1ec28ab9a6dac63a:K,TuiAlert_6b81bcb0566ce7f0cd2d:Q,I18nTranslate_7d25e372f5ffb5e39dad:te},cr="269f8b60f20cebb43be6";return jt(dr);})();
+`,!1)]}};var I=w(N());var Jt=function(t){return t};var Qe=w(O()),he=class extends I.TempleComponent{static component=["translate","Translate_0014b007fc91289b2776"];styles(){return""}template(){let{trim:e=!1,p:r=!1,li:i=!1,div:n=!1}=(0,Qe.props)(),u=(0,Qe.children)(),y=[],d=[];for(let _ of u)typeof _=="string"?y.push(_):_ instanceof Node&&_.textContent?y.push(_.textContent):(y.push("%s"),d.push(_));let k=y.join("");e&&(k=k.replace(/\s+/," ").trim());let x=Jt(k).split("%s"),f=[];for(let _=0;_[I.TempleRegistry.createText(`
+    `,!1),...r?[I.TempleRegistry.createText(`
+      `,!1),I.TempleRegistry.createElement("p",{},[...this._toNodeList(f)]).element,I.TempleRegistry.createText(`
+    `,!1)]:i?[,I.TempleRegistry.createText(`
+      `,!1),I.TempleRegistry.createElement("li",{},[...this._toNodeList(f)]).element,I.TempleRegistry.createText(`
+    `,!1)]:n?[,I.TempleRegistry.createText(`
+      `,!1),I.TempleRegistry.createElement("div",{},[...this._toNodeList(f)]).element,I.TempleRegistry.createText(`
+    `,!1)]:[,I.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(f),I.TempleRegistry.createText(`
+    `,!1)]]}};var gt=function(t,...e){let r=Hr(t);for(let i=0;i{let t=document.querySelector("script[data-app]");if(!t)throw $.TempleException.for("APP_DATA not found");try{let y=atob(t.getAttribute("data-app"));window.__APP_DATA__=JSON.parse(y),Object.entries(window.__APP_DATA__).forEach(([d,k])=>{$.data.set(d,k)})}catch{throw $.TempleException.for("APP_DATA is not a valid JSON")}$.data.set("current","document");let e="/docs/state-management.html",r=gt("State Management - Temple reactive web component template engine."),i=gt("Learn how to manage states in Temple."),n=()=>{document.getElementsByTagName("panel-layout")[0].toggle("left")};$.data.delete("current");let u={2:{class:"flex flex-center-y px-20 py-15 m-0 bg-t-1"},3:{class:"fas fa-fw fa-bars cursor-pointer py-5 pr-10 none md-inline-block tx-t-1",click:n},4:{class:"flex-grow"},5:{class:"flex flex-center-y"},6:{class:"tx-white",href:"/temple/docs/index.html"},7:{class:"tx-t-1 tx-5xl ml-10",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},8:{class:"fab fa-github"},9:{class:"bg-h-cb3837 pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},10:{class:"fab fa-npm text-white"},11:{class:"bg-h-7289da pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},12:{class:"fab fa-discord text-white"},14:{class:"flex flex-center-y bg-t-2 py-15 pr-5 pl-10"},15:{href:"/temple"},16:{class:"h-26 mr-10",src:"/temple/temple-icon.png",alt:"Temple Logo"},17:{class:"flex-grow m-0 tx-uppercase"},18:{class:"tx-white",href:"/temple"},19:{class:"fas fa-fw fa-chevron-left cursor-pointer none md-inline-block",click:n},20:{class:"bg-t-1 scroll-auto h-calc-full-60"},21:{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-0 pt-20 pb-10 pl-10 tx-uppercase"},22:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/index.html"},23:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/getting-started.html"},24:{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},25:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/markup-syntax.html"},26:{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/state-management.html"},27:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-strategy.html"},28:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/compiler-api.html"},29:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/client-api.html"},30:{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},31:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/template-engine.html"},32:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/single-page.html"},33:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/static-site.html"},34:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-publisher.html"},35:{class:"block tx-t-1 py-10 pl-10 mb-100",href:"/temple/docs/developer-tools.html"},37:{class:"m-0 px-10 py-20 h-calc-full-40 bg-t-2 scroll-auto"},38:{class:"tx-muted tx-14 mb-0 mt-0 pb-10 tx-uppercase"},39:{class:"tx-14 tx-lh-32"},40:{class:"block tx-t-0",href:"#props"},41:{class:"block tx-t-0",href:"#signals"},42:{class:"block tx-t-0",href:"#events"},43:{class:"block tx-t-0",href:"#classnames"},44:{class:"block tx-t-0",href:"#children"},45:{class:"block tx-t-0",href:"#component"},46:{class:"block tx-t-0",href:"#env"},47:{class:"block tx-t-0",href:"#this"},50:{class:"tx-primary tx-uppercase tx-30 py-20"},51:{p:!0,trim:!0,class:"tx-lh-36 py-20"},52:{name:"props"},53:{class:"tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0"},54:{lang:"js",trim:!0,detab:12},55:{p:!0,trim:!0,class:"tx-lh-36 py-20"},57:{name:"signals"},58:{class:"tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0"},59:{p:!0,trim:!0,class:"tx-lh-36 py-20"},60:{class:"scroll-auto bg-black"},61:{trim:!0,detab:14},62:{p:!0,trim:!0,class:"tx-lh-36 py-20"},63:{type:"javascript",inline:!0},65:{p:!0,trim:!0,class:"tx-lh-36 py-20"},66:{name:"events"},67:{class:"tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0"},68:{class:"scroll-auto bg-black"},69:{trim:!0,number:!0,detab:14},70:{p:!0,trim:!0,class:"tx-lh-36 py-20"},71:{inline:!0},72:{class:"col-2"},75:{class:"tx-lh-36"},77:{inline:!0},79:{inline:!0},81:{inline:!0},83:{inline:!0},85:{inline:!0},87:{inline:!0},89:{inline:!0},91:{inline:!0},93:{class:"tx-lh-36"},95:{inline:!0},97:{inline:!0},99:{inline:!0},101:{class:"tx-lh-36"},103:{inline:!0},105:{inline:!0},107:{inline:!0},109:{inline:!0},111:{inline:!0},113:{inline:!0},115:{inline:!0},117:{inline:!0},119:{inline:!0},121:{inline:!0},123:{class:"tx-lh-36"},125:{inline:!0},127:{inline:!0},129:{inline:!0},131:{class:"tx-lh-36"},133:{inline:!0},136:{class:"tx-lh-36"},138:{inline:!0},140:{inline:!0},142:{inline:!0},144:{inline:!0},146:{inline:!0},148:{inline:!0},150:{inline:!0},152:{inline:!0},154:{class:"tx-lh-36"},156:{inline:!0},158:{inline:!0},160:{inline:!0},162:{inline:!0},164:{inline:!0},166:{inline:!0},168:{inline:!0},170:{inline:!0},172:{inline:!0},174:{inline:!0},176:{inline:!0},178:{inline:!0},180:{inline:!0},182:{inline:!0},184:{inline:!0},186:{inline:!0},188:{inline:!0},190:{inline:!0},192:{class:"tx-lh-36"},194:{inline:!0},196:{inline:!0},198:{inline:!0},199:{name:"classnames"},200:{class:"tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0"},201:{class:"scroll-auto bg-black"},202:{lang:"js",trim:!0,detab:14},203:{p:!0,trim:!0,class:"tx-lh-36 py-20"},205:{name:"children"},206:{class:"tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0"},207:{class:"scroll-auto bg-black"},208:{lang:"js",trim:!0,detab:14},209:{p:!0,trim:!0,class:"tx-lh-36 py-20"},211:{name:"component"},212:{class:"tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0"},213:{class:"scroll-auto bg-black"},214:{lang:"js",trim:!0,detab:14},215:{p:!0,trim:!0,class:"tx-lh-36 py-20"},217:{name:"env"},218:{class:"tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0"},219:{trim:!0,detab:12},220:{p:!0,trim:!0,class:"tx-lh-36 py-20"},222:{name:"this"},223:{class:"tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0"},224:{title:"What's this",class:"py-20"},225:{numbers:!0,detab:14},226:{p:!0,trim:!0,class:"tx-lh-36 py-20"},227:{inline:!0},228:{inline:!0},229:{inline:!0},230:{inline:!0},231:{inline:!0},232:{inline:!0},233:{inline:!0},234:{start:"TempleComponent"},235:{curved:!0,info:!0,class:"py-20 tx-lh-24"},236:{class:"fas fa-fw fa-info-circle"},239:{target:"_blank",class:"tx-white tx-underline",href:"https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement"},240:{class:"flex"},241:{class:"tx-primary py-40",href:"/temple/docs/markup-syntax.html"},242:{class:"fas fa-fw fa-chevron-left tx-t-1"},243:{class:"flex-grow tx-right tx-primary py-40",href:"/temple/docs/component-strategy.html"},244:{class:"fas fa-fw fa-chevron-right tx-t-1"},245:{class:"foot"}};for(let y of document.body.querySelectorAll("*")){let d=Object.fromEntries(Array.from(y.attributes).map(x=>[x.nodeName,x.nodeValue.length>0?x.nodeValue:!0])),k=String($.TempleRegistry.elements.size);u[k]&&(Object.assign(d,u[k]),y.TempleAttributes=u[k]),$.TempleRegistry.register(y,d)}customElements.define("panel-layout",se),customElements.define("panel-head",ie),customElements.define("panel-left",ae),customElements.define("panel-right",le),customElements.define("panel-main",oe),customElements.define("tui-alert",pe),customElements.define("api-docs",de),customElements.define("api-ui",ue),customElements.define("ide-app",me),customElements.define("ide-code",fe),customElements.define("i18n-translate",he),$.emitter.emit("mounted",document.body)});var Br={PanelLayout_9f3ab204ce271feaf6f7:se,PanelHead_2bf4dff19bc88ba4138b:ie,PanelLeft_f4ab589e043eee17d229:ae,PanelRight_4ce97029791442c57f8d:le,PanelMain_847772763f4518728ede:oe,TuiAlert_f0fe98801b4b833c4233:pe,ApiDocs_40562a7bb56d70d971df:de,ApiUi_0ec6f6ca4b362d125365:ue,ApiIdeCode_6f36bc13bb6a166c7abc:V,IdeApp_381239c61b65b86a1c20:me,IdeCode_5294df1c620ef5ddbd2f:fe,I18nTranslate_0014b007fc91289b2776:he},qr="269f8b60f20cebb43be6";return tr(zr);})();
 /*! Bundled license information:
 
 prismjs/prism.js:
diff --git a/docs/build/client/2d721d6aed73f41f4e72.css b/docs/build/client/2d721d6aed73f41f4e72.css
index e69de29..e0afe2e 100644
--- a/docs/build/client/2d721d6aed73f41f4e72.css
+++ b/docs/build/client/2d721d6aed73f41f4e72.css
@@ -0,0 +1,216 @@
+html, body {
+  height: 100%;
+  margin: 0;
+  padding: 0;
+  width: 100%;
+}
+
+h1, h2, h3, h4, h5, h6, p {
+  margin: 0;
+  padding: 0;
+}
+
+a {
+  text-decoration: none;
+}
+  html-head:not(:defined) { opacity: 0; }
+html-header:not(:defined) { opacity: 0; }
+html-aside:not(:defined) { opacity: 0; }
+panel-layout:not(:defined) { opacity: 0; }
+panel-head:not(:defined) { opacity: 0; }
+panel-left:not(:defined) { opacity: 0; }
+panel-main:not(:defined) { opacity: 0; }
+tui-tab:not(:defined) { opacity: 0; }
+api-docs:not(:defined) { opacity: 0; }
+app-head:not(:defined) { opacity: 0; }
+app-left:not(:defined) { opacity: 0; }
+app-main:not(:defined) { opacity: 0; }
+ide-app:not(:defined) { opacity: 0; }
+ide-code:not(:defined) { opacity: 0; }
+i18n-translate:not(:defined) { opacity: 0; }
+  :root {
+  --black: #000000;
+  --white: #FFFFFF;
+  --info: #1474FC;
+  --error: #DC3545;
+  --warning: #FF7B07;
+  --success: #28A745;
+  --muted: #999999;
+}
+
+.light {
+  --bg-0: #EFEFEF;
+  --bg-1: #CFCFCF;
+  --bg-2: #AFAFAF;
+  --bg-3: #8F8F8F;
+  --bg-4: #6F6F6F;
+  --bd-0: #EFEFEF;
+  --bd-1: #CFCFCF;
+  --bd-2: #AFAFAF;
+  --bd-3: #8F8F8F;
+  --bd-4: #6F6F6F;
+  --bg-inverse: #242424;
+  --tx-0: #000000;
+  --tx-1: #242424;
+  --tx-inverse: #CFCFCF;
+}
+
+.dark {
+  --bg-0: #121212;
+  --bg-1: #222222;
+  --bg-2: #323232;
+  --bg-3: #424242;
+  --bg-4: #525252;
+  --bd-0: #121212;
+  --bd-1: #222222;
+  --bd-2: #323232;
+  --bd-3: #424242;
+  --bd-4: #525252;
+  --bg-inverse: #DBDBDB;
+  --tx-0: #FFFFFF;
+  --tx-1: #CFCFCF;
+  --tx-inverse: #222222;
+}
+  html-head { display: block; }
+html-header { display: block; }
+html-aside { display: block; }
+panel-layout { display: block; }
+panel-head { display: block; }
+panel-left { display: block; }
+panel-main { display: block; }
+tui-tab { display: block; }
+api-docs { display: block; }
+app-head { display: block; }
+app-left { display: block; }
+app-main { display: block; }
+ide-app { display: block; }
+ide-code { display: block; }
+i18n-translate { display: block; }
+  .arial { font-family: Arial, sans-serif; }
+.none { display: none; }
+.block { display: block; }
+.flex { display: flex; }
+.inline { display: inline; }
+.relative { position: relative; }
+.absolute { position: absolute; }
+.static { position: static; }
+.bottom-0 { bottom: 0px; }
+.bottom-60 { bottom: 60px; }
+.left-0 { left: 0px; }
+.left-226 { left: 226px; }
+.left-0 { left: 0px; }
+.left-226 { left: 226px; }
+.left--226 { left: -226px; }
+.left-170 { left: 170px; }
+.right-0 { right: 0px; }
+.right-200 { right: 200px; }
+.right-0 { right: 0px; }
+.right-200 { right: 200px; }
+.top-0 { top: 0px; }
+.top-60 { top: 60px; }
+.top-45 { top: 45px; }
+.z-1 { z-index: 1; }
+.z-2 { z-index: 2; }
+.flex-grow { flex-grow: 1; }
+.flex-center { align-items: center; justify-content: center; }
+.flex-center-y { align-items: center; }
+.gap-10 { gap: 10px; }
+.scroll-auto { overflow: auto; }
+.scroll-hidden { overflow: hidden; }
+.scroll-x-auto { overflow-x: auto; }
+.scroll-x-hidden { overflow-x: hidden; }
+.scroll-y-auto { overflow-y: auto; }
+.h-full { height: 100%; }
+.h-26 { height: 26px; }
+.h-7289 { height: 7289px; }
+.h-905496362982981723 { height: 905496362982981723px; }
+.h-60 { height: 60px; }
+.h-45 { height: 45px; }
+.h-000000 { height: 000000px; }
+.h-999999 { height: 999999px; }
+.h-10 { height: 10px; }
+.h-36 { height: 36px; }
+.h-calc-full-60 { height: calc(100% - 60px); }
+.vh { height: 100vh; }
+.w-full { width: 100%; }
+.w-226 { width: 226px; }
+.w-170 { width: 170px; }
+.w-0 { width: 0px; }
+.w-10 { width: 10px; }
+.bg-black { background-color: var(--black) !important; }
+.bg-t-1 { background-color: var(--bg-1) !important; }
+.bg-t-2 { background-color: var(--bg-2) !important; }
+.bg-t-0 { background-color: var(--bg-0) !important; }
+.bg-h-cb3837 { background-color: #cb3837; }
+.bg-h-7289da { background-color: #7289da; }
+.bg-h-000000 { background-color: #000000; }
+.bg-h-999999 { background-color: #999999; }
+.tx-5 { font-size: 5px; }
+.tx-14 { font-size: 14px; }
+.tx-16 { font-size: 16px; }
+.tx-30 { font-size: 30px; }
+.tx-lg { font-size: 16px; }
+.tx-5xl { font-size: 26px; }
+.tx-center { text-align: center; }
+.tx-right { text-align: right; }
+.tx-bold { font-weight: bold; }
+.tx-uppercase { text-transform: uppercase; }
+.tx-lh-36 { line-height: 36px; }
+.tx-primary { color: var(--primary) !important; }
+.tx-white { color: var(--white) !important; }
+.tx-muted { color: var(--muted) !important; }
+.tx-t-1 { color: var(--tx-1) !important; }
+.bd-solid { border-style: solid; }
+.bd-t-2 { border-color: var(--bd-2) !important; }
+.bd-t-1 { border-color: var(--bd-1) !important; }
+.bdb-0 { border-bottom-width: 0px; }
+.bdl-0 { border-left-width: 0px; }
+.bdr-1 { border-right-width: 1px; }
+.bdt-1 { border-top-width: 1px; }
+.bdx-0 { border-left-width: 0px; border-right-width: 0px; }
+.bdy-0 { border-top-width: 0px; border-bottom-width: 0px; }
+.pill { border-radius: 10000px; }
+.curve-t-sm { border-radius: 4px 4px 0 0; }
+.m-0 { margin: 0px; }
+.m-0 { margin: 0px; }
+.m-60 { margin: 60px; }
+.mb-0 { margin-bottom: 0px; }
+.mb-100 { margin-bottom: 100px; }
+.ml-10 { margin-left: 10px; }
+.ml-5 { margin-left: 5px; }
+.ml-2 { margin-left: 2px; }
+.mr-10 { margin-right: 10px; }
+.mt-0 { margin-top: 0px; }
+.mt-20 { margin-top: 20px; }
+.p-5 { padding: 5px; }
+.p-0 { padding: 0px; }
+.p-60 { padding: 60px; }
+.p-10 { padding: 10px; }
+.p-45 { padding: 45px; }
+.p-10 { padding: 10px; }
+.pb-10 { padding-bottom: 10px; }
+.pl-10 { padding-left: 10px; }
+.pl-5 { padding-left: 5px; }
+.pl-15 { padding-left: 15px; }
+.pr-10 { padding-right: 10px; }
+.pr-5 { padding-right: 5px; }
+.pt-20 { padding-top: 20px; }
+.pt-5 { padding-top: 5px; }
+.pt-10 { padding-top: 10px; }
+.px-20 { padding-left: 20px; padding-right: 20px; }
+.py-15 { padding-top: 15px; padding-bottom: 15px; }
+.py-5 { padding-top: 5px; padding-bottom: 5px; }
+.py-10 { padding-top: 10px; padding-bottom: 10px; }
+.py-20 { padding-top: 20px; padding-bottom: 20px; }
+.py-40 { padding-top: 40px; padding-bottom: 40px; }
+.cursor-pointer { cursor: pointer; }
+.transition-500 { transition: 500ms; }
+.shadow-0-0-10-0-0-0-5 { box-shadow: 0px 0px 10px rgb(0, 0, 0, 0.5); }
+@media (max-width: 767px) {
+  .md-inline-block { display: inline-block; }
+  .md-left-0 { left: 0px; }
+  .md-left-226 { left: 226px; }
+  .md-left--226 { left: -226px; }
+  .md-right-0 { right: 0px; }
+  .md-right-200 { right: 200px; }
+}
\ No newline at end of file
diff --git a/docs/build/client/2d721d6aed73f41f4e72.html b/docs/build/client/2d721d6aed73f41f4e72.html
index 93f6e3e..f4ec282 100644
--- a/docs/build/client/2d721d6aed73f41f4e72.html
+++ b/docs/build/client/2d721d6aed73f41f4e72.html
@@ -18,110 +18,165 @@
   
   
   
-  
+  
   
   
   
   
 
-  
-    

-  
-  
-    Temple Logo
-  
-  
Temple

-  
+      
+        
+          

+            Template Engine
+          

 
-        
-          Template engines are used when you want to rapidly build web 
-          applications that are split into different pages. Templates 
-          also enable fast rendering of the server-side data that needs
-          to be passed to the application. You can use Temple, TypeScript 
-          and the native Node.js HTTP server to serve up HTML documents
-          from the server-side.
-        
+          
+            Template engines are used when you want to rapidly build web 
+            applications that are split into different pages. Templates 
+            also enable fast rendering of the server-side data that needs
+            to be passed to the application. You can use Temple, TypeScript 
+            and the native Node.js HTTP server to serve up HTML documents
+            from the server-side.
+          
 
-        
-          First, create a project with the following structure and files.
-        
-        
-          

-            

-              
-                src/index.ts
+          
+            First, create a project with the following structure and files.
+          
+          
+            
+              

+                
+                  src/index.ts
+                
+                
+                  src/page.dtml
+                
+                
+                  package.json
+                
+              

+            
+            
+              

+                
+                src
+              

+              
+                
+                index.ts
               
-              
-                src/page.dtml
+              
+                
+                page.dtml
               
-              
+              
+                
                 package.json
               
-            

-          

-          

-            

-              
-              src
-            

-            
-              
-              index.ts
-            
-            
-              
-              page.dtml
-            
-            
-              
-              package.json
-            
-          

-          

-            

+            
+            
               
                 import http from 'http';
                 import temple from '@ossph/temple/compiler';
@@ -179,49 +234,49 @@ 

                     "dev": "ts-node ./src/index.ts"
                   },
                   "dependencies": {
-                    "@ossph/temple": "0.1.4"
+                    "@ossph/temple": "0.1.6"
                   },
                   "devDependencies": {
-                    "@ossph/temple-dev": "0.1.4",
+                    "@ossph/temple-dev": "0.1.6",
                     "@types/node": "22.1.0",
                     "ts-node": "10.9.2",
                     "typescript": "5.5.4"
                   }
                 }
               
-            

-          

-        
-        
-          The server file 
-          src/index.ts 
-          implements a simple server utilizing the Temple compiler in 
-          its most simplistic form. The document file
-          src/page.dtml 
-          is using the most basic Temple syntax. To test the script and 
-          see the results, run the following command in terminal.
-        
-        
-          npm run dev
-        
-        
-          Load 
-          'http://localhost:3000/' 
-          in your browser to see your application.
-        
-        
-        
-      
-      

-    
+            
+          
+          
+            The server file 
+            src/index.ts 
+            implements a simple server utilizing the Temple compiler in 
+            its most simplistic form. The document file
+            src/page.dtml 
+            is using the most basic Temple syntax. To test the script and 
+            see the results, run the following command in terminal.
+          
+          
+            npm run dev
+          
+          
+            Load 
+            http://localhost:3000/ 
+            in your browser to see your application.
+          
+          
+          
+          

+        
+      
+    
   
 
\ No newline at end of file
diff --git a/docs/build/client/2d721d6aed73f41f4e72.js b/docs/build/client/2d721d6aed73f41f4e72.js
index e65da48..aa4a47d 100644
--- a/docs/build/client/2d721d6aed73f41f4e72.js
+++ b/docs/build/client/2d721d6aed73f41f4e72.js
@@ -1,20 +1,49 @@
-var TempleAPI=(()=>{var xt=Object.create;var ge=Object.defineProperty;var Tt=Object.getOwnPropertyDescriptor;var Et=Object.getOwnPropertyNames;var Ft=Object.getPrototypeOf,kt=Object.prototype.hasOwnProperty;var O=(t,e)=>()=>(e||t((e={exports:{}}).exports,e),e.exports),St=(t,e)=>{for(var r in e)ge(t,r,{get:e[r],enumerable:!0})},Je=(t,e,r,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let n of Et(e))!kt.call(t,n)&&n!==r&&ge(t,n,{get:()=>e[n],enumerable:!(i=Tt(e,n))||i.enumerable});return t};var D=(t,e,r)=>(r=t!=null?xt(Ft(t)):{},Je(e||!t||!t.__esModule?ge(r,"default",{value:t,enumerable:!0}):r,t)),Pt=t=>Je(ge({},"__esModule",{value:!0}),t);var Me=O(Oe=>{"use strict";Object.defineProperty(Oe,"__esModule",{value:!0});var je=class extends Error{static for(e,...r){return r.forEach(function(i){e=e.replace("%s",i)}),new this(e)}static forErrorsFound(e){let r=new this("Invalid Parameters");return r.errors=e,r}static require(e,r,...i){if(!e){for(let n of i)r=r.replace("%s",n);throw new this(r)}}constructor(e,r=500){super(),this.errors={},this.start=0,this.end=0,this.message=e,this.name=this.constructor.name,this.code=r}withCode(e){return this.code=e,this}withPosition(e,r){return this.start=e,this.end=r,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};Oe.default=je});var Q=O(K=>{"use strict";Object.defineProperty(K,"__esModule",{value:!0});K.TempleEmitter=void 0;var he=class extends EventTarget{emit(e,r){return this.dispatchEvent(new CustomEvent(e,{detail:r})),this}on(e,r){if(e==="ready"&&document.readyState!=="loading"){let i=new CustomEvent("ready");return setTimeout(()=>r(i),1),this}return this.addEventListener(e,r),this}once(e,r){let i=n=>{this.unbind(e,i),r(n)};return this.on(e,i),this}unbind(e,r){return this.removeEventListener(e,r),this}};K.TempleEmitter=he;var Xe=new he;document.onreadystatechange=()=>{document.readyState!=="loading"&&Xe.emit("ready")};K.default=Xe});var $e=O(ee=>{"use strict";var jt=ee&&ee.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ee,"__esModule",{value:!0});var Ce=jt(Q()),De=class{get attributes(){return Object.assign({},this._attributes)}get element(){return this._element}constructor(e,r){this._element=e,this._attributes=r}hasAttribute(e){return e in this._attributes}getAttribute(e){return this._attributes[e]}removeAttribute(e,r=!1){let i=this.getAttribute(e);return typeof i>"u"?this:(delete this._attributes[e],this._element.removeAttribute(e),r||Ce.default.emit("attribute-remove",{element:this,key:e,previous:i}),this)}setAttribute(e,r,i=!1){if(typeof r>"u")return this.removeAttribute(e,i);let n=this.getAttribute(e);return n===r?this:(this._attributes[e]=r,typeof r=="string"&&this._element.setAttribute(e,r),i||(typeof n>"u"?Ce.default.emit("attribute-create",{element:this,key:e,value:r}):Ce.default.emit("attribute-update",{element:this,key:e,value:r,previous:n})),this)}setAttributes(e,r=!1){for(let[n,p]of Object.entries(e))this.setAttribute(n,p,r);let i=Object.keys(e);for(let n of Object.keys(this._attributes))i.includes(n)||this.removeAttribute(n,r);return this}};ee.default=De});var be=O(te=>{"use strict";var Ot=te&&te.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(te,"__esModule",{value:!0});var Mt=Ot($e()),me=class{static get elements(){return this._elements}static createComponent(e,r,i,n=[]){let p=document.createElement("template");p.innerHTML=`<${e}>`;let g=p.content.querySelector(`${e}`);Object.setPrototypeOf(g,r.prototype),g.constructor=r.constructor,g.constructor.component=r.component;for(let[_,y]of Object.entries(i))typeof y=="string"?g.setAttribute(_,y):y===!0&&g.setAttribute(_,_);return g._TempleAttributes=i,g.props=i,n.forEach(_=>g.appendChild(_)),g.register(),customElements.get(e)||g.connectedCallback(),this.register(g,i)}static createElement(e,r,i=[]){let n=document.createElement(e);for(let[p,m]of Object.entries(r))typeof m=="string"?n.setAttribute(p,m):m===!0&&n.setAttribute(p,p);return i.filter(p=>typeof p<"u").forEach(p=>n.appendChild(p)),this.register(n,r)}static createText(e,r=!1){return document.createTextNode(e)}static filter(e){let r=[];return this._elements.forEach((i,n)=>{e(i,n)&&r.push(i)}),r}static get(e){return this._elements.get(e)||null}static has(e){return this._elements.has(e)}static map(e){let r=[];return this._elements.forEach((i,n)=>{r.push(e(i,n))}),r}static register(e,r){if(this.has(e))return this.get(e);let i=new Mt.default(e,r||{});return this._elements.set(e,i),i}};me._elements=new Map;te.default=me});var z=O(re=>{"use strict";Object.defineProperty(re,"__esModule",{value:!0});re.TempleDataMap=void 0;var _e=class{constructor(){window.__APP_DATA__||(window.__APP_DATA__={})}clear(){return window.__APP_DATA__={},this}delete(e){return this.has(e)?(delete window.__APP_DATA__[e],!0):!1}entries(){return Object.entries(window.__APP_DATA__)}has(e){return e in window.__APP_DATA__}get(e){return window.__APP_DATA__[e]}keys(){return Object.keys(window.__APP_DATA__)}set(e,r){return window.__APP_DATA__[e]=r,this}values(){return Object.values(window.__APP_DATA__)}};re.TempleDataMap=_e;var Ct=new _e;re.default=Ct});var Ve=O(ae=>{"use strict";var qe=ae&&ae.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ae,"__esModule",{value:!0});var ne=qe(be()),ve=qe(Q()),Ye=qe(z()),Le=class t extends HTMLElement{constructor(){super(...arguments),this._initiated=!1,this._template=null,this._attributes={},this._props={},this._children=void 0,this._rendering=!1}static register(){customElements.define(this.component[0],this)}get attr(){return this._attributes}get element(){return ne.default.has(this)?ne.default.get(this):ne.default.register(this,this._TempleAttributes||{})}get metadata(){let[e,r]=this.constructor.component;return{tagname:e,classname:r}}get originalChildren(){return this._children}get initiated(){return this._initiated}get props(){return this._props}set props(e){this._props=Object.assign({},e),this._attributes=Object.fromEntries(Object.entries(e).filter(r=>typeof r[1]=="string"||r[1]===!0))}adoptedCallback(){this.render()}attributeChangedCallback(e,r,i){this.props=Object.assign(Object.assign({},this.props),{[e]:i}),this.render()}connectedCallback(){this.wait()}disconnectedCallback(){}getParentComponent(){let e=this.parentElement;for(;e;){if(e instanceof t)return e;e=e.parentElement}return null}register(){ne.default.register(this,this._props)}render(){let e=this.getParentComponent();if(e&&!e.initiated)return;if(this._rendering)return;this._rendering=!0,Ye.default.set("current",this);let r=this.styles();this._template?ve.default.emit("unmounted",this):this._template=this.template();let i=this._template().filter(Boolean);if(r.length===0)this.textContent="",i.forEach(n=>this.appendChild(n));else{this.shadowRoot||this.attachShadow({mode:"open"});let n=this.shadowRoot;this.textContent="",n.textContent="";let p=document.createElement("style");p.innerText=r,n.appendChild(p),i.forEach(m=>{var g;return(g=this.shadowRoot)===null||g===void 0?void 0:g.appendChild(m)})}return Ye.default.delete("current"),this._initiated=!0,ve.default.emit("mounted",this),this._rendering=!1,this.shadowRoot?this.shadowRoot.innerHTML:this.innerHTML}wait(){if(document.readyState!=="loading")this._update();else{let e=()=>{this._update(),ve.default.unbind("ready",e)};ve.default.on("ready",e)}}_toNodeList(e){return e instanceof Node?[e]:Array.isArray(e)&&e.every(r=>r instanceof Node)?e:[ne.default.createText(String(e))]}_update(){typeof this._children>"u"&&(this._children=Array.from(this.childNodes||[]));let e=this.element;e&&(this.props=Object.assign({},e.attributes),this.render()),this._initiated||this.render()}};ae.default=Le});var Ke=O(se=>{"use strict";var Dt=se&&se.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(se,"__esModule",{value:!0});var $t=Dt(z());function Lt(t){let e=$t.default.get("env")||{};return t?e[t]||null:e}se.default=Lt});var Re=O(ie=>{"use strict";var qt=ie&&ie.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ie,"__esModule",{value:!0});ie.default=Rt;var Qe=qt(z());function Rt(t=null){return t||(t=Qe.default.get("current")||null),t?t==="document"?Qe.default.get("props")||{}:t.props:{}}});var et=O(le=>{"use strict";var It=le&&le.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(le,"__esModule",{value:!0});le.default=Ht;var zt=It(Re());function Ht(t=null){return(0,zt.default)(t).class}});var rt=O(G=>{"use strict";var Nt=G&&G.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(G,"__esModule",{value:!0});G.innerHTML=Gt;G.default=tt;var Bt=Nt(z());function Gt(t=null){let e=tt(t),r=document.createElement("template");return r.append(...e),r.innerHTML}function tt(t=null){return t||(t=Bt.default.get("current")||null),t?t.originalChildren||[]:[]}});var st=O(H=>{"use strict";var at=H&&H.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(H,"__esModule",{value:!0});H.SignalRegistry=void 0;H.default=Zt;var nt=at(Me()),Ut=at(z()),U=class t{static observe(e,r){let i={getter:()=>n.raw,setter:m=>m},n={raw:r,getter(m){return i.getter=m,n},setter(m){return i.setter=m,n}};Object.defineProperty(n,"value",{get(){return i.getter()},set(m){let g=i.setter(m),_=t.serialize(g)!==t.serialize(n.raw);n.raw=g,_&&e.render()}});let p=this._observers.get(e);return p?(p.observed++,p.values.push(n)):this._observers.set(e,{observed:1,values:[n]}),n}static observer(e){return this._observers.get(e)||null}static serialize(e){return JSON.stringify(e)}};H.SignalRegistry=U;U._observers=new Map;function Zt(t,e=null){if(e||(e=Ut.default.get("current")||null),!e)throw nt.default.for("Signals can only be created within a Temple component");if(!e.initiated)return U.observe(e,t);let r=U.observer(e);if(!r)throw nt.default.for("State mismatch");return r.values[r.observed++%r.values.length]}});var ct=O(ye=>{"use strict";var lt=ye&&ye.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ye,"__esModule",{value:!0});var it=lt(be()),ot=lt(Q()),ut=(t,e)=>Array.from(t.querySelectorAll("*")).filter(r=>{let i=it.default.get(r);return i&&i.hasAttribute(e)}).map(r=>it.default.get(r));function Ie(t,e){ot.default.on("mounted",r=>{if(!r.detail)return;let i=r.detail;ut(i.shadowRoot||i,t).forEach(e)})}function Wt(t,e){ot.default.on("unmounted",r=>{if(!r.detail)return;let i=r.detail;ut(i.shadowRoot||i,t).forEach(e)})}Ie("mount",t=>{let e=t.getAttribute("mount");if(typeof e=="function"){let r=new CustomEvent("mount",{detail:{node:t,target:t.element}});e(r)}});Wt("unmount",t=>{let e=t.getAttribute("unmount");if(typeof e=="function"){let r=new CustomEvent("unmount",{detail:{node:t,target:t.element}});e(r)}});Ie("if",t=>{let e=t.getAttribute("if");(e===!1||e==="false"||typeof e=="function"&&!e())&&t.element.remove()});["click","dblclick","mousedown","mouseup","mousemove","mouseover","mouseout","wheel","keydown","keypress","keyup","blur","change","contextmenu","focus","input","submit","invalid","reset","search","select","copy","cut","paste","drag","dragstart","dragend","dragover","dragenter","dragleave","drop","scroll","durationchange","ended","error","loadeddata","loadedmetadata","loadstart","pause","play","playing","progress","ratechange","seeked","seeking","stalled","suspend","timeupdate","volumechange","waiting","animationstart","animationend","animationiteration","transitionend","toggle"].forEach(t=>Ie(t,e=>{let r=e.getAttribute(t);typeof r=="function"&&(e.element.removeEventListener(t,r),e.element.addEventListener(t,r))}))});var ze=O(h=>{"use strict";var Jt=h&&h.__createBinding||(Object.create?function(t,e,r,i){i===void 0&&(i=r);var n=Object.getOwnPropertyDescriptor(e,r);(!n||("get"in n?!e.__esModule:n.writable||n.configurable))&&(n={enumerable:!0,get:function(){return e[r]}}),Object.defineProperty(t,i,n)}:function(t,e,r,i){i===void 0&&(i=r),t[i]=e[r]}),Xt=h&&h.__setModuleDefault||(Object.create?function(t,e){Object.defineProperty(t,"default",{enumerable:!0,value:e})}:function(t,e){t.default=e}),we=h&&h.__importStar||function(t){if(t&&t.__esModule)return t;var e={};if(t!=null)for(var r in t)r!=="default"&&Object.prototype.hasOwnProperty.call(t,r)&&Jt(e,t,r);return Xt(e,t),e},N=h&&h.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(h,"__esModule",{value:!0});h.SignalRegistry=h.TempleException=h.TempleEmitter=h.TempleElement=h.TempleRegistry=h.TempleComponent=h.TempleDataMap=h.emitter=h.signal=h.innerHTML=h.children=h.classnames=h.props=h.env=h.data=void 0;var Yt=N(Me());h.TempleException=Yt.default;var Vt=N(Ve());h.TempleComponent=Vt.default;var Kt=N(be());h.TempleRegistry=Kt.default;var Qt=N($e());h.TempleElement=Qt.default;var dt=we(Q());h.emitter=dt.default;Object.defineProperty(h,"TempleEmitter",{enumerable:!0,get:function(){return dt.TempleEmitter}});var ft=we(z());h.data=ft.default;Object.defineProperty(h,"TempleDataMap",{enumerable:!0,get:function(){return ft.TempleDataMap}});var er=N(Ke());h.env=er.default;var tr=N(Re());h.props=tr.default;var rr=N(et());h.classnames=rr.default;var pt=we(rt());h.children=pt.default;Object.defineProperty(h,"innerHTML",{enumerable:!0,get:function(){return pt.innerHTML}});var gt=we(st());h.signal=gt.default;Object.defineProperty(h,"SignalRegistry",{enumerable:!0,get:function(){return gt.SignalRegistry}});ct()});var I=O((wr,ht)=>{ht.exports={...ze()}});var mt=O((xr,xe)=>{var nr=typeof window<"u"?window:typeof WorkerGlobalScope<"u"&&self instanceof WorkerGlobalScope?self:{};var c=function(t){var e=/(?:^|\s)lang(?:uage)?-([\w-]+)(?=\s|$)/i,r=0,i={},n={manual:t.Prism&&t.Prism.manual,disableWorkerMessageHandler:t.Prism&&t.Prism.disableWorkerMessageHandler,util:{encode:function s(a){return a instanceof p?new p(a.type,s(a.content),a.alias):Array.isArray(a)?a.map(s):a.replace(/&/g,"&").replace(/"u")return null;if("currentScript"in document)return document.currentScript;try{throw new Error}catch(o){var s=(/at [^(\r\n]*\((.*):[^:]+:[^:]+\)$/i.exec(o.stack)||[])[1];if(s){var a=document.getElementsByTagName("script");for(var l in a)if(a[l].src==s)return a[l]}return null}},isActive:function(s,a,l){for(var o="no-"+a;s;){var u=s.classList;if(u.contains(a))return!0;if(u.contains(o))return!1;s=s.parentElement}return!!l}},languages:{plain:i,plaintext:i,text:i,txt:i,extend:function(s,a){var l=n.util.clone(n.languages[s]);for(var o in a)l[o]=a[o];return l},insertBefore:function(s,a,l,o){o=o||n.languages;var u=o[s],f={};for(var b in u)if(u.hasOwnProperty(b)){if(b==a)for(var d in l)l.hasOwnProperty(d)&&(f[d]=l[d]);l.hasOwnProperty(b)||(f[b]=u[b])}var x=o[s];return o[s]=f,n.languages.DFS(n.languages,function(P,q){q===x&&P!=s&&(this[P]=f)}),f},DFS:function s(a,l,o,u){u=u||{};var f=n.util.objId;for(var b in a)if(a.hasOwnProperty(b)){l.call(a,b,a[b],o||b);var d=a[b],x=n.util.type(d);x==="Object"&&!u[f(d)]?(u[f(d)]=!0,s(d,l,null,u)):x==="Array"&&!u[f(d)]&&(u[f(d)]=!0,s(d,l,b,u))}}},plugins:{},highlightAll:function(s,a){n.highlightAllUnder(document,s,a)},highlightAllUnder:function(s,a,l){var o={callback:l,container:s,selector:'code[class*="language-"], [class*="language-"] code, code[class*="lang-"], [class*="lang-"] code'};n.hooks.run("before-highlightall",o),o.elements=Array.prototype.slice.apply(o.container.querySelectorAll(o.selector)),n.hooks.run("before-all-elements-highlight",o);for(var u=0,f;f=o.elements[u++];)n.highlightElement(f,a===!0,o.callback)},highlightElement:function(s,a,l){var o=n.util.getLanguage(s),u=n.languages[o];n.util.setLanguage(s,o);var f=s.parentElement;f&&f.nodeName.toLowerCase()==="pre"&&n.util.setLanguage(f,o);var b=s.textContent,d={element:s,language:o,grammar:u,code:b};function x(q){d.highlightedCode=q,n.hooks.run("before-insert",d),d.element.innerHTML=d.highlightedCode,n.hooks.run("after-highlight",d),n.hooks.run("complete",d),l&&l.call(d.element)}if(n.hooks.run("before-sanity-check",d),f=d.element.parentElement,f&&f.nodeName.toLowerCase()==="pre"&&!f.hasAttribute("tabindex")&&f.setAttribute("tabindex","0"),!d.code){n.hooks.run("complete",d),l&&l.call(d.element);return}if(n.hooks.run("before-highlight",d),!d.grammar){x(n.util.encode(d.code));return}if(a&&t.Worker){var P=new Worker(n.filename);P.onmessage=function(q){x(q.data)},P.postMessage(JSON.stringify({language:d.language,code:d.code,immediateClose:!0}))}else x(n.highlight(d.code,d.grammar,d.language))},highlight:function(s,a,l){var o={code:s,grammar:a,language:l};if(n.hooks.run("before-tokenize",o),!o.grammar)throw new Error('The language "'+o.language+'" has no grammar.');return o.tokens=n.tokenize(o.code,o.grammar),n.hooks.run("after-tokenize",o),p.stringify(n.util.encode(o.tokens),o.language)},tokenize:function(s,a){var l=a.rest;if(l){for(var o in l)a[o]=l[o];delete a.rest}var u=new _;return y(u,u.head,s),g(s,u,a,u.head,0),F(u)},hooks:{all:{},add:function(s,a){var l=n.hooks.all;l[s]=l[s]||[],l[s].push(a)},run:function(s,a){var l=n.hooks.all[s];if(!(!l||!l.length))for(var o=0,u;u=l[o++];)u(a)}},Token:p};t.Prism=n;function p(s,a,l,o){this.type=s,this.content=a,this.alias=l,this.length=(o||"").length|0}p.stringify=function s(a,l){if(typeof a=="string")return a;if(Array.isArray(a)){var o="";return a.forEach(function(x){o+=s(x,l)}),o}var u={type:a.type,content:s(a.content,l),tag:"span",classes:["token",a.type],attributes:{},language:l},f=a.alias;f&&(Array.isArray(f)?Array.prototype.push.apply(u.classes,f):u.classes.push(f)),n.hooks.run("wrap",u);var b="";for(var d in u.attributes)b+=" "+d+'="'+(u.attributes[d]||"").replace(/"/g,""")+'"';return"<"+u.tag+' class="'+u.classes.join(" ")+'"'+b+">"+u.content+""};function m(s,a,l,o){s.lastIndex=a;var u=s.exec(l);if(u&&o&&u[1]){var f=u[1].length;u.index+=f,u[0]=u[0].slice(f)}return u}function g(s,a,l,o,u,f){for(var b in l)if(!(!l.hasOwnProperty(b)||!l[b])){var d=l[b];d=Array.isArray(d)?d:[d];for(var x=0;x=f.reach);L+=j.value.length,j=j.next){var B=j.value;if(a.length>s.length)return;if(!(B instanceof p)){var ce=1,$;if(Ue){if($=m(Ze,L,s,Ge),!$||$.index>=s.length)break;var de=$.index,wt=$.index+$[0].length,R=L;for(R+=j.value.length;de>=R;)j=j.next,R+=j.value.length;if(R-=j.value.length,L=R,j.value instanceof p)continue;for(var V=j;V!==a.tail&&(Rf.reach&&(f.reach=Se);var pe=j.prev;ke&&(pe=y(a,pe,ke),L+=ke.length),A(a,pe,ce);var At=new p(b,q?n.tokenize(fe,q):fe,vt,fe);if(j=y(a,pe,At),We&&y(a,j,We),ce>1){var Pe={cause:b+","+x,reach:Se};g(s,a,l,j.prev,L,Pe),f&&Pe.reach>f.reach&&(f.reach=Pe.reach)}}}}}}function _(){var s={value:null,prev:null,next:null},a={value:null,prev:s,next:null};s.next=a,this.head=s,this.tail=a,this.length=0}function y(s,a,l){var o=a.next,u={value:l,prev:a,next:o};return a.next=u,o.prev=u,s.length++,u}function A(s,a,l){for(var o=a.next,u=0;u/,greedy:!0},prolog:{pattern:/<\?[\s\S]+?\?>/,greedy:!0},doctype:{pattern:/"'[\]]|"[^"]*"|'[^']*')+(?:\[(?:[^<"'\]]|"[^"]*"|'[^']*'|<(?!!--)|)*\]\s*)?>/i,greedy:!0,inside:{"internal-subset":{pattern:/(^[^\[]*\[)[\s\S]+(?=\]>$)/,lookbehind:!0,greedy:!0,inside:null},string:{pattern:/"[^"]*"|'[^']*'/,greedy:!0},punctuation:/^$|[[\]]/,"doctype-tag":/^DOCTYPE/i,name:/[^\s<>'"]+/}},cdata:{pattern://i,greedy:!0},tag:{pattern:/<\/?(?!\d)[^\s>\/=$<%]+(?:\s(?:\s*[^\s>\/=]+(?:\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))|(?=[\s/>])))+)?\s*\/?>/,greedy:!0,inside:{tag:{pattern:/^<\/?[^\s>\/]+/,inside:{punctuation:/^<\/?/,namespace:/^[^\s>\/:]+:/}},"special-attr":[],"attr-value":{pattern:/=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+)/,inside:{punctuation:[{pattern:/^=/,alias:"attr-equals"},{pattern:/^(\s*)["']|["']$/,lookbehind:!0}]}},punctuation:/\/?>/,"attr-name":{pattern:/[^\s>\/]+/,inside:{namespace:/^[^\s>\/:]+:/}}}},entity:[{pattern:/&[\da-z]{1,8};/i,alias:"named-entity"},/&#x?[\da-f]{1,8};/i]};c.languages.markup.tag.inside["attr-value"].inside.entity=c.languages.markup.entity;c.languages.markup.doctype.inside["internal-subset"].inside=c.languages.markup;c.hooks.add("wrap",function(t){t.type==="entity"&&(t.attributes.title=t.content.replace(/&/,"&"))});Object.defineProperty(c.languages.markup.tag,"addInlined",{value:function(e,r){var i={};i["language-"+r]={pattern:/(^$)/i,lookbehind:!0,inside:c.languages[r]},i.cdata=/^$/i;var n={"included-cdata":{pattern://i,inside:i}};n["language-"+r]={pattern:/[\s\S]+/,inside:c.languages[r]};var p={};p[e]={pattern:RegExp(/(<__[^>]*>)(?:))*\]\]>|(?!)/.source.replace(/__/g,function(){return e}),"i"),lookbehind:!0,greedy:!0,inside:n},c.languages.insertBefore("markup","cdata",p)}});Object.defineProperty(c.languages.markup.tag,"addAttribute",{value:function(t,e){c.languages.markup.tag.inside["special-attr"].push({pattern:RegExp(/(^|["'\s])/.source+"(?:"+t+")"+/\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))/.source,"i"),lookbehind:!0,inside:{"attr-name":/^[^\s=]+/,"attr-value":{pattern:/=[\s\S]+/,inside:{value:{pattern:/(^=\s*(["']|(?!["'])))\S[\s\S]*(?=\2$)/,lookbehind:!0,alias:[e,"language-"+e],inside:c.languages[e]},punctuation:[{pattern:/^=/,alias:"attr-equals"},/"|'/]}}}})}});c.languages.html=c.languages.markup;c.languages.mathml=c.languages.markup;c.languages.svg=c.languages.markup;c.languages.xml=c.languages.extend("markup",{});c.languages.ssml=c.languages.xml;c.languages.atom=c.languages.xml;c.languages.rss=c.languages.xml;(function(t){var e=/(?:"(?:\\(?:\r\n|[\s\S])|[^"\\\r\n])*"|'(?:\\(?:\r\n|[\s\S])|[^'\\\r\n])*')/;t.languages.css={comment:/\/\*[\s\S]*?\*\//,atrule:{pattern:RegExp("@[\\w-](?:"+/[^;{\s"']|\s+(?!\s)/.source+"|"+e.source+")*?"+/(?:;|(?=\s*\{))/.source),inside:{rule:/^@[\w-]+/,"selector-function-argument":{pattern:/(\bselector\s*\(\s*(?![\s)]))(?:[^()\s]|\s+(?![\s)])|\((?:[^()]|\([^()]*\))*\))+(?=\s*\))/,lookbehind:!0,alias:"selector"},keyword:{pattern:/(^|[^\w-])(?:and|not|only|or)(?![\w-])/,lookbehind:!0}}},url:{pattern:RegExp("\\burl\\((?:"+e.source+"|"+/(?:[^\\\r\n()"']|\\[\s\S])*/.source+")\\)","i"),greedy:!0,inside:{function:/^url/i,punctuation:/^\(|\)$/,string:{pattern:RegExp("^"+e.source+"$"),alias:"url"}}},selector:{pattern:RegExp(`(^|[{}\\s])[^{}\\s](?:[^{};"'\\s]|\\s+(?![\\s{])|`+e.source+")*(?=\\s*\\{)"),lookbehind:!0},string:{pattern:e,greedy:!0},property:{pattern:/(^|[^-\w\xA0-\uFFFF])(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*(?=\s*:)/i,lookbehind:!0},important:/!important\b/i,function:{pattern:/(^|[^-a-z0-9])[-a-z0-9]+(?=\()/i,lookbehind:!0},punctuation:/[(){};:,]/},t.languages.css.atrule.inside.rest=t.languages.css;var r=t.languages.markup;r&&(r.tag.addInlined("style","css"),r.tag.addAttribute("style","css"))})(c);c.languages.clike={comment:[{pattern:/(^|[^\\])\/\*[\s\S]*?(?:\*\/|$)/,lookbehind:!0,greedy:!0},{pattern:/(^|[^\\:])\/\/.*/,lookbehind:!0,greedy:!0}],string:{pattern:/(["'])(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/,greedy:!0},"class-name":{pattern:/(\b(?:class|extends|implements|instanceof|interface|new|trait)\s+|\bcatch\s+\()[\w.\\]+/i,lookbehind:!0,inside:{punctuation:/[.\\]/}},keyword:/\b(?:break|catch|continue|do|else|finally|for|function|if|in|instanceof|new|null|return|throw|try|while)\b/,boolean:/\b(?:false|true)\b/,function:/\b\w+(?=\()/,number:/\b0x[\da-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:e[+-]?\d+)?/i,operator:/[<>]=?|[!=]=?=?|--?|\+\+?|&&?|\|\|?|[?*/~^%]/,punctuation:/[{}[\];(),.:]/};c.languages.javascript=c.languages.extend("clike",{"class-name":[c.languages.clike["class-name"],{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$A-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\.(?:constructor|prototype))/,lookbehind:!0}],keyword:[{pattern:/((?:^|\})\s*)catch\b/,lookbehind:!0},{pattern:/(^|[^.]|\.\.\.\s*)\b(?:as|assert(?=\s*\{)|async(?=\s*(?:function\b|\(|[$\w\xA0-\uFFFF]|$))|await|break|case|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally(?=\s*(?:\{|$))|for|from(?=\s*(?:['"]|$))|function|(?:get|set)(?=\s*(?:[#\[$\w\xA0-\uFFFF]|$))|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)\b/,lookbehind:!0}],function:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*(?:\.\s*(?:apply|bind|call)\s*)?\()/,number:{pattern:RegExp(/(^|[^\w$])/.source+"(?:"+(/NaN|Infinity/.source+"|"+/0[bB][01]+(?:_[01]+)*n?/.source+"|"+/0[oO][0-7]+(?:_[0-7]+)*n?/.source+"|"+/0[xX][\dA-Fa-f]+(?:_[\dA-Fa-f]+)*n?/.source+"|"+/\d+(?:_\d+)*n/.source+"|"+/(?:\d+(?:_\d+)*(?:\.(?:\d+(?:_\d+)*)?)?|\.\d+(?:_\d+)*)(?:[Ee][+-]?\d+(?:_\d+)*)?/.source)+")"+/(?![\w$])/.source),lookbehind:!0},operator:/--|\+\+|\*\*=?|=>|&&=?|\|\|=?|[!=]==|<<=?|>>>?=?|[-+*/%&|^!=<>]=?|\.{3}|\?\?=?|\?\.?|[~:]/});c.languages.javascript["class-name"][0].pattern=/(\b(?:class|extends|implements|instanceof|interface|new)\s+)[\w.\\]+/;c.languages.insertBefore("javascript","keyword",{regex:{pattern:RegExp(/((?:^|[^$\w\xA0-\uFFFF."'\])\s]|\b(?:return|yield))\s*)/.source+/\//.source+"(?:"+/(?:\[(?:[^\]\\\r\n]|\\.)*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}/.source+"|"+/(?:\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.)*\])*\])*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}v[dgimyus]{0,7}/.source+")"+/(?=(?:\s|\/\*(?:[^*]|\*(?!\/))*\*\/)*(?:$|[\r\n,.;:})\]]|\/\/))/.source),lookbehind:!0,greedy:!0,inside:{"regex-source":{pattern:/^(\/)[\s\S]+(?=\/[a-z]*$)/,lookbehind:!0,alias:"language-regex",inside:c.languages.regex},"regex-delimiter":/^\/|\/$/,"regex-flags":/^[a-z]+$/}},"function-variable":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*[=:]\s*(?:async\s*)?(?:\bfunction\b|(?:\((?:[^()]|\([^()]*\))*\)|(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)\s*=>))/,alias:"function"},parameter:[{pattern:/(function(?:\s+(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)?\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\))/,lookbehind:!0,inside:c.languages.javascript},{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$a-z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*=>)/i,lookbehind:!0,inside:c.languages.javascript},{pattern:/(\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*=>)/,lookbehind:!0,inside:c.languages.javascript},{pattern:/((?:\b|\s|^)(?!(?:as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)(?![$\w\xA0-\uFFFF]))(?:(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*)\(\s*|\]\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*\{)/,lookbehind:!0,inside:c.languages.javascript}],constant:/\b[A-Z](?:[A-Z_]|\dx?)*\b/});c.languages.insertBefore("javascript","string",{hashbang:{pattern:/^#!.*/,greedy:!0,alias:"comment"},"template-string":{pattern:/`(?:\\[\s\S]|\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}|(?!\$\{)[^\\`])*`/,greedy:!0,inside:{"template-punctuation":{pattern:/^`|`$/,alias:"string"},interpolation:{pattern:/((?:^|[^\\])(?:\\{2})*)\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}/,lookbehind:!0,inside:{"interpolation-punctuation":{pattern:/^\$\{|\}$/,alias:"punctuation"},rest:c.languages.javascript}},string:/[\s\S]+/}},"string-property":{pattern:/((?:^|[,{])[ \t]*)(["'])(?:\\(?:\r\n|[\s\S])|(?!\2)[^\\\r\n])*\2(?=\s*:)/m,lookbehind:!0,greedy:!0,alias:"property"}});c.languages.insertBefore("javascript","operator",{"literal-property":{pattern:/((?:^|[,{])[ \t]*)(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*:)/m,lookbehind:!0,alias:"property"}});c.languages.markup&&(c.languages.markup.tag.addInlined("script","javascript"),c.languages.markup.tag.addAttribute(/on(?:abort|blur|change|click|composition(?:end|start|update)|dblclick|error|focus(?:in|out)?|key(?:down|up)|load|mouse(?:down|enter|leave|move|out|over|up)|reset|resize|scroll|select|slotchange|submit|unload|wheel)/.source,"javascript"));c.languages.js=c.languages.javascript;(function(){if(typeof c>"u"||typeof document>"u")return;Element.prototype.matches||(Element.prototype.matches=Element.prototype.msMatchesSelector||Element.prototype.webkitMatchesSelector);var t="Loading\u2026",e=function(T,v){return"\u2716 Error "+T+" while fetching file: "+v},r="\u2716 Error: File does not exist or is empty",i={js:"javascript",py:"python",rb:"ruby",ps1:"powershell",psm1:"powershell",sh:"bash",bat:"batch",h:"c",tex:"latex"},n="data-src-status",p="loading",m="loaded",g="failed",_="pre[data-src]:not(["+n+'="'+m+'"]):not(['+n+'="'+p+'"])';function y(T,v,E){var s=new XMLHttpRequest;s.open("GET",T,!0),s.onreadystatechange=function(){s.readyState==4&&(s.status<400&&s.responseText?v(s.responseText):s.status>=400?E(e(s.status,s.statusText)):E(r))},s.send(null)}function A(T){var v=/^\s*(\d+)\s*(?:(,)\s*(?:(\d+)\s*)?)?$/.exec(T||"");if(v){var E=Number(v[1]),s=v[2],a=v[3];return s?a?[E,Number(a)]:[E,void 0]:[E,E]}}c.hooks.add("before-highlightall",function(T){T.selector+=", "+_}),c.hooks.add("before-sanity-check",function(T){var v=T.element;if(v.matches(_)){T.code="",v.setAttribute(n,p);var E=v.appendChild(document.createElement("CODE"));E.textContent=t;var s=v.getAttribute("data-src"),a=T.language;if(a==="none"){var l=(/\.(\w+)$/.exec(s)||[,"none"])[1];a=i[l]||l}c.util.setLanguage(E,a),c.util.setLanguage(v,a);var o=c.plugins.autoloader;o&&o.loadLanguages(a),y(s,function(u){v.setAttribute(n,m);var f=A(v.getAttribute("data-range"));if(f){var b=u.split(/\r\n?|\n/g),d=f[0],x=f[1]==null?b.length:f[1];d<0&&(d+=b.length),d=Math.max(0,Math.min(d-1,b.length)),x<0&&(x+=b.length),x=Math.max(0,Math.min(x,b.length)),u=b.slice(d,x).join(`
-`),v.hasAttribute("data-start")||v.setAttribute("data-start",String(d+1))}E.textContent=u,c.highlightElement(E)},function(u){v.setAttribute(n,g),E.textContent=u})}}),c.plugins.fileHighlight={highlight:function(v){for(var E=(v||document).querySelectorAll(_),s=0,a;a=E[s++];)c.highlightElement(a)}};var F=!1;c.fileHighlight=function(){F||(console.warn("Prism.fileHighlight is deprecated. Use `Prism.plugins.fileHighlight.highlight` instead."),F=!0),c.plugins.fileHighlight.highlight.apply(this,arguments)}})()});var oe=O((Tr,bt)=>{bt.exports={...ze()}});var ir={};St(ir,{BUILD_ID:()=>sr,TempleComponent:()=>k.TempleComponent,TempleElement:()=>k.TempleElement,TempleEmitter:()=>k.TempleEmitter,TempleException:()=>k.TempleException,TempleRegistry:()=>k.TempleRegistry,children:()=>k.children,components:()=>ar,data:()=>k.data,emitter:()=>k.emitter,props:()=>k.props,signal:()=>k.signal});var C=D(I());var Ae=D(I()),Z=class extends Ae.TempleComponent{static component=["main","Main_fd7f1af6410c5b5c8e1f"];styles(){return""}template(){let e=this.props,r=()=>this.originalChildren;return()=>[Ae.TempleRegistry.createElement("main",{},[...this._toNodeList(r())]).element]}};var w=D(I()),He=D(mt()),_t=D(oe()),W=class extends w.TempleComponent{static component=["code","Code_6f36bc13bb6a166c7abc"];styles(){return`:host {
+var TempleAPI=(()=>{var Zt=Object.create;var Oe=Object.defineProperty;var Jt=Object.getOwnPropertyDescriptor;var Xt=Object.getOwnPropertyNames;var Yt=Object.getPrototypeOf,Vt=Object.prototype.hasOwnProperty;var M=(t,e)=>()=>(e||t((e={exports:{}}).exports,e),e.exports),Kt=(t,e)=>{for(var r in e)Oe(t,r,{get:e[r],enumerable:!0})},vt=(t,e,r,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let n of Xt(e))!Vt.call(t,n)&&n!==r&&Oe(t,n,{get:()=>e[n],enumerable:!(i=Jt(e,n))||i.enumerable});return t};var T=(t,e,r)=>(r=t!=null?Zt(Yt(t)):{},vt(e||!t||!t.__esModule?Oe(r,"default",{value:t,enumerable:!0}):r,t)),Qt=t=>vt(Oe({},"__esModule",{value:!0}),t);var _e=M(st=>{"use strict";Object.defineProperty(st,"__esModule",{value:!0});var nt=class extends Error{static for(e,...r){return r.forEach(function(i){e=e.replace("%s",i)}),new this(e)}static forErrorsFound(e){let r=new this("Invalid Parameters");return r.errors=e,r}static require(e,r,...i){if(!e){for(let n of i)r=r.replace("%s",n);throw new this(r)}}constructor(e,r=500){super(),this.errors={},this.start=0,this.end=0,this.message=e,this.name=this.constructor.name,this.code=r}withCode(e){return this.code=e,this}withPosition(e,r){return this.start=e,this.end=r,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};st.default=nt});var Re=M(j=>{"use strict";var er=j&&j.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(j,"__esModule",{value:!0});j.match=j.TempleEmitter=j.events=void 0;j.bindAttribute=B;j.unbindAttribute=xt;var yt=er(qe());j.events=["click","dblclick","mousedown","mouseup","mousemove","mouseover","mouseout","wheel","keydown","keypress","keyup","blur","change","contextmenu","focus","input","submit","invalid","reset","search","select","copy","cut","paste","drag","dragstart","dragend","dragover","dragenter","dragleave","drop","scroll","durationchange","ended","error","loadeddata","loadedmetadata","loadstart","pause","play","playing","progress","ratechange","seeked","seeking","stalled","suspend","timeupdate","volumechange","waiting","animationstart","animationend","animationiteration","transitionend","toggle"];var $e=class extends EventTarget{emit(e,r){return this.dispatchEvent(new CustomEvent(e,{detail:r})),this}on(e,r){if(e==="ready"&&document.readyState!=="loading"){let i=new CustomEvent("ready");return setTimeout(()=>r(i),1),this}return this.addEventListener(e,r),this}once(e,r){let i=n=>{this.unbind(e,i),r(n)};return this.on(e,i),this}unbind(e,r){return this.removeEventListener(e,r),this}};j.TempleEmitter=$e;var tr=(t,e)=>Array.from(t.querySelectorAll("*")).filter(r=>{let i=yt.default.get(r),n=i&&i.hasAttribute(e)&&!i.hasEvent(e);return n&&i.addEvent(e),n}).map(r=>yt.default.get(r));j.match=tr;function B(t,e){Ne.on("mounted",r=>{if(!r.detail)return;let i=r.detail;(0,j.match)(i.shadowRoot||i,t).forEach(e)})}function xt(t,e){Ne.on("unmounted",r=>{if(!r.detail)return;let i=r.detail;(0,j.match)(i.shadowRoot||i,t).forEach(e)})}var Ne=new $e;j.default=(document.onreadystatechange=()=>{document.readyState!=="loading"&&Ne.emit("ready")},B("mount",t=>{let e=t.getAttribute("mount");if(typeof e=="function"){let r=new CustomEvent("mount",{detail:{node:t,target:t.element}});e(r)}}),xt("unmount",t=>{let e=t.getAttribute("unmount");if(typeof e=="function"){let r=new CustomEvent("unmount",{detail:{node:t,target:t.element}});e(r)}}),B("connect",t=>{let e=t.getAttribute("connect");if(typeof e=="function"){let r=new CustomEvent("connect",{detail:{node:t,target:t.element}});e(r)}}),B("disconnect",t=>{let e=t.getAttribute("disconnect");if(typeof e=="function"){let r=new CustomEvent("disconnect",{detail:{node:t,target:t.element}});e(r)}}),B("adopt",t=>{let e=t.getAttribute("adopt");if(typeof e=="function"){let r=new CustomEvent("adopt",{detail:{node:t,target:t.element}});e(r)}}),B("if",t=>{let e=t.getAttribute("if");(e===!1||e==="false"||typeof e=="function"&&!e())&&t.element.remove()}),j.events.forEach(t=>B(t,e=>{let r=e.getAttribute(t);typeof r=="function"&&(e.element.removeEventListener(t,r),e.element.addEventListener(t,r))})),Ne)});var lt=M(ve=>{"use strict";var rr=ve&&ve.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ve,"__esModule",{value:!0});var at=rr(Re()),it=class{get attributes(){return Object.assign({},this._attributes)}get element(){return this._element}get events(){return this._events}constructor(e,r){this._events=new Set,this._element=e,this._attributes=r}addEvent(e){return this._events.add(e),this}getAttribute(e){return this._attributes[e]}hasAttribute(e){return e in this._attributes}hasEvent(e){return this._events.has(e)}removeAttribute(e,r=!1){let i=this.getAttribute(e);return typeof i>"u"?this:(delete this._attributes[e],this._element.removeAttribute(e),r||at.default.emit("attribute-remove",{element:this,key:e,previous:i}),this)}setAttribute(e,r,i=!1){if(typeof r>"u")return this.removeAttribute(e,i);let n=this.getAttribute(e);return n===r?this:(this._attributes[e]=r,typeof r=="string"&&this._element.setAttribute(e,r),i||(typeof n>"u"?at.default.emit("attribute-create",{element:this,key:e,value:r}):at.default.emit("attribute-update",{element:this,key:e,value:r,previous:n})),this)}setAttributes(e,r=!1){for(let[n,d]of Object.entries(e))this.setAttribute(n,d,r);let i=Object.keys(e);for(let n of Object.keys(this._attributes))i.includes(n)||this.removeAttribute(n,r);return this}};ve.default=it});var qe=M(ye=>{"use strict";var nr=ye&&ye.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ye,"__esModule",{value:!0});var sr=nr(lt()),At=document.createElement("textarea"),ar=t=>(At.innerHTML=t,At.value),He=class{static get elements(){return this._elements}static createComponent(e,r,i,n=[]){let d=document.createElement("template");d.innerHTML=`<${e}>`;let b=d.content.querySelector(`${e}`);return Object.setPrototypeOf(b,r.prototype),b.constructor=r.constructor,b.constructor.component=r.component,b.register(i,n),b.element}static createElement(e,r,i=[]){let n=document.createElement(e);for(let[d,_]of Object.entries(r))typeof _=="string"?n.setAttribute(d,_):_===!0&&n.setAttribute(d,d);return i.filter(d=>typeof d<"u").forEach(d=>n.appendChild(d)),this.register(n,r)}static createText(e,r=!0){return document.createTextNode(ar(e))}static filter(e){let r=[];return this._elements.forEach((i,n)=>{e(i,n)&&r.push(i)}),r}static get(e){return this._elements.get(e)||null}static has(e){return this._elements.has(e)}static map(e){let r=[];return this._elements.forEach((i,n)=>{r.push(e(i,n))}),r}static register(e,r){if(this.has(e))return this.get(e);let i=new sr.default(e,r||{});return this._elements.set(e,i),i}};He._elements=new Map;ye.default=He});var ee=M(xe=>{"use strict";Object.defineProperty(xe,"__esModule",{value:!0});xe.TempleDataMap=void 0;var Ie=class{constructor(){window.__APP_DATA__||(window.__APP_DATA__={})}clear(){return window.__APP_DATA__={},this}delete(e){return this.has(e)?(delete window.__APP_DATA__[e],!0):!1}entries(){return Object.entries(window.__APP_DATA__)}has(e){return e in window.__APP_DATA__}get(e){return window.__APP_DATA__[e]}keys(){return Object.keys(window.__APP_DATA__)}set(e,r){return window.__APP_DATA__[e]=r,this}values(){return Object.values(window.__APP_DATA__)}};xe.TempleDataMap=Ie;var ir=new Ie;xe.default=ir});var Tt=M(Ae=>{"use strict";var Be=Ae&&Ae.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Ae,"__esModule",{value:!0});var wt=Be(_e()),G=Be(qe()),W=Be(Re()),ze=Be(ee()),ot=class t extends HTMLElement{static register(){customElements.define(this.component[0],this)}get attr(){return Object.fromEntries(Array.from(this.attributes).map(e=>[e.name,e.value]))}get element(){if(!G.default.has(this))throw wt.default.for("Component not mapped.");return G.default.get(this)}get metadata(){let[e,r]=this.constructor.component;return{tagname:e,classname:r}}get originalChildren(){return this._children}get initiated(){return this._initiated}get props(){return this.getAttributes()}get virtual(){return this._virtual}set props(e){this.setAttributes(e)}constructor(){if(super(),this._initiated=!1,this._template=null,this._children=void 0,this._rendering=!1,this._observer=null,this._virtual=!1,!G.default.has(this))throw wt.default.for("Component not mapped.")}adoptedCallback(){this.render(),W.default.emit("adopt",this)}connectedCallback(){this.wait(),W.default.emit("connect",this)}disconnectedCallback(){W.default.emit("disconnect",this)}getAttribute(e){return this.element.getAttribute(e)}getAttributes(){return Object.assign({},this.element.attributes)}getParentComponent(){let e=this.parentElement;for(;e;){if(e instanceof t)return e;e=e.parentElement}return null}hasAttribute(e){return this.element.hasAttribute(e)}register(e={},r=[]){G.default.has(this)?G.default.get(this).setAttributes(e):G.default.register(this,e);for(let[i,n]of Object.entries(e))typeof n=="string"?super.setAttribute(i,n):n===!0&&super.setAttribute(i,i);this._children=r,this._virtual=!0,this.connectedCallback()}removeAttribute(e){this.hasAttribute(e)&&this.element.removeAttribute(e),super.hasAttribute(e)&&super.removeAttribute(e)}render(){let e=this.getParentComponent();if(e&&!e.initiated)return;if(this._rendering)return;this._rendering=!0;let r=ze.default.get("current");ze.default.set("current",this);let i=this.styles();this._template?W.default.emit("unmounted",this):this._template=this.template();let n=this._template().filter(Boolean);if(i.length===0)this.textContent="",n.forEach(d=>this.appendChild(d));else{this.shadowRoot||this.attachShadow({mode:"open"});let d=this.shadowRoot;this.textContent="",d.textContent="";let _=document.createElement("style");_.innerText=i,d.appendChild(_),n.forEach(b=>{var v;return(v=this.shadowRoot)===null||v===void 0?void 0:v.appendChild(b)})}return r?ze.default.set("current",r):ze.default.delete("current"),this._initiated=!0,this._rendering=!1,W.default.emit("mounted",this),this.shadowRoot?this.shadowRoot.innerHTML:this.innerHTML}setAttribute(e,r){this.element.setAttribute(e,r),(typeof r=="string"||r===!0)&&super.setAttribute(e,r)}setAttributes(e){this.element.setAttributes(e)}wait(){if(document.readyState!=="loading")this._update();else{let e=()=>{this._update(),W.default.unbind("ready",e)};W.default.on("ready",e)}}_toNodeList(e){return e instanceof Node?[e]:Array.isArray(e)&&e.every(r=>r instanceof Node)?e:[G.default.createText(String(e))]}_update(){typeof this._children>"u"&&(this._children=Array.from(this.childNodes||[])),this._initiated||this.render()}};Ae.default=ot});var te=M(we=>{"use strict";var Et=we&&we.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(we,"__esModule",{value:!0});we.default=ur;var lr=Et(_e()),or=Et(ee());function ur(t=null,e=!1){if(!t&&(t=or.default.get("current"),!t)){if(!e)throw lr.default.for("Not called within a Temple component");return null}return t}});var kt=M(Te=>{"use strict";var cr=Te&&Te.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Te,"__esModule",{value:!0});var dr=cr(ee());function fr(t){let e=dr.default.get("env")||{};return t?e[t]||null:e}Te.default=fr});var ut=M(Ee=>{"use strict";var Ft=Ee&&Ee.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Ee,"__esModule",{value:!0});Ee.default=hr;var pr=Ft(te()),mr=Ft(ee());function hr(t=null){let e=(0,pr.default)(t,!0);return typeof e=="string"?mr.default.get("props")||{}:e?e.props:{}}});var Pt=M(re=>{"use strict";var Lt=re&&re.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(re,"__esModule",{value:!0});re.classlist=_r;re.default=vr;var gr=Lt(te()),br=Lt(ut());function _r(t=null){var e;if(t==="body")return document.body.classList;if(t==="head")return document.head.classList;if(t==="document")return(e=document.body.parentElement)===null||e===void 0?void 0:e.classList;let r=(0,gr.default)(t);return r?.classList}function vr(t=null){return(0,br.default)(t).class}});var St=M(U=>{"use strict";var yr=U&&U.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(U,"__esModule",{value:!0});U.innerHTML=Ar;U.innerText=wr;U.default=ct;var xr=yr(te());function Ar(t=null){let e=ct(t),r=document.createElement("template");return r.append(...e.map(i=>i.cloneNode(!0))),r.innerHTML}function wr(t=null){let e=ct(t),r=document.createElement("template");return r.append(...e.map(i=>i.cloneNode(!0))),r.innerText}function ct(t=null){let e=(0,xr.default)(t,!0);return typeof e!="string"&&e?e.originalChildren||[]:[]}});var Mt=M(Z=>{"use strict";var Ct=Z&&Z.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Z,"__esModule",{value:!0});Z.SignalRegistry=void 0;Z.default=kr;var Tr=Ct(te()),Er=Ct(_e()),ne=class t{static observe(e,r){let i={getter:()=>d.raw,setter:b=>b},n=new Set,d={raw:r,change(b){n.add(b)},getter(b){return i.getter=b,d},setter(b){return i.setter=b,d}};Object.defineProperty(d,"value",{get(){return i.getter()},set(b){let v=i.setter(b),x=t.serialize(v)!==t.serialize(d.raw);d.raw=v,x&&(n.forEach(h=>h(v)),e.render())}});let _=this._observers.get(e);return _?(_.observed++,_.values.push(d)):this._observers.set(e,{observed:1,values:[d]}),d}static observer(e){return this._observers.get(e)||null}static serialize(e){return JSON.stringify(e)}};Z.SignalRegistry=ne;ne._observers=new Map;function kr(t,e=null){let r=(0,Tr.default)(e);if(!r.initiated)return ne.observe(r,t);let i=ne.observer(r);if(!i)throw Er.default.for("Signal state mismatch");return i.values[i.observed++%i.values.length]}});var ft=M(m=>{"use strict";var Fr=m&&m.__createBinding||(Object.create?function(t,e,r,i){i===void 0&&(i=r);var n=Object.getOwnPropertyDescriptor(e,r);(!n||("get"in n?!e.__esModule:n.writable||n.configurable))&&(n={enumerable:!0,get:function(){return e[r]}}),Object.defineProperty(t,i,n)}:function(t,e,r,i){i===void 0&&(i=r),t[i]=e[r]}),Lr=m&&m.__setModuleDefault||(Object.create?function(t,e){Object.defineProperty(t,"default",{enumerable:!0,value:e})}:function(t,e){t.default=e}),ke=m&&m.__importStar||function(t){if(t&&t.__esModule)return t;var e={};if(t!=null)for(var r in t)r!=="default"&&Object.prototype.hasOwnProperty.call(t,r)&&Fr(e,t,r);return Lr(e,t),e},J=m&&m.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(m,"__esModule",{value:!0});m.SignalRegistry=m.TempleException=m.TempleEmitter=m.TempleElement=m.TempleRegistry=m.TempleComponent=m.TempleDataMap=m.emitter=m.signal=m.innerHTML=m.innerText=m.children=m.classnames=m.classlist=m.props=m.env=m.data=m.component=void 0;var Pr=J(_e());m.TempleException=Pr.default;var Sr=J(Tt());m.TempleComponent=Sr.default;var Cr=J(qe());m.TempleRegistry=Cr.default;var Mr=J(lt());m.TempleElement=Mr.default;var jt=ke(Re());m.emitter=jt.default;Object.defineProperty(m,"TempleEmitter",{enumerable:!0,get:function(){return jt.TempleEmitter}});var jr=J(te());m.component=jr.default;var Dt=ke(ee());m.data=Dt.default;Object.defineProperty(m,"TempleDataMap",{enumerable:!0,get:function(){return Dt.TempleDataMap}});var Dr=J(kt());m.env=Dr.default;var Or=J(ut());m.props=Or.default;var Ot=ke(Pt());m.classnames=Ot.default;Object.defineProperty(m,"classlist",{enumerable:!0,get:function(){return Ot.classlist}});var dt=ke(St());m.children=dt.default;Object.defineProperty(m,"innerHTML",{enumerable:!0,get:function(){return dt.innerHTML}});Object.defineProperty(m,"innerText",{enumerable:!0,get:function(){return dt.innerText}});var $t=ke(Mt());m.signal=$t.default;Object.defineProperty(m,"SignalRegistry",{enumerable:!0,get:function(){return $t.SignalRegistry}})});var D=M((tn,Nt)=>{Nt.exports={...ft()}});var $=M((rn,Rt)=>{Rt.exports={...ft()}});var Ht=M((mn,Ke)=>{var $r=typeof window<"u"?window:typeof WorkerGlobalScope<"u"&&self instanceof WorkerGlobalScope?self:{};var c=function(t){var e=/(?:^|\s)lang(?:uage)?-([\w-]+)(?=\s|$)/i,r=0,i={},n={manual:t.Prism&&t.Prism.manual,disableWorkerMessageHandler:t.Prism&&t.Prism.disableWorkerMessageHandler,util:{encode:function s(a){return a instanceof d?new d(a.type,s(a.content),a.alias):Array.isArray(a)?a.map(s):a.replace(/&/g,"&").replace(/"u")return null;if("currentScript"in document)return document.currentScript;try{throw new Error}catch(o){var s=(/at [^(\r\n]*\((.*):[^:]+:[^:]+\)$/i.exec(o.stack)||[])[1];if(s){var a=document.getElementsByTagName("script");for(var l in a)if(a[l].src==s)return a[l]}return null}},isActive:function(s,a,l){for(var o="no-"+a;s;){var u=s.classList;if(u.contains(a))return!0;if(u.contains(o))return!1;s=s.parentElement}return!!l}},languages:{plain:i,plaintext:i,text:i,txt:i,extend:function(s,a){var l=n.util.clone(n.languages[s]);for(var o in a)l[o]=a[o];return l},insertBefore:function(s,a,l,o){o=o||n.languages;var u=o[s],p={};for(var y in u)if(u.hasOwnProperty(y)){if(y==a)for(var f in l)l.hasOwnProperty(f)&&(p[f]=l[f]);l.hasOwnProperty(y)||(p[y]=u[y])}var F=o[s];return o[s]=p,n.languages.DFS(n.languages,function(S,I){I===F&&S!=s&&(this[S]=p)}),p},DFS:function s(a,l,o,u){u=u||{};var p=n.util.objId;for(var y in a)if(a.hasOwnProperty(y)){l.call(a,y,a[y],o||y);var f=a[y],F=n.util.type(f);F==="Object"&&!u[p(f)]?(u[p(f)]=!0,s(f,l,null,u)):F==="Array"&&!u[p(f)]&&(u[p(f)]=!0,s(f,l,y,u))}}},plugins:{},highlightAll:function(s,a){n.highlightAllUnder(document,s,a)},highlightAllUnder:function(s,a,l){var o={callback:l,container:s,selector:'code[class*="language-"], [class*="language-"] code, code[class*="lang-"], [class*="lang-"] code'};n.hooks.run("before-highlightall",o),o.elements=Array.prototype.slice.apply(o.container.querySelectorAll(o.selector)),n.hooks.run("before-all-elements-highlight",o);for(var u=0,p;p=o.elements[u++];)n.highlightElement(p,a===!0,o.callback)},highlightElement:function(s,a,l){var o=n.util.getLanguage(s),u=n.languages[o];n.util.setLanguage(s,o);var p=s.parentElement;p&&p.nodeName.toLowerCase()==="pre"&&n.util.setLanguage(p,o);var y=s.textContent,f={element:s,language:o,grammar:u,code:y};function F(I){f.highlightedCode=I,n.hooks.run("before-insert",f),f.element.innerHTML=f.highlightedCode,n.hooks.run("after-highlight",f),n.hooks.run("complete",f),l&&l.call(f.element)}if(n.hooks.run("before-sanity-check",f),p=f.element.parentElement,p&&p.nodeName.toLowerCase()==="pre"&&!p.hasAttribute("tabindex")&&p.setAttribute("tabindex","0"),!f.code){n.hooks.run("complete",f),l&&l.call(f.element);return}if(n.hooks.run("before-highlight",f),!f.grammar){F(n.util.encode(f.code));return}if(a&&t.Worker){var S=new Worker(n.filename);S.onmessage=function(I){F(I.data)},S.postMessage(JSON.stringify({language:f.language,code:f.code,immediateClose:!0}))}else F(n.highlight(f.code,f.grammar,f.language))},highlight:function(s,a,l){var o={code:s,grammar:a,language:l};if(n.hooks.run("before-tokenize",o),!o.grammar)throw new Error('The language "'+o.language+'" has no grammar.');return o.tokens=n.tokenize(o.code,o.grammar),n.hooks.run("after-tokenize",o),d.stringify(n.util.encode(o.tokens),o.language)},tokenize:function(s,a){var l=a.rest;if(l){for(var o in l)a[o]=l[o];delete a.rest}var u=new v;return x(u,u.head,s),b(s,u,a,u.head,0),E(u)},hooks:{all:{},add:function(s,a){var l=n.hooks.all;l[s]=l[s]||[],l[s].push(a)},run:function(s,a){var l=n.hooks.all[s];if(!(!l||!l.length))for(var o=0,u;u=l[o++];)u(a)}},Token:d};t.Prism=n;function d(s,a,l,o){this.type=s,this.content=a,this.alias=l,this.length=(o||"").length|0}d.stringify=function s(a,l){if(typeof a=="string")return a;if(Array.isArray(a)){var o="";return a.forEach(function(F){o+=s(F,l)}),o}var u={type:a.type,content:s(a.content,l),tag:"span",classes:["token",a.type],attributes:{},language:l},p=a.alias;p&&(Array.isArray(p)?Array.prototype.push.apply(u.classes,p):u.classes.push(p)),n.hooks.run("wrap",u);var y="";for(var f in u.attributes)y+=" "+f+'="'+(u.attributes[f]||"").replace(/"/g,""")+'"';return"<"+u.tag+' class="'+u.classes.join(" ")+'"'+y+">"+u.content+""};function _(s,a,l,o){s.lastIndex=a;var u=s.exec(l);if(u&&o&&u[1]){var p=u[1].length;u.index+=p,u[0]=u[0].slice(p)}return u}function b(s,a,l,o,u,p){for(var y in l)if(!(!l.hasOwnProperty(y)||!l[y])){var f=l[y];f=Array.isArray(f)?f:[f];for(var F=0;F=p.reach);H+=C.value.length,C=C.next){var Q=C.value;if(a.length>s.length)return;if(!(Q instanceof d)){var Ce=1,q;if(gt){if(q=_(bt,H,s,ht),!q||q.index>=s.length)break;var Me=q.index,Wt=q.index+q[0].length,z=H;for(z+=C.value.length;Me>=z;)C=C.next,z+=C.value.length;if(z-=C.value.length,H=z,C.value instanceof d)continue;for(var be=C;be!==a.tail&&(zp.reach&&(p.reach=tt);var De=C.prev;et&&(De=x(a,De,et),H+=et.length),h(a,De,Ce);var Ut=new d(y,I?n.tokenize(je,I):je,Bt,je);if(C=x(a,De,Ut),_t&&x(a,C,_t),Ce>1){var rt={cause:y+","+F,reach:tt};b(s,a,l,C.prev,H,rt),p&&rt.reach>p.reach&&(p.reach=rt.reach)}}}}}}function v(){var s={value:null,prev:null,next:null},a={value:null,prev:s,next:null};s.next=a,this.head=s,this.tail=a,this.length=0}function x(s,a,l){var o=a.next,u={value:l,prev:a,next:o};return a.next=u,o.prev=u,s.length++,u}function h(s,a,l){for(var o=a.next,u=0;u/,greedy:!0},prolog:{pattern:/<\?[\s\S]+?\?>/,greedy:!0},doctype:{pattern:/"'[\]]|"[^"]*"|'[^']*')+(?:\[(?:[^<"'\]]|"[^"]*"|'[^']*'|<(?!!--)|)*\]\s*)?>/i,greedy:!0,inside:{"internal-subset":{pattern:/(^[^\[]*\[)[\s\S]+(?=\]>$)/,lookbehind:!0,greedy:!0,inside:null},string:{pattern:/"[^"]*"|'[^']*'/,greedy:!0},punctuation:/^$|[[\]]/,"doctype-tag":/^DOCTYPE/i,name:/[^\s<>'"]+/}},cdata:{pattern://i,greedy:!0},tag:{pattern:/<\/?(?!\d)[^\s>\/=$<%]+(?:\s(?:\s*[^\s>\/=]+(?:\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))|(?=[\s/>])))+)?\s*\/?>/,greedy:!0,inside:{tag:{pattern:/^<\/?[^\s>\/]+/,inside:{punctuation:/^<\/?/,namespace:/^[^\s>\/:]+:/}},"special-attr":[],"attr-value":{pattern:/=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+)/,inside:{punctuation:[{pattern:/^=/,alias:"attr-equals"},{pattern:/^(\s*)["']|["']$/,lookbehind:!0}]}},punctuation:/\/?>/,"attr-name":{pattern:/[^\s>\/]+/,inside:{namespace:/^[^\s>\/:]+:/}}}},entity:[{pattern:/&[\da-z]{1,8};/i,alias:"named-entity"},/&#x?[\da-f]{1,8};/i]};c.languages.markup.tag.inside["attr-value"].inside.entity=c.languages.markup.entity;c.languages.markup.doctype.inside["internal-subset"].inside=c.languages.markup;c.hooks.add("wrap",function(t){t.type==="entity"&&(t.attributes.title=t.content.replace(/&/,"&"))});Object.defineProperty(c.languages.markup.tag,"addInlined",{value:function(e,r){var i={};i["language-"+r]={pattern:/(^$)/i,lookbehind:!0,inside:c.languages[r]},i.cdata=/^$/i;var n={"included-cdata":{pattern://i,inside:i}};n["language-"+r]={pattern:/[\s\S]+/,inside:c.languages[r]};var d={};d[e]={pattern:RegExp(/(<__[^>]*>)(?:))*\]\]>|(?!)/.source.replace(/__/g,function(){return e}),"i"),lookbehind:!0,greedy:!0,inside:n},c.languages.insertBefore("markup","cdata",d)}});Object.defineProperty(c.languages.markup.tag,"addAttribute",{value:function(t,e){c.languages.markup.tag.inside["special-attr"].push({pattern:RegExp(/(^|["'\s])/.source+"(?:"+t+")"+/\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))/.source,"i"),lookbehind:!0,inside:{"attr-name":/^[^\s=]+/,"attr-value":{pattern:/=[\s\S]+/,inside:{value:{pattern:/(^=\s*(["']|(?!["'])))\S[\s\S]*(?=\2$)/,lookbehind:!0,alias:[e,"language-"+e],inside:c.languages[e]},punctuation:[{pattern:/^=/,alias:"attr-equals"},/"|'/]}}}})}});c.languages.html=c.languages.markup;c.languages.mathml=c.languages.markup;c.languages.svg=c.languages.markup;c.languages.xml=c.languages.extend("markup",{});c.languages.ssml=c.languages.xml;c.languages.atom=c.languages.xml;c.languages.rss=c.languages.xml;(function(t){var e=/(?:"(?:\\(?:\r\n|[\s\S])|[^"\\\r\n])*"|'(?:\\(?:\r\n|[\s\S])|[^'\\\r\n])*')/;t.languages.css={comment:/\/\*[\s\S]*?\*\//,atrule:{pattern:RegExp("@[\\w-](?:"+/[^;{\s"']|\s+(?!\s)/.source+"|"+e.source+")*?"+/(?:;|(?=\s*\{))/.source),inside:{rule:/^@[\w-]+/,"selector-function-argument":{pattern:/(\bselector\s*\(\s*(?![\s)]))(?:[^()\s]|\s+(?![\s)])|\((?:[^()]|\([^()]*\))*\))+(?=\s*\))/,lookbehind:!0,alias:"selector"},keyword:{pattern:/(^|[^\w-])(?:and|not|only|or)(?![\w-])/,lookbehind:!0}}},url:{pattern:RegExp("\\burl\\((?:"+e.source+"|"+/(?:[^\\\r\n()"']|\\[\s\S])*/.source+")\\)","i"),greedy:!0,inside:{function:/^url/i,punctuation:/^\(|\)$/,string:{pattern:RegExp("^"+e.source+"$"),alias:"url"}}},selector:{pattern:RegExp(`(^|[{}\\s])[^{}\\s](?:[^{};"'\\s]|\\s+(?![\\s{])|`+e.source+")*(?=\\s*\\{)"),lookbehind:!0},string:{pattern:e,greedy:!0},property:{pattern:/(^|[^-\w\xA0-\uFFFF])(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*(?=\s*:)/i,lookbehind:!0},important:/!important\b/i,function:{pattern:/(^|[^-a-z0-9])[-a-z0-9]+(?=\()/i,lookbehind:!0},punctuation:/[(){};:,]/},t.languages.css.atrule.inside.rest=t.languages.css;var r=t.languages.markup;r&&(r.tag.addInlined("style","css"),r.tag.addAttribute("style","css"))})(c);c.languages.clike={comment:[{pattern:/(^|[^\\])\/\*[\s\S]*?(?:\*\/|$)/,lookbehind:!0,greedy:!0},{pattern:/(^|[^\\:])\/\/.*/,lookbehind:!0,greedy:!0}],string:{pattern:/(["'])(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/,greedy:!0},"class-name":{pattern:/(\b(?:class|extends|implements|instanceof|interface|new|trait)\s+|\bcatch\s+\()[\w.\\]+/i,lookbehind:!0,inside:{punctuation:/[.\\]/}},keyword:/\b(?:break|catch|continue|do|else|finally|for|function|if|in|instanceof|new|null|return|throw|try|while)\b/,boolean:/\b(?:false|true)\b/,function:/\b\w+(?=\()/,number:/\b0x[\da-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:e[+-]?\d+)?/i,operator:/[<>]=?|[!=]=?=?|--?|\+\+?|&&?|\|\|?|[?*/~^%]/,punctuation:/[{}[\];(),.:]/};c.languages.javascript=c.languages.extend("clike",{"class-name":[c.languages.clike["class-name"],{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$A-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\.(?:constructor|prototype))/,lookbehind:!0}],keyword:[{pattern:/((?:^|\})\s*)catch\b/,lookbehind:!0},{pattern:/(^|[^.]|\.\.\.\s*)\b(?:as|assert(?=\s*\{)|async(?=\s*(?:function\b|\(|[$\w\xA0-\uFFFF]|$))|await|break|case|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally(?=\s*(?:\{|$))|for|from(?=\s*(?:['"]|$))|function|(?:get|set)(?=\s*(?:[#\[$\w\xA0-\uFFFF]|$))|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)\b/,lookbehind:!0}],function:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*(?:\.\s*(?:apply|bind|call)\s*)?\()/,number:{pattern:RegExp(/(^|[^\w$])/.source+"(?:"+(/NaN|Infinity/.source+"|"+/0[bB][01]+(?:_[01]+)*n?/.source+"|"+/0[oO][0-7]+(?:_[0-7]+)*n?/.source+"|"+/0[xX][\dA-Fa-f]+(?:_[\dA-Fa-f]+)*n?/.source+"|"+/\d+(?:_\d+)*n/.source+"|"+/(?:\d+(?:_\d+)*(?:\.(?:\d+(?:_\d+)*)?)?|\.\d+(?:_\d+)*)(?:[Ee][+-]?\d+(?:_\d+)*)?/.source)+")"+/(?![\w$])/.source),lookbehind:!0},operator:/--|\+\+|\*\*=?|=>|&&=?|\|\|=?|[!=]==|<<=?|>>>?=?|[-+*/%&|^!=<>]=?|\.{3}|\?\?=?|\?\.?|[~:]/});c.languages.javascript["class-name"][0].pattern=/(\b(?:class|extends|implements|instanceof|interface|new)\s+)[\w.\\]+/;c.languages.insertBefore("javascript","keyword",{regex:{pattern:RegExp(/((?:^|[^$\w\xA0-\uFFFF."'\])\s]|\b(?:return|yield))\s*)/.source+/\//.source+"(?:"+/(?:\[(?:[^\]\\\r\n]|\\.)*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}/.source+"|"+/(?:\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.)*\])*\])*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}v[dgimyus]{0,7}/.source+")"+/(?=(?:\s|\/\*(?:[^*]|\*(?!\/))*\*\/)*(?:$|[\r\n,.;:})\]]|\/\/))/.source),lookbehind:!0,greedy:!0,inside:{"regex-source":{pattern:/^(\/)[\s\S]+(?=\/[a-z]*$)/,lookbehind:!0,alias:"language-regex",inside:c.languages.regex},"regex-delimiter":/^\/|\/$/,"regex-flags":/^[a-z]+$/}},"function-variable":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*[=:]\s*(?:async\s*)?(?:\bfunction\b|(?:\((?:[^()]|\([^()]*\))*\)|(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)\s*=>))/,alias:"function"},parameter:[{pattern:/(function(?:\s+(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)?\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\))/,lookbehind:!0,inside:c.languages.javascript},{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$a-z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*=>)/i,lookbehind:!0,inside:c.languages.javascript},{pattern:/(\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*=>)/,lookbehind:!0,inside:c.languages.javascript},{pattern:/((?:\b|\s|^)(?!(?:as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)(?![$\w\xA0-\uFFFF]))(?:(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*)\(\s*|\]\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*\{)/,lookbehind:!0,inside:c.languages.javascript}],constant:/\b[A-Z](?:[A-Z_]|\dx?)*\b/});c.languages.insertBefore("javascript","string",{hashbang:{pattern:/^#!.*/,greedy:!0,alias:"comment"},"template-string":{pattern:/`(?:\\[\s\S]|\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}|(?!\$\{)[^\\`])*`/,greedy:!0,inside:{"template-punctuation":{pattern:/^`|`$/,alias:"string"},interpolation:{pattern:/((?:^|[^\\])(?:\\{2})*)\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}/,lookbehind:!0,inside:{"interpolation-punctuation":{pattern:/^\$\{|\}$/,alias:"punctuation"},rest:c.languages.javascript}},string:/[\s\S]+/}},"string-property":{pattern:/((?:^|[,{])[ \t]*)(["'])(?:\\(?:\r\n|[\s\S])|(?!\2)[^\\\r\n])*\2(?=\s*:)/m,lookbehind:!0,greedy:!0,alias:"property"}});c.languages.insertBefore("javascript","operator",{"literal-property":{pattern:/((?:^|[,{])[ \t]*)(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*:)/m,lookbehind:!0,alias:"property"}});c.languages.markup&&(c.languages.markup.tag.addInlined("script","javascript"),c.languages.markup.tag.addAttribute(/on(?:abort|blur|change|click|composition(?:end|start|update)|dblclick|error|focus(?:in|out)?|key(?:down|up)|load|mouse(?:down|enter|leave|move|out|over|up)|reset|resize|scroll|select|slotchange|submit|unload|wheel)/.source,"javascript"));c.languages.js=c.languages.javascript;(function(){if(typeof c>"u"||typeof document>"u")return;Element.prototype.matches||(Element.prototype.matches=Element.prototype.msMatchesSelector||Element.prototype.webkitMatchesSelector);var t="Loading\u2026",e=function(k,g){return"\u2716 Error "+k+" while fetching file: "+g},r="\u2716 Error: File does not exist or is empty",i={js:"javascript",py:"python",rb:"ruby",ps1:"powershell",psm1:"powershell",sh:"bash",bat:"batch",h:"c",tex:"latex"},n="data-src-status",d="loading",_="loaded",b="failed",v="pre[data-src]:not(["+n+'="'+_+'"]):not(['+n+'="'+d+'"])';function x(k,g,w){var s=new XMLHttpRequest;s.open("GET",k,!0),s.onreadystatechange=function(){s.readyState==4&&(s.status<400&&s.responseText?g(s.responseText):s.status>=400?w(e(s.status,s.statusText)):w(r))},s.send(null)}function h(k){var g=/^\s*(\d+)\s*(?:(,)\s*(?:(\d+)\s*)?)?$/.exec(k||"");if(g){var w=Number(g[1]),s=g[2],a=g[3];return s?a?[w,Number(a)]:[w,void 0]:[w,w]}}c.hooks.add("before-highlightall",function(k){k.selector+=", "+v}),c.hooks.add("before-sanity-check",function(k){var g=k.element;if(g.matches(v)){k.code="",g.setAttribute(n,d);var w=g.appendChild(document.createElement("CODE"));w.textContent=t;var s=g.getAttribute("data-src"),a=k.language;if(a==="none"){var l=(/\.(\w+)$/.exec(s)||[,"none"])[1];a=i[l]||l}c.util.setLanguage(w,a),c.util.setLanguage(g,a);var o=c.plugins.autoloader;o&&o.loadLanguages(a),x(s,function(u){g.setAttribute(n,_);var p=h(g.getAttribute("data-range"));if(p){var y=u.split(/\r\n?|\n/g),f=p[0],F=p[1]==null?y.length:p[1];f<0&&(f+=y.length),f=Math.max(0,Math.min(f-1,y.length)),F<0&&(F+=y.length),F=Math.max(0,Math.min(F,y.length)),u=y.slice(f,F).join(`
+`),g.hasAttribute("data-start")||g.setAttribute("data-start",String(f+1))}w.textContent=u,c.highlightElement(w)},function(u){g.setAttribute(n,b),w.textContent=u})}}),c.plugins.fileHighlight={highlight:function(g){for(var w=(g||document).querySelectorAll(v),s=0,a;a=w[s++];)c.highlightElement(a)}};var E=!1;c.fileHighlight=function(){E||(console.warn("Prism.fileHighlight is deprecated. Use `Prism.plugins.fileHighlight.highlight` instead."),E=!0),c.plugins.fileHighlight.highlight.apply(this,arguments)}})()});var Hr={};Kt(Hr,{BUILD_ID:()=>qr,TempleComponent:()=>P.TempleComponent,TempleElement:()=>P.TempleElement,TempleEmitter:()=>P.TempleEmitter,TempleException:()=>P.TempleException,TempleRegistry:()=>P.TempleRegistry,children:()=>P.children,components:()=>Rr,data:()=>P.data,emitter:()=>P.emitter,props:()=>P.props,signal:()=>P.signal});var N=T(D());var qt=T(D()),R=T($()),se=class extends qt.TempleComponent{static component=["layout","Layout_9f3ab204ce271feaf6f7"];styles(){return""}template(){(0,R.classlist)().add("relative","w-full","vh","scroll-hidden");let e=(0,R.children)(),r=e.find(h=>h.nodeName.endsWith("PANEL-MAIN")),i=e.find(h=>h.nodeName.endsWith("PANEL-HEAD")),n=e.find(h=>h.nodeName.endsWith("PANEL-FOOT")),d=e.find(h=>h.nodeName.endsWith("PANEL-LEFT")),_=e.find(h=>h.nodeName.endsWith("PANEL-RIGHT")),b={head:!!i,foot:!!n,left:!!d,right:!!_},v=new Set,x={left:!1,right:!1,change:h=>v.add(h)};return r&&R.TempleRegistry.get(r).setAttribute("show",x).setAttribute("layout",b),i&&R.TempleRegistry.get(i).setAttribute("show",x).setAttribute("layout",b),n&&R.TempleRegistry.get(n).setAttribute("show",x).setAttribute("layout",b),d&&R.TempleRegistry.get(d).setAttribute("show",x).setAttribute("layout",b),_&&R.TempleRegistry.get(_).setAttribute("show",x).setAttribute("layout",b),this.toggle=h=>{x[h]=!x[h],v.forEach(E=>E())},()=>[R.TempleRegistry.createText(`
+`,!1),...this._toNodeList(e)]}};var Fe=T(D()),Ge=T($()),ae=class extends Fe.TempleComponent{static component=["head","Head_2bf4dff19bc88ba4138b"];styles(){return""}template(){let{layout:e,show:r}=this.element.attributes,i=(0,Ge.classlist)(),n=d=>{this.classList.add("absolute","top-0","right-0","h-60","transition-500"),e?.left?(this.classList.remove("left-0"),this.classList.add("left-226")):this.classList.add("left-0"),r.left?(this.classList.remove("md-left-0"),this.classList.add("md-left-226")):(this.classList.remove("md-left-226"),this.classList.add("md-left-0"))};return r.change(n),n(),()=>[Fe.TempleRegistry.createText(`
+`,!1),Fe.TempleRegistry.createElement("header",{class:"block w-full h-full relative"},[...this._toNodeList((0,Ge.children)())]).element]}};var Le=T(D()),We=T($()),ie=class extends Le.TempleComponent{static component=["left","Left_f4ab589e043eee17d229"];styles(){return""}template(){let{layout:e,show:r}=this.element.attributes,i=(0,We.classlist)(),n=d=>{this.classList.add("w-226","absolute","bottom-0","left-0","top-0","transition-500"),r.left?(this.classList.remove("md-left--226"),this.classList.add("md-left-0")):this.classList.add("md-left--226")};return r.change(n),n(),()=>[Le.TempleRegistry.createText(`
+`,!1),Le.TempleRegistry.createElement("aside",{class:"block w-full h-full relative"},[...this._toNodeList((0,We.children)())]).element]}};var Pe=T(D()),Ue=T($()),le=class extends Pe.TempleComponent{static component=["main","Main_847772763f4518728ede"];styles(){return""}template(){let{layout:e,show:r}=this.element.attributes,i=(0,Ue.classlist)(),n=d=>{this.classList.add("absolute","transition-500"),e?.head?(this.classList.remove("top-0"),this.classList.add("top-60")):this.classList.add("top-0"),e?.foot?(this.classList.remove("bottom-0"),this.classList.add("bottom-60")):this.classList.add("bottom-0"),e?.left?(this.classList.remove("left-0"),this.classList.add("left-226")):this.classList.add("left-0"),e?.right?(this.classList.remove("right-0"),this.classList.add("right-200")):this.classList.add("right-0"),r.left?(this.classList.remove("md-left-0"),this.classList.add("md-left-226")):(this.classList.remove("md-left-226"),this.classList.add("md-left-0")),r.right?(this.classList.remove("md-right-0"),this.classList.add("md-right-200")):(this.classList.remove("md-right-200"),this.classList.add("md-right-0"))};return r.change(n),n(),()=>[Pe.TempleRegistry.createText(`
+`,!1),Pe.TempleRegistry.createElement("main",{class:"block w-full h-full relative"},[...this._toNodeList((0,Ue.children)())]).element]}};var X=T(D()),ue=T($()),oe=class extends X.TempleComponent{static component=["tab","Tab_5a341768ef0a010965e3"];styles(){return""}template(){let{group:e,selector:r="",active:i="",inactive:n="",style:d,class:_,...b}=(0,ue.props)(),v=(0,ue.component)(),x=i.split(" "),h=n.split(" ");v.classList.add("cursor-pointer");let E=()=>{let g=v.hasAttribute("on");v.classList.remove(...g?h:x),v.classList.add(...g?x:h),Array.from(document.querySelectorAll(r)).forEach(w=>{w.style.display=g?"block":"none"})},k=()=>{Array.from(document.querySelectorAll(`[group="${e}"]`)).forEach(g=>{let w=g.getAttribute("selector");r===w&&!g.hasAttribute("on")?(g.setAttribute("on",""),Array.from(document.querySelectorAll(r)).forEach(s=>{s.style.display="block"}),typeof g.render=="function"&&g.render()):r!==w&&g.hasAttribute("on")&&(g.removeAttribute("on"),Array.from(document.querySelectorAll(w)).forEach(s=>{s.style.display="none"}),typeof g.render=="function"&&g.render())})};return()=>[X.TempleRegistry.createText(`
+`,!1),X.TempleRegistry.createElement("a",{...b,class:"block h-full w-full",click:k,mount:E},[X.TempleRegistry.createText(`
+  `,!1),...this._toNodeList((0,ue.children)()),X.TempleRegistry.createText(`
+`,!1)]).element]}};var Se=T(D()),Ze=T($()),ce=class extends Se.TempleComponent{static component=["docs","Docs_40562a7bb56d70d971df"];styles(){return""}template(){return(0,Ze.classlist)().add("block","w-full","h-full","scroll-y-auto","scroll-x-hidden"),()=>[Se.TempleRegistry.createText(`
+`,!1),Se.TempleRegistry.createElement("article",{class:"block p-10 tx-t-1"},[...this._toNodeList((0,Ze.children)())]).element]}};var Y=T(D()),Je=T($()),de=class extends Y.TempleComponent{static component=["head","Head_939ecb5f22962d8c2924"];styles(){return""}template(){return(0,Je.classlist)().add("absolute","top-0","right-0","left-170","h-45","bg-t-0","z-1"),()=>[Y.TempleRegistry.createText(`
+`,!1),Y.TempleRegistry.createElement("header",{class:"w-full h-full scroll-x-auto"},[Y.TempleRegistry.createText(`
+  `,!1),...this._toNodeList((0,Je.children)()),Y.TempleRegistry.createText(`
+`,!1)]).element]}};var V=T(D()),Xe=T($()),fe=class extends V.TempleComponent{static component=["left","Left_a7102198c3628da88b4f"];styles(){return""}template(){return(0,Xe.classlist)().add("absolute","top-0","bottom-0","left-0","w-170","bg-h-000000","bd-solid","bd-t-2","bdy-0","bdl-0","bdr-1","z-2"),()=>[V.TempleRegistry.createText(`
+`,!1),V.TempleRegistry.createElement("aside",{class:"w-full h-full scroll-auto"},[V.TempleRegistry.createText(`
+  `,!1),...this._toNodeList((0,Xe.children)()),V.TempleRegistry.createText(`
+`,!1)]).element]}};var K=T(D()),Ye=T($()),pe=class extends K.TempleComponent{static component=["main","Main_bbd0517424ebab9de270"];styles(){return""}template(){return(0,Ye.classlist)().add("absolute","top-45","right-0","left-170","bottom-0","bg-black","bd-solid","bd-t-2","bdx-0","bdb-0","bdt-1"),()=>[K.TempleRegistry.createText(`
+`,!1),K.TempleRegistry.createElement("main",{class:"w-full h-full scroll-auto"},[K.TempleRegistry.createText(`
+  `,!1),...this._toNodeList((0,Ye.children)()),K.TempleRegistry.createText(`
+`,!1)]).element]}};var L=T(D()),Ve=T($()),me=class extends L.TempleComponent{static component=["app","App_381239c61b65b86a1c20"];styles(){return""}template(){let{title:e,height:r}=(0,Ve.props)(),i=r?`height:${r}px`:"";return()=>[L.TempleRegistry.createText(`
+`,!1),L.TempleRegistry.createElement("div",{class:"bd-rad-curved scroll-hidden shadow-0-0-10-0-0-0-5"},[L.TempleRegistry.createText(`
+  `,!1),L.TempleRegistry.createElement("div",{class:"relative flex flex-center-y gap-10 p-10 bg-t-1 tx-c-999999 tx-16"},[L.TempleRegistry.createText(`
+    `,!1),L.TempleRegistry.createElement("span",{class:"bg-h-999999 pill h-10 w-10"},[]).element,L.TempleRegistry.createText(`
+    `,!1),L.TempleRegistry.createElement("span",{class:"bg-h-999999 pill h-10 w-10"},[]).element,L.TempleRegistry.createText(`
+    `,!1),L.TempleRegistry.createElement("span",{class:"bg-h-999999 pill h-10 w-10"},[]).element,L.TempleRegistry.createText(`
+    `,!1),L.TempleRegistry.createElement("span",{class:"flex flex-center h-full w-full absolute top-0 left-0"},[L.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(e),L.TempleRegistry.createText(`
+    `,!1)]).element,L.TempleRegistry.createText(`
+  `,!1)]).element,L.TempleRegistry.createText(`
+  `,!1),L.TempleRegistry.createElement("div",{class:"bg-black tx-t-1 relative",style:i},[...this._toNodeList((0,Ve.children)())]).element,L.TempleRegistry.createText(`
+`,!1)]).element]}};var A=T(D()),pt=T(Ht()),It=T($()),he=class extends A.TempleComponent{static component=["code","Code_5294df1c620ef5ddbd2f"];styles(){return`:host {
     display: block;
     font-size: 14px;
     line-height: 20px;
   }
   :host([inline]) {
-    display: inline;
+    display: inline !important;
   }
   :host([inline]),
   :host([inline]) > pre,
   :host([inline]) > pre > code {
-    display: inline;
+    display: inline !important;
   }
   .snippet {
     background-color: #000000;
     color: #ABB2BF;
+    height: 100%;
     margin: 0;
     padding: 0;
   }
@@ -73,42 +102,38 @@ var TempleAPI=(()=>{var xt=Object.create;var ge=Object.defineProperty;var Tt=Obj
 
   .terminal {
     background-color: #000000;
+    font-family: 'Courier New', Courier, monospace;
     font-size: 15px;
+    height: 100%;
     padding: 10px;
   }
   .terminal span {
     color: #00FF00;
-  }`}template(){let e=this.props,{lang:r="markup",numbers:i=!1,inline:n=!1,trim:p=!1,ltrim:m=!1,rtrim:g=!1,detab:_=0}=e,y=(0,_t.children)(),A=y[0]?.textContent||"";_&&(A=A.replace(new RegExp(`\\n {${_}}`,"g"),`
-`)),p?A=A.trim():m?A=A.replace(/^\s+/,""):g&&(A=A.replace(/\s+$/,""));let F=T=>{if(!A)return;let v=He.default.highlight(A,He.default.languages[r],r);if(T.detail.target.innerHTML=v,i){let E=v.match(/\n(?!$)/g),s=E?E.length+1:1,a=new Array(s+1).join(""),l=document.createElement("span");l.setAttribute("aria-hidden","true"),l.className="line-numbers-rows",l.innerHTML=a,T.detail.target.appendChild(l)}};return()=>[w.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism.min.css"}).element,w.TempleRegistry.createText(`
-`,!1),w.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism-tomorrow.min.css"}).element,w.TempleRegistry.createText(`
-`,!1),...r==="bash"?[w.TempleRegistry.createText(`
-  `,!1),w.TempleRegistry.createElement("div",{class:"terminal"},[w.TempleRegistry.createElement("span",{},[w.TempleRegistry.createText("$",!1)]).element,w.TempleRegistry.createText(" ",!1),...this._toNodeList(y)]).element,w.TempleRegistry.createText(`
-`,!1)]:A?[,w.TempleRegistry.createText(`
-  `,!1),...i?[w.TempleRegistry.createText(`
-    `,!1),w.TempleRegistry.createElement("pre",{class:"snippet line-numbers"},[w.TempleRegistry.createElement("code",{mount:F},[]).element]).element,w.TempleRegistry.createText(`
-  `,!1)]:[,w.TempleRegistry.createText(`
-    `,!1),w.TempleRegistry.createElement("pre",{class:"snippet pad"},[w.TempleRegistry.createElement("code",{mount:F},[]).element]).element,w.TempleRegistry.createText(`
-  `,!1)],w.TempleRegistry.createText(`
-`,!1)]:[]]}};var S=D(I()),Te=D(oe()),J=class extends S.TempleComponent{static component=["app","App_05341fddbfd1fe4f273b"];styles(){return""}template(){let{title:e,panel:r}=(0,Te.props)(),i=`body ${r?"panel":""}`,n=r?`height:${r}px`:"";return()=>[S.TempleRegistry.createText(`
-`,!1),S.TempleRegistry.createElement("div",{class:"window"},[S.TempleRegistry.createText(`
-  `,!1),S.TempleRegistry.createElement("div",{class:"head"},[S.TempleRegistry.createText(`
-    `,!1),S.TempleRegistry.createElement("span",{class:"dot"},[]).element,S.TempleRegistry.createText(`
-    `,!1),S.TempleRegistry.createElement("span",{class:"dot"},[]).element,S.TempleRegistry.createText(`
-    `,!1),S.TempleRegistry.createElement("span",{class:"dot"},[]).element,S.TempleRegistry.createText(`
-    `,!1),S.TempleRegistry.createElement("span",{class:"title"},[...this._toNodeList(e)]).element,S.TempleRegistry.createText(`
-  `,!1)]).element,S.TempleRegistry.createText(`
-  `,!1),S.TempleRegistry.createElement("div",{class:i,style:n},[...this._toNodeList((0,Te.children)())]).element,S.TempleRegistry.createText(`
-`,!1)]).element]}};var ue=D(I()),Ee=D(oe()),X=class extends ue.TempleComponent{static component=["tab","Tab_dd9d261e4f37efc3079c"];styles(){return""}template(){let{group:e,selector:r,class:i,...n}=(0,Ee.props)(),p=()=>{Array.from(document.querySelectorAll(r)).forEach(g=>{g.style.display=i.indexOf("active")>-1?"block":"none"})},m=()=>{Array.from(document.querySelectorAll(`[group="${e}"]`)).forEach(g=>{let _=g.props.selector;r===_?(g.classList.add("active"),Array.from(document.querySelectorAll(r)).forEach(y=>{y.style.display="block"})):(g.classList.remove("active"),Array.from(document.querySelectorAll(_)).forEach(y=>{y.style.display="none"}))})};return()=>[ue.TempleRegistry.createText(`
-`,!1),ue.TempleRegistry.createElement("a",{...n,click:m,mount:p},[...this._toNodeList((0,Ee.children)())]).element]}};var M=D(I());var Ne=function(t,...e){let r=Be(t);for(let i=0;i[M.TempleRegistry.createText(`
-    `,!1),...r?[M.TempleRegistry.createText(`
-      `,!1),M.TempleRegistry.createElement("p",{},[...this._toNodeList(A)]).element,M.TempleRegistry.createText(`
-    `,!1)]:i?[,M.TempleRegistry.createText(`
-      `,!1),M.TempleRegistry.createElement("li",{},[...this._toNodeList(A)]).element,M.TempleRegistry.createText(`
-    `,!1)]:n?[,M.TempleRegistry.createText(`
-      `,!1),M.TempleRegistry.createElement("div",{},[...this._toNodeList(A)]).element,M.TempleRegistry.createText(`
-    `,!1)]:[,M.TempleRegistry.createText(`
-      `,!1),...this._toNodeList(A),M.TempleRegistry.createText(`
-    `,!1)]]}};var k=D(I());C.emitter.once("ready",()=>{let t=document.querySelector("script[data-app]");if(!t)throw C.TempleException.for("APP_DATA not found");try{let m=atob(t.getAttribute("data-app"));window.__APP_DATA__=JSON.parse(m),Object.entries(window.__APP_DATA__).forEach(([g,_])=>{C.data.set(g,_)})}catch{throw C.TempleException.for("APP_DATA is not a valid JSON")}C.data.set("current","document");let e="/docs/template-engine.html",r=Ne("Template Engine - Temple reactive web component template engine."),i=Ne("How to use Temple as a template engine."),n=m=>{document.body.classList.toggle("panel-left-open")};C.data.delete("current");let p={0:{class:"head panel-head"},1:{class:"menu fas fa-fw fa-bars",click:n},2:{href:"/temple"},3:{src:"/temple/temple-icon.png",alt:"Temple Logo"},5:{class:"tx-white",href:"/temple"},7:{class:"tx-white",href:"/temple/docs/index.html"},8:{class:"github",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},9:{class:"fab fa-github"},10:{class:"npm",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},11:{class:"fab fa-npm text-white"},12:{class:"discord",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},13:{class:"fab fa-discord text-white"},14:{class:"left panel-left"},16:{href:"/temple"},17:{src:"/temple/temple-icon.png",alt:"Temple Logo"},19:{class:"tx-white",href:"/temple"},20:{class:"toggle fas fa-fw fa-chevron-left",click:n},23:{href:"/temple/docs/index.html"},24:{href:"/temple/docs/getting-started.html"},26:{href:"/temple/docs/markup-syntax.html"},27:{href:"/temple/docs/state-management.html"},28:{href:"/temple/docs/component-strategy.html"},29:{href:"/temple/docs/compiler-api.html"},30:{href:"/temple/docs/client-api.html"},32:{href:"/temple/docs/template-engine.html"},33:{href:"/temple/docs/single-page.html"},34:{href:"/temple/docs/static-site.html"},35:{href:"/temple/docs/component-publisher.html"},36:{href:"/temple/docs/developer-tools.html"},37:{class:"panel-main"},38:{class:"docs container"},40:{p:!0,trim:!0},41:{p:!0,trim:!0},42:{panel:410,title:"My Project"},43:{class:"panel-head"},44:{class:"tabs"},45:{class:"tab active",group:"project",selector:"#index-ts"},46:{class:"tab",group:"project",selector:"#page-dtml"},47:{class:"tab",group:"project",selector:"#package-json"},48:{class:"panel-left"},49:{class:"folder"},50:{class:"fas fa-fw fa-chevron-down"},52:{class:"shift-1 block active",group:"project",selector:"#index-ts"},53:{class:"fas fa-fw fa-file"},54:{class:"shift-1 block",group:"project",selector:"#page-dtml"},55:{class:"fas fa-fw fa-file"},56:{class:"block",group:"project",selector:"#package-json"},57:{class:"fas fa-fw fa-file"},58:{class:"panel-main"},60:{id:"index-ts",lang:"js",numbers:!0,trim:!0,detab:16},61:{id:"page-dtml",style:"display:none",numbers:!0,trim:!0,detab:16},62:{id:"package-json",style:"display:none",lang:"js",numbers:!0,trim:!0,detab:16},63:{p:!0,trim:!0},64:{inline:!0},65:{inline:!0},66:{lang:"bash"},67:{p:!0,trim:!0},68:{lang:"js",inline:!0},69:{class:"pager"},70:{class:"prev",href:"/temple/docs/client-api.html"},71:{class:"fas fa-fw fa-chevron-left"},72:{class:"next",href:"/temple/docs/single-page.html"},73:{class:"fas fa-fw fa-chevron-right"},74:{class:"foot"}};for(let m of document.body.querySelectorAll("*")){let g=Object.fromEntries(Array.from(m.attributes).map(y=>[y.nodeName,y.nodeValue.length>0?y.nodeValue:!0])),_=String(C.TempleRegistry.elements.size);p[_]&&(Object.assign(g,p[_]),m.TempleAttributes=p[_]),C.TempleRegistry.register(m,g)}customElements.define("panel-main",Z),customElements.define("ide-code",W),customElements.define("ide-app",J),customElements.define("tui-tab",X),customElements.define("i18n-translate",Y),C.emitter.emit("mounted",document.body)});var ar={PanelMain_fd7f1af6410c5b5c8e1f:Z,IdeCode_6f36bc13bb6a166c7abc:W,IdeApp_05341fddbfd1fe4f273b:J,TuiTab_dd9d261e4f37efc3079c:X,I18nTranslate_7d25e372f5ffb5e39dad:Y},sr="2d721d6aed73f41f4e72";return Pt(ir);})();
+  }`}template(){let e=this.props,{lang:r="markup",numbers:i=!1,inline:n=!1,trim:d=!1,ltrim:_=!1,rtrim:b=!1,detab:v=0}=e,x=(0,It.children)(),h=x[0]?.textContent||"";v&&(h=h.replace(new RegExp(`\\n {${v}}`,"g"),`
+`)),d?h=h.trim():_?h=h.replace(/^\s+/,""):b&&(h=h.replace(/\s+$/,""));let E=k=>{if(!h)return;let g=pt.default.highlight(h,pt.default.languages[r],r);if(k.detail.target.innerHTML=g,i){let w=g.match(/\n(?!$)/g),s=w?w.length+1:1,a=new Array(s+1).join(""),l=document.createElement("span");l.setAttribute("aria-hidden","true"),l.className="line-numbers-rows",l.innerHTML=a,k.detail.target.appendChild(l)}};return()=>[A.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism.min.css"}).element,A.TempleRegistry.createText(`
+`,!1),A.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism-tomorrow.min.css"}).element,A.TempleRegistry.createText(`
+`,!1),...r==="bash"?[A.TempleRegistry.createText(`
+  `,!1),A.TempleRegistry.createElement("div",{class:"terminal"},[A.TempleRegistry.createElement("span",{},[A.TempleRegistry.createText("$",!1)]).element,A.TempleRegistry.createText(" ",!1),...this._toNodeList(x)]).element,A.TempleRegistry.createText(`
+`,!1)]:h?[,A.TempleRegistry.createText(`
+  `,!1),...i?[A.TempleRegistry.createText(`
+    `,!1),A.TempleRegistry.createElement("pre",{class:"snippet line-numbers"},[A.TempleRegistry.createElement("code",{mount:E},[]).element]).element,A.TempleRegistry.createText(`
+  `,!1)]:[,A.TempleRegistry.createText(`
+    `,!1),A.TempleRegistry.createElement("pre",{class:"snippet pad"},[A.TempleRegistry.createElement("code",{mount:E},[]).element]).element,A.TempleRegistry.createText(`
+  `,!1)],A.TempleRegistry.createText(`
+`,!1)]:[,A.TempleRegistry.createText(`
+  `,!1),A.TempleRegistry.createElement("span",{},[A.TempleRegistry.createText("????",!1)]).element,A.TempleRegistry.createText(`
+`,!1)],A.TempleRegistry.createText(`
+
+`,!1)]}};var O=T(D());var zt=function(t){return t};var Qe=T($()),ge=class extends O.TempleComponent{static component=["translate","Translate_0014b007fc91289b2776"];styles(){return""}template(){let{trim:e=!1,p:r=!1,li:i=!1,div:n=!1}=(0,Qe.props)(),d=(0,Qe.children)(),_=[],b=[];for(let E of d)typeof E=="string"?_.push(E):E instanceof Node&&E.textContent?_.push(E.textContent):(_.push("%s"),b.push(E));let v=_.join("");e&&(v=v.replace(/\s+/," ").trim());let x=zt(v).split("%s"),h=[];for(let E=0;E[O.TempleRegistry.createText(`
+    `,!1),...r?[O.TempleRegistry.createText(`
+      `,!1),O.TempleRegistry.createElement("p",{},[...this._toNodeList(h)]).element,O.TempleRegistry.createText(`
+    `,!1)]:i?[,O.TempleRegistry.createText(`
+      `,!1),O.TempleRegistry.createElement("li",{},[...this._toNodeList(h)]).element,O.TempleRegistry.createText(`
+    `,!1)]:n?[,O.TempleRegistry.createText(`
+      `,!1),O.TempleRegistry.createElement("div",{},[...this._toNodeList(h)]).element,O.TempleRegistry.createText(`
+    `,!1)]:[,O.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(h),O.TempleRegistry.createText(`
+    `,!1)]]}};var mt=function(t,...e){let r=Nr(t);for(let i=0;i{let t=document.querySelector("script[data-app]");if(!t)throw N.TempleException.for("APP_DATA not found");try{let _=atob(t.getAttribute("data-app"));window.__APP_DATA__=JSON.parse(_),Object.entries(window.__APP_DATA__).forEach(([b,v])=>{N.data.set(b,v)})}catch{throw N.TempleException.for("APP_DATA is not a valid JSON")}N.data.set("current","document");let e="/docs/template-engine.html",r=mt("Template Engine - Temple reactive web component template engine."),i=mt("How to use Temple as a template engine."),n=()=>{document.getElementsByTagName("panel-layout")[0].toggle("left")};N.data.delete("current");let d={2:{class:"flex flex-center-y px-20 py-15 m-0 bg-t-1"},3:{class:"fas fa-fw fa-bars cursor-pointer py-5 pr-10 none md-inline-block tx-t-1",click:n},4:{class:"flex-grow"},5:{class:"flex flex-center-y"},6:{class:"tx-white",href:"/temple/docs/index.html"},7:{class:"tx-t-1 tx-5xl ml-10",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},8:{class:"fab fa-github"},9:{class:"bg-h-cb3837 pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},10:{class:"fab fa-npm text-white"},11:{class:"bg-h-7289da pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},12:{class:"fab fa-discord text-white"},14:{class:"flex flex-center-y bg-t-2 py-15 pr-5 pl-10"},15:{href:"/temple"},16:{class:"h-26 mr-10",src:"/temple/temple-icon.png",alt:"Temple Logo"},17:{class:"flex-grow m-0 tx-uppercase"},18:{class:"tx-white",href:"/temple"},19:{class:"fas fa-fw fa-chevron-left cursor-pointer none md-inline-block",click:n},20:{class:"bg-t-1 scroll-auto h-calc-full-60"},21:{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-0 pt-20 pb-10 pl-10 tx-uppercase"},22:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/index.html"},23:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/getting-started.html"},24:{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},25:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/markup-syntax.html"},26:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/state-management.html"},27:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-strategy.html"},28:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/compiler-api.html"},29:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/client-api.html"},30:{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},31:{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/template-engine.html"},32:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/single-page.html"},33:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/static-site.html"},34:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-publisher.html"},35:{class:"block tx-t-1 py-10 pl-10 mb-100",href:"/temple/docs/developer-tools.html"},38:{class:"tx-primary tx-uppercase tx-30 py-20"},39:{p:!0,trim:!0,class:"tx-lh-36 py-20"},40:{p:!0,trim:!0,class:"tx-lh-36 py-20"},41:{height:410,title:"My Project"},43:{class:"flex scroll-x-auto pt-5 pl-5"},44:{on:!0,class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"engine",selector:"#index-ts"},45:{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"engine",selector:"#page-dtml"},46:{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"engine",selector:"#package-json"},48:{class:"p-5"},49:{class:"fas fa-fw fa-chevron-down"},51:{on:!0,class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"engine",selector:"#index-ts"},52:{class:"fas fa-fw fa-file"},53:{class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"engine",selector:"#page-dtml"},54:{class:"fas fa-fw fa-file"},55:{class:"pt-10 block",active:"tx-white",inactive:"tx-muted",group:"engine",selector:"#package-json"},56:{class:"fas fa-fw fa-file"},58:{id:"index-ts",lang:"js",numbers:!0,trim:!0,detab:16},59:{id:"page-dtml",style:"display:none",numbers:!0,trim:!0,detab:16},60:{id:"package-json",style:"display:none",lang:"js",numbers:!0,trim:!0,detab:16},61:{p:!0,trim:!0,class:"tx-lh-36 py-20"},62:{inline:!0},63:{inline:!0},64:{trim:!0,lang:"bash"},65:{p:!0,trim:!0,class:"tx-lh-36 py-20"},66:{lang:"js",inline:!0},67:{class:"flex"},68:{class:"tx-primary py-40",href:"/temple/docs/client-api.html"},69:{class:"fas fa-fw fa-chevron-left tx-t-1"},70:{class:"flex-grow tx-right tx-primary py-40",href:"/temple/docs/single-page.html"},71:{class:"fas fa-fw fa-chevron-right tx-t-1"},72:{class:"foot"}};for(let _ of document.body.querySelectorAll("*")){let b=Object.fromEntries(Array.from(_.attributes).map(x=>[x.nodeName,x.nodeValue.length>0?x.nodeValue:!0])),v=String(N.TempleRegistry.elements.size);d[v]&&(Object.assign(b,d[v]),_.TempleAttributes=d[v]),N.TempleRegistry.register(_,b)}customElements.define("panel-layout",se),customElements.define("panel-head",ae),customElements.define("panel-left",ie),customElements.define("panel-main",le),customElements.define("tui-tab",oe),customElements.define("api-docs",ce),customElements.define("app-head",de),customElements.define("app-left",fe),customElements.define("app-main",pe),customElements.define("ide-app",me),customElements.define("ide-code",he),customElements.define("i18n-translate",ge),N.emitter.emit("mounted",document.body)});var Rr={PanelLayout_9f3ab204ce271feaf6f7:se,PanelHead_2bf4dff19bc88ba4138b:ae,PanelLeft_f4ab589e043eee17d229:ie,PanelMain_847772763f4518728ede:le,TuiTab_5a341768ef0a010965e3:oe,ApiDocs_40562a7bb56d70d971df:ce,AppHead_939ecb5f22962d8c2924:de,AppLeft_a7102198c3628da88b4f:fe,AppMain_bbd0517424ebab9de270:pe,IdeApp_381239c61b65b86a1c20:me,IdeCode_5294df1c620ef5ddbd2f:he,I18nTranslate_0014b007fc91289b2776:ge},qr="2d721d6aed73f41f4e72";return Qt(Hr);})();
 /*! Bundled license information:
 
 prismjs/prism.js:
diff --git a/docs/build/client/3550a936d66e61695120.css b/docs/build/client/3550a936d66e61695120.css
index e69de29..08bf2b8 100644
--- a/docs/build/client/3550a936d66e61695120.css
+++ b/docs/build/client/3550a936d66e61695120.css
@@ -0,0 +1,217 @@
+html, body {
+  height: 100%;
+  margin: 0;
+  padding: 0;
+  width: 100%;
+}
+
+h1, h2, h3, h4, h5, h6, p {
+  margin: 0;
+  padding: 0;
+}
+
+a {
+  text-decoration: none;
+}
+  html-head:not(:defined) { opacity: 0; }
+html-header:not(:defined) { opacity: 0; }
+html-aside:not(:defined) { opacity: 0; }
+panel-layout:not(:defined) { opacity: 0; }
+panel-head:not(:defined) { opacity: 0; }
+panel-left:not(:defined) { opacity: 0; }
+panel-main:not(:defined) { opacity: 0; }
+tui-tab:not(:defined) { opacity: 0; }
+api-docs:not(:defined) { opacity: 0; }
+app-head:not(:defined) { opacity: 0; }
+app-left:not(:defined) { opacity: 0; }
+app-main:not(:defined) { opacity: 0; }
+ide-app:not(:defined) { opacity: 0; }
+ide-code:not(:defined) { opacity: 0; }
+i18n-translate:not(:defined) { opacity: 0; }
+  :root {
+  --black: #000000;
+  --white: #FFFFFF;
+  --info: #1474FC;
+  --error: #DC3545;
+  --warning: #FF7B07;
+  --success: #28A745;
+  --muted: #999999;
+}
+
+.light {
+  --bg-0: #EFEFEF;
+  --bg-1: #CFCFCF;
+  --bg-2: #AFAFAF;
+  --bg-3: #8F8F8F;
+  --bg-4: #6F6F6F;
+  --bd-0: #EFEFEF;
+  --bd-1: #CFCFCF;
+  --bd-2: #AFAFAF;
+  --bd-3: #8F8F8F;
+  --bd-4: #6F6F6F;
+  --bg-inverse: #242424;
+  --tx-0: #000000;
+  --tx-1: #242424;
+  --tx-inverse: #CFCFCF;
+}
+
+.dark {
+  --bg-0: #121212;
+  --bg-1: #222222;
+  --bg-2: #323232;
+  --bg-3: #424242;
+  --bg-4: #525252;
+  --bd-0: #121212;
+  --bd-1: #222222;
+  --bd-2: #323232;
+  --bd-3: #424242;
+  --bd-4: #525252;
+  --bg-inverse: #DBDBDB;
+  --tx-0: #FFFFFF;
+  --tx-1: #CFCFCF;
+  --tx-inverse: #222222;
+}
+  html-head { display: block; }
+html-header { display: block; }
+html-aside { display: block; }
+panel-layout { display: block; }
+panel-head { display: block; }
+panel-left { display: block; }
+panel-main { display: block; }
+tui-tab { display: block; }
+api-docs { display: block; }
+app-head { display: block; }
+app-left { display: block; }
+app-main { display: block; }
+ide-app { display: block; }
+ide-code { display: block; }
+i18n-translate { display: block; }
+  .arial { font-family: Arial, sans-serif; }
+.none { display: none; }
+.block { display: block; }
+.flex { display: flex; }
+.inline { display: inline; }
+.relative { position: relative; }
+.absolute { position: absolute; }
+.static { position: static; }
+.bottom-0 { bottom: 0px; }
+.bottom-60 { bottom: 60px; }
+.left-0 { left: 0px; }
+.left-226 { left: 226px; }
+.left-0 { left: 0px; }
+.left-226 { left: 226px; }
+.left--226 { left: -226px; }
+.left-170 { left: 170px; }
+.right-0 { right: 0px; }
+.right-200 { right: 200px; }
+.right-0 { right: 0px; }
+.right-200 { right: 200px; }
+.top-0 { top: 0px; }
+.top-60 { top: 60px; }
+.top-45 { top: 45px; }
+.z-1 { z-index: 1; }
+.z-2 { z-index: 2; }
+.flex-grow { flex-grow: 1; }
+.flex-center { align-items: center; justify-content: center; }
+.flex-center-y { align-items: center; }
+.gap-10 { gap: 10px; }
+.scroll-auto { overflow: auto; }
+.scroll-hidden { overflow: hidden; }
+.scroll-x-auto { overflow-x: auto; }
+.scroll-x-hidden { overflow-x: hidden; }
+.scroll-y-auto { overflow-y: auto; }
+.h-full { height: 100%; }
+.h-26 { height: 26px; }
+.h-7289 { height: 7289px; }
+.h-905496362982981723 { height: 905496362982981723px; }
+.h-60 { height: 60px; }
+.h-45 { height: 45px; }
+.h-000000 { height: 000000px; }
+.h-999999 { height: 999999px; }
+.h-10 { height: 10px; }
+.h-36 { height: 36px; }
+.h-calc-full-60 { height: calc(100% - 60px); }
+.vh { height: 100vh; }
+.vw { width: 100vw; }
+.w-full { width: 100%; }
+.w-226 { width: 226px; }
+.w-170 { width: 170px; }
+.w-0 { width: 0px; }
+.w-10 { width: 10px; }
+.bg-black { background-color: var(--black) !important; }
+.bg-t-1 { background-color: var(--bg-1) !important; }
+.bg-t-2 { background-color: var(--bg-2) !important; }
+.bg-t-0 { background-color: var(--bg-0) !important; }
+.bg-h-cb3837 { background-color: #cb3837; }
+.bg-h-7289da { background-color: #7289da; }
+.bg-h-000000 { background-color: #000000; }
+.bg-h-999999 { background-color: #999999; }
+.tx-5 { font-size: 5px; }
+.tx-14 { font-size: 14px; }
+.tx-16 { font-size: 16px; }
+.tx-30 { font-size: 30px; }
+.tx-lg { font-size: 16px; }
+.tx-5xl { font-size: 26px; }
+.tx-center { text-align: center; }
+.tx-right { text-align: right; }
+.tx-bold { font-weight: bold; }
+.tx-uppercase { text-transform: uppercase; }
+.tx-lh-36 { line-height: 36px; }
+.tx-primary { color: var(--primary) !important; }
+.tx-white { color: var(--white) !important; }
+.tx-muted { color: var(--muted) !important; }
+.tx-t-1 { color: var(--tx-1) !important; }
+.bd-solid { border-style: solid; }
+.bd-t-2 { border-color: var(--bd-2) !important; }
+.bd-t-1 { border-color: var(--bd-1) !important; }
+.bdb-0 { border-bottom-width: 0px; }
+.bdl-0 { border-left-width: 0px; }
+.bdr-1 { border-right-width: 1px; }
+.bdt-1 { border-top-width: 1px; }
+.bdx-0 { border-left-width: 0px; border-right-width: 0px; }
+.bdy-0 { border-top-width: 0px; border-bottom-width: 0px; }
+.pill { border-radius: 10000px; }
+.curve-t-sm { border-radius: 4px 4px 0 0; }
+.m-0 { margin: 0px; }
+.m-0 { margin: 0px; }
+.m-60 { margin: 60px; }
+.mb-0 { margin-bottom: 0px; }
+.mb-100 { margin-bottom: 100px; }
+.ml-10 { margin-left: 10px; }
+.ml-5 { margin-left: 5px; }
+.ml-2 { margin-left: 2px; }
+.mr-10 { margin-right: 10px; }
+.mt-0 { margin-top: 0px; }
+.mt-20 { margin-top: 20px; }
+.p-5 { padding: 5px; }
+.p-0 { padding: 0px; }
+.p-60 { padding: 60px; }
+.p-10 { padding: 10px; }
+.p-45 { padding: 45px; }
+.p-10 { padding: 10px; }
+.pb-10 { padding-bottom: 10px; }
+.pl-10 { padding-left: 10px; }
+.pl-5 { padding-left: 5px; }
+.pl-15 { padding-left: 15px; }
+.pr-10 { padding-right: 10px; }
+.pr-5 { padding-right: 5px; }
+.pt-20 { padding-top: 20px; }
+.pt-5 { padding-top: 5px; }
+.pt-10 { padding-top: 10px; }
+.px-20 { padding-left: 20px; padding-right: 20px; }
+.py-15 { padding-top: 15px; padding-bottom: 15px; }
+.py-5 { padding-top: 5px; padding-bottom: 5px; }
+.py-10 { padding-top: 10px; padding-bottom: 10px; }
+.py-20 { padding-top: 20px; padding-bottom: 20px; }
+.py-40 { padding-top: 40px; padding-bottom: 40px; }
+.cursor-pointer { cursor: pointer; }
+.transition-500 { transition: 500ms; }
+.shadow-0-0-10-0-0-0-5 { box-shadow: 0px 0px 10px rgb(0, 0, 0, 0.5); }
+@media (max-width: 767px) {
+  .md-inline-block { display: inline-block; }
+  .md-left-0 { left: 0px; }
+  .md-left-226 { left: 226px; }
+  .md-left--226 { left: -226px; }
+  .md-right-0 { right: 0px; }
+  .md-right-200 { right: 200px; }
+}
\ No newline at end of file
diff --git a/docs/build/client/3550a936d66e61695120.html b/docs/build/client/3550a936d66e61695120.html
index 9b93e6e..416158f 100644
--- a/docs/build/client/3550a936d66e61695120.html
+++ b/docs/build/client/3550a936d66e61695120.html
@@ -18,152 +18,207 @@
   
   
   
-  
+  
   
   
   
   
 
-  
-    

-  
-  
-    Temple Logo
-  
-  
Temple

-  
+      
+        
+          

+            Single Page App
+          

 
-        
-          A single page application (SPA) is a website or web 
-          application that dynamically rewrites a current web page with 
-          new data from a web server, instead of the default method of 
-          a web browser loading entire new pages. Temple is capable of 
-          creating reactive SPAs using Webpack and TypeScript.
-        
+          
+            A single page application (SPA) is a website or web 
+            application that dynamically rewrites a current web page with 
+            new data from a web server, instead of the default method of 
+            a web browser loading entire new pages. Temple is capable of 
+            creating reactive SPAs using Webpack and TypeScript.
+          
 
-        
-          First install the following Temple packages.
-        
-        
-          npm install --save-dev @ossph/temple @ossph/temple-loader
-        
+          
+            First install the following Temple packages.
+          
+          
+            npm install --save-dev @ossph/temple @ossph/temple-loader
+          
 
-        
-          Then, install the following TypeScript packages.
-        
-        
-          npm install --save-dev @types/node ts-loader ts-node typescript
-        
+          
+            Then, install the following TypeScript packages.
+          
+          
+            npm install --save-dev @types/node ts-loader ts-node typescript
+          
 
-        
-          Then, install the following Webpack packages.
-        
-        
-          npm install --save-dev html-webpack-plugin webpack-dev-server webpack webpack-cli
-        
+          
+            Then, install the following Webpack packages.
+          
+          
+            npm install --save-dev html-webpack-plugin webpack-dev-server webpack webpack-cli
+          
 
-        
-          Next create the following files and directories.
-        
+          
+            Next create the following files and directories.
+          
 
-        
-          

-            

-              
-                src/client.ts
+          
+            
+              

+                
+                  src/client.ts
+                
+                
+                  src/app.tml
+                
+                
+                  index.html
+                
+                
+                  webpack.config.js
+                
+                
+                  tsconfig.json
+                
+                
+                  package.json
+                
+              

+            
+            
+              

+                
+                src
+              

+              
+                
+                app.tml
               
-              
-                src/app.tml
+              
+                
+                client.ts
               
-              
+              
+                
                 index.html
               
-              
-                webpack.config.js
+              
+                
+                package.json
               
-              
+              
+                
                 tsconfig.json
               
-              
-                package.json
+              
+                
+                webpack.config.js
               
-            

-          

-          

-            

-              
-              src
-            

-            
-              
-              app.tml
-            
-            
-              
-              client.ts
-            
-            
-              
-              index.html
-            
-            
-              
-              package.json
-            
-            
-              
-              tsconfig.json
-            
-            
-              
-              webpack.config.js
-            
-          

-          

-            

+            
+            
               

-          

-        
-        
-          To test the SPA and see the results, run the following command in terminal.
-        
-        
-          
-            npm run dev
-          
-        
-        
-        
-      
-      

-    
+            
+          
+          
+            To test the SPA and see the results, run the following command in terminal.
+          
+          
+            
+              npm run dev
+            
+          
+          
+          
+          

+        
+      
+    
   
 
\ No newline at end of file
diff --git a/docs/build/client/3550a936d66e61695120.js b/docs/build/client/3550a936d66e61695120.js
index 60b7a3f..6f1ddff 100644
--- a/docs/build/client/3550a936d66e61695120.js
+++ b/docs/build/client/3550a936d66e61695120.js
@@ -1,20 +1,49 @@
-var TempleAPI=(()=>{var xt=Object.create;var ge=Object.defineProperty;var Tt=Object.getOwnPropertyDescriptor;var Et=Object.getOwnPropertyNames;var Ft=Object.getPrototypeOf,kt=Object.prototype.hasOwnProperty;var O=(t,e)=>()=>(e||t((e={exports:{}}).exports,e),e.exports),jt=(t,e)=>{for(var r in e)ge(t,r,{get:e[r],enumerable:!0})},Je=(t,e,r,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let n of Et(e))!kt.call(t,n)&&n!==r&&ge(t,n,{get:()=>e[n],enumerable:!(i=Tt(e,n))||i.enumerable});return t};var D=(t,e,r)=>(r=t!=null?xt(Ft(t)):{},Je(e||!t||!t.__esModule?ge(r,"default",{value:t,enumerable:!0}):r,t)),St=t=>Je(ge({},"__esModule",{value:!0}),t);var Me=O(Oe=>{"use strict";Object.defineProperty(Oe,"__esModule",{value:!0});var Pe=class extends Error{static for(e,...r){return r.forEach(function(i){e=e.replace("%s",i)}),new this(e)}static forErrorsFound(e){let r=new this("Invalid Parameters");return r.errors=e,r}static require(e,r,...i){if(!e){for(let n of i)r=r.replace("%s",n);throw new this(r)}}constructor(e,r=500){super(),this.errors={},this.start=0,this.end=0,this.message=e,this.name=this.constructor.name,this.code=r}withCode(e){return this.code=e,this}withPosition(e,r){return this.start=e,this.end=r,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};Oe.default=Pe});var Q=O(K=>{"use strict";Object.defineProperty(K,"__esModule",{value:!0});K.TempleEmitter=void 0;var he=class extends EventTarget{emit(e,r){return this.dispatchEvent(new CustomEvent(e,{detail:r})),this}on(e,r){if(e==="ready"&&document.readyState!=="loading"){let i=new CustomEvent("ready");return setTimeout(()=>r(i),1),this}return this.addEventListener(e,r),this}once(e,r){let i=n=>{this.unbind(e,i),r(n)};return this.on(e,i),this}unbind(e,r){return this.removeEventListener(e,r),this}};K.TempleEmitter=he;var Xe=new he;document.onreadystatechange=()=>{document.readyState!=="loading"&&Xe.emit("ready")};K.default=Xe});var $e=O(ee=>{"use strict";var Pt=ee&&ee.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ee,"__esModule",{value:!0});var Ce=Pt(Q()),De=class{get attributes(){return Object.assign({},this._attributes)}get element(){return this._element}constructor(e,r){this._element=e,this._attributes=r}hasAttribute(e){return e in this._attributes}getAttribute(e){return this._attributes[e]}removeAttribute(e,r=!1){let i=this.getAttribute(e);return typeof i>"u"?this:(delete this._attributes[e],this._element.removeAttribute(e),r||Ce.default.emit("attribute-remove",{element:this,key:e,previous:i}),this)}setAttribute(e,r,i=!1){if(typeof r>"u")return this.removeAttribute(e,i);let n=this.getAttribute(e);return n===r?this:(this._attributes[e]=r,typeof r=="string"&&this._element.setAttribute(e,r),i||(typeof n>"u"?Ce.default.emit("attribute-create",{element:this,key:e,value:r}):Ce.default.emit("attribute-update",{element:this,key:e,value:r,previous:n})),this)}setAttributes(e,r=!1){for(let[n,p]of Object.entries(e))this.setAttribute(n,p,r);let i=Object.keys(e);for(let n of Object.keys(this._attributes))i.includes(n)||this.removeAttribute(n,r);return this}};ee.default=De});var be=O(te=>{"use strict";var Ot=te&&te.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(te,"__esModule",{value:!0});var Mt=Ot($e()),me=class{static get elements(){return this._elements}static createComponent(e,r,i,n=[]){let p=document.createElement("template");p.innerHTML=`<${e}>`;let g=p.content.querySelector(`${e}`);Object.setPrototypeOf(g,r.prototype),g.constructor=r.constructor,g.constructor.component=r.component;for(let[_,y]of Object.entries(i))typeof y=="string"?g.setAttribute(_,y):y===!0&&g.setAttribute(_,_);return g._TempleAttributes=i,g.props=i,n.forEach(_=>g.appendChild(_)),g.register(),customElements.get(e)||g.connectedCallback(),this.register(g,i)}static createElement(e,r,i=[]){let n=document.createElement(e);for(let[p,m]of Object.entries(r))typeof m=="string"?n.setAttribute(p,m):m===!0&&n.setAttribute(p,p);return i.filter(p=>typeof p<"u").forEach(p=>n.appendChild(p)),this.register(n,r)}static createText(e,r=!1){return document.createTextNode(e)}static filter(e){let r=[];return this._elements.forEach((i,n)=>{e(i,n)&&r.push(i)}),r}static get(e){return this._elements.get(e)||null}static has(e){return this._elements.has(e)}static map(e){let r=[];return this._elements.forEach((i,n)=>{r.push(e(i,n))}),r}static register(e,r){if(this.has(e))return this.get(e);let i=new Mt.default(e,r||{});return this._elements.set(e,i),i}};me._elements=new Map;te.default=me});var z=O(re=>{"use strict";Object.defineProperty(re,"__esModule",{value:!0});re.TempleDataMap=void 0;var _e=class{constructor(){window.__APP_DATA__||(window.__APP_DATA__={})}clear(){return window.__APP_DATA__={},this}delete(e){return this.has(e)?(delete window.__APP_DATA__[e],!0):!1}entries(){return Object.entries(window.__APP_DATA__)}has(e){return e in window.__APP_DATA__}get(e){return window.__APP_DATA__[e]}keys(){return Object.keys(window.__APP_DATA__)}set(e,r){return window.__APP_DATA__[e]=r,this}values(){return Object.values(window.__APP_DATA__)}};re.TempleDataMap=_e;var Ct=new _e;re.default=Ct});var Ve=O(ae=>{"use strict";var qe=ae&&ae.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ae,"__esModule",{value:!0});var ne=qe(be()),ve=qe(Q()),Ye=qe(z()),Le=class t extends HTMLElement{constructor(){super(...arguments),this._initiated=!1,this._template=null,this._attributes={},this._props={},this._children=void 0,this._rendering=!1}static register(){customElements.define(this.component[0],this)}get attr(){return this._attributes}get element(){return ne.default.has(this)?ne.default.get(this):ne.default.register(this,this._TempleAttributes||{})}get metadata(){let[e,r]=this.constructor.component;return{tagname:e,classname:r}}get originalChildren(){return this._children}get initiated(){return this._initiated}get props(){return this._props}set props(e){this._props=Object.assign({},e),this._attributes=Object.fromEntries(Object.entries(e).filter(r=>typeof r[1]=="string"||r[1]===!0))}adoptedCallback(){this.render()}attributeChangedCallback(e,r,i){this.props=Object.assign(Object.assign({},this.props),{[e]:i}),this.render()}connectedCallback(){this.wait()}disconnectedCallback(){}getParentComponent(){let e=this.parentElement;for(;e;){if(e instanceof t)return e;e=e.parentElement}return null}register(){ne.default.register(this,this._props)}render(){let e=this.getParentComponent();if(e&&!e.initiated)return;if(this._rendering)return;this._rendering=!0,Ye.default.set("current",this);let r=this.styles();this._template?ve.default.emit("unmounted",this):this._template=this.template();let i=this._template().filter(Boolean);if(r.length===0)this.textContent="",i.forEach(n=>this.appendChild(n));else{this.shadowRoot||this.attachShadow({mode:"open"});let n=this.shadowRoot;this.textContent="",n.textContent="";let p=document.createElement("style");p.innerText=r,n.appendChild(p),i.forEach(m=>{var g;return(g=this.shadowRoot)===null||g===void 0?void 0:g.appendChild(m)})}return Ye.default.delete("current"),this._initiated=!0,ve.default.emit("mounted",this),this._rendering=!1,this.shadowRoot?this.shadowRoot.innerHTML:this.innerHTML}wait(){if(document.readyState!=="loading")this._update();else{let e=()=>{this._update(),ve.default.unbind("ready",e)};ve.default.on("ready",e)}}_toNodeList(e){return e instanceof Node?[e]:Array.isArray(e)&&e.every(r=>r instanceof Node)?e:[ne.default.createText(String(e))]}_update(){typeof this._children>"u"&&(this._children=Array.from(this.childNodes||[]));let e=this.element;e&&(this.props=Object.assign({},e.attributes),this.render()),this._initiated||this.render()}};ae.default=Le});var Ke=O(se=>{"use strict";var Dt=se&&se.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(se,"__esModule",{value:!0});var $t=Dt(z());function Lt(t){let e=$t.default.get("env")||{};return t?e[t]||null:e}se.default=Lt});var Re=O(ie=>{"use strict";var qt=ie&&ie.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ie,"__esModule",{value:!0});ie.default=Rt;var Qe=qt(z());function Rt(t=null){return t||(t=Qe.default.get("current")||null),t?t==="document"?Qe.default.get("props")||{}:t.props:{}}});var et=O(le=>{"use strict";var It=le&&le.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(le,"__esModule",{value:!0});le.default=Ht;var zt=It(Re());function Ht(t=null){return(0,zt.default)(t).class}});var rt=O(G=>{"use strict";var Nt=G&&G.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(G,"__esModule",{value:!0});G.innerHTML=Gt;G.default=tt;var Bt=Nt(z());function Gt(t=null){let e=tt(t),r=document.createElement("template");return r.append(...e),r.innerHTML}function tt(t=null){return t||(t=Bt.default.get("current")||null),t?t.originalChildren||[]:[]}});var st=O(H=>{"use strict";var at=H&&H.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(H,"__esModule",{value:!0});H.SignalRegistry=void 0;H.default=Zt;var nt=at(Me()),Ut=at(z()),U=class t{static observe(e,r){let i={getter:()=>n.raw,setter:m=>m},n={raw:r,getter(m){return i.getter=m,n},setter(m){return i.setter=m,n}};Object.defineProperty(n,"value",{get(){return i.getter()},set(m){let g=i.setter(m),_=t.serialize(g)!==t.serialize(n.raw);n.raw=g,_&&e.render()}});let p=this._observers.get(e);return p?(p.observed++,p.values.push(n)):this._observers.set(e,{observed:1,values:[n]}),n}static observer(e){return this._observers.get(e)||null}static serialize(e){return JSON.stringify(e)}};H.SignalRegistry=U;U._observers=new Map;function Zt(t,e=null){if(e||(e=Ut.default.get("current")||null),!e)throw nt.default.for("Signals can only be created within a Temple component");if(!e.initiated)return U.observe(e,t);let r=U.observer(e);if(!r)throw nt.default.for("State mismatch");return r.values[r.observed++%r.values.length]}});var ct=O(ye=>{"use strict";var lt=ye&&ye.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ye,"__esModule",{value:!0});var it=lt(be()),ot=lt(Q()),ut=(t,e)=>Array.from(t.querySelectorAll("*")).filter(r=>{let i=it.default.get(r);return i&&i.hasAttribute(e)}).map(r=>it.default.get(r));function Ie(t,e){ot.default.on("mounted",r=>{if(!r.detail)return;let i=r.detail;ut(i.shadowRoot||i,t).forEach(e)})}function Wt(t,e){ot.default.on("unmounted",r=>{if(!r.detail)return;let i=r.detail;ut(i.shadowRoot||i,t).forEach(e)})}Ie("mount",t=>{let e=t.getAttribute("mount");if(typeof e=="function"){let r=new CustomEvent("mount",{detail:{node:t,target:t.element}});e(r)}});Wt("unmount",t=>{let e=t.getAttribute("unmount");if(typeof e=="function"){let r=new CustomEvent("unmount",{detail:{node:t,target:t.element}});e(r)}});Ie("if",t=>{let e=t.getAttribute("if");(e===!1||e==="false"||typeof e=="function"&&!e())&&t.element.remove()});["click","dblclick","mousedown","mouseup","mousemove","mouseover","mouseout","wheel","keydown","keypress","keyup","blur","change","contextmenu","focus","input","submit","invalid","reset","search","select","copy","cut","paste","drag","dragstart","dragend","dragover","dragenter","dragleave","drop","scroll","durationchange","ended","error","loadeddata","loadedmetadata","loadstart","pause","play","playing","progress","ratechange","seeked","seeking","stalled","suspend","timeupdate","volumechange","waiting","animationstart","animationend","animationiteration","transitionend","toggle"].forEach(t=>Ie(t,e=>{let r=e.getAttribute(t);typeof r=="function"&&(e.element.removeEventListener(t,r),e.element.addEventListener(t,r))}))});var ze=O(h=>{"use strict";var Jt=h&&h.__createBinding||(Object.create?function(t,e,r,i){i===void 0&&(i=r);var n=Object.getOwnPropertyDescriptor(e,r);(!n||("get"in n?!e.__esModule:n.writable||n.configurable))&&(n={enumerable:!0,get:function(){return e[r]}}),Object.defineProperty(t,i,n)}:function(t,e,r,i){i===void 0&&(i=r),t[i]=e[r]}),Xt=h&&h.__setModuleDefault||(Object.create?function(t,e){Object.defineProperty(t,"default",{enumerable:!0,value:e})}:function(t,e){t.default=e}),we=h&&h.__importStar||function(t){if(t&&t.__esModule)return t;var e={};if(t!=null)for(var r in t)r!=="default"&&Object.prototype.hasOwnProperty.call(t,r)&&Jt(e,t,r);return Xt(e,t),e},N=h&&h.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(h,"__esModule",{value:!0});h.SignalRegistry=h.TempleException=h.TempleEmitter=h.TempleElement=h.TempleRegistry=h.TempleComponent=h.TempleDataMap=h.emitter=h.signal=h.innerHTML=h.children=h.classnames=h.props=h.env=h.data=void 0;var Yt=N(Me());h.TempleException=Yt.default;var Vt=N(Ve());h.TempleComponent=Vt.default;var Kt=N(be());h.TempleRegistry=Kt.default;var Qt=N($e());h.TempleElement=Qt.default;var dt=we(Q());h.emitter=dt.default;Object.defineProperty(h,"TempleEmitter",{enumerable:!0,get:function(){return dt.TempleEmitter}});var ft=we(z());h.data=ft.default;Object.defineProperty(h,"TempleDataMap",{enumerable:!0,get:function(){return ft.TempleDataMap}});var er=N(Ke());h.env=er.default;var tr=N(Re());h.props=tr.default;var rr=N(et());h.classnames=rr.default;var pt=we(rt());h.children=pt.default;Object.defineProperty(h,"innerHTML",{enumerable:!0,get:function(){return pt.innerHTML}});var gt=we(st());h.signal=gt.default;Object.defineProperty(h,"SignalRegistry",{enumerable:!0,get:function(){return gt.SignalRegistry}});ct()});var I=O((wr,ht)=>{ht.exports={...ze()}});var mt=O((xr,xe)=>{var nr=typeof window<"u"?window:typeof WorkerGlobalScope<"u"&&self instanceof WorkerGlobalScope?self:{};var c=function(t){var e=/(?:^|\s)lang(?:uage)?-([\w-]+)(?=\s|$)/i,r=0,i={},n={manual:t.Prism&&t.Prism.manual,disableWorkerMessageHandler:t.Prism&&t.Prism.disableWorkerMessageHandler,util:{encode:function s(a){return a instanceof p?new p(a.type,s(a.content),a.alias):Array.isArray(a)?a.map(s):a.replace(/&/g,"&").replace(/"u")return null;if("currentScript"in document)return document.currentScript;try{throw new Error}catch(o){var s=(/at [^(\r\n]*\((.*):[^:]+:[^:]+\)$/i.exec(o.stack)||[])[1];if(s){var a=document.getElementsByTagName("script");for(var l in a)if(a[l].src==s)return a[l]}return null}},isActive:function(s,a,l){for(var o="no-"+a;s;){var u=s.classList;if(u.contains(a))return!0;if(u.contains(o))return!1;s=s.parentElement}return!!l}},languages:{plain:i,plaintext:i,text:i,txt:i,extend:function(s,a){var l=n.util.clone(n.languages[s]);for(var o in a)l[o]=a[o];return l},insertBefore:function(s,a,l,o){o=o||n.languages;var u=o[s],f={};for(var b in u)if(u.hasOwnProperty(b)){if(b==a)for(var d in l)l.hasOwnProperty(d)&&(f[d]=l[d]);l.hasOwnProperty(b)||(f[b]=u[b])}var x=o[s];return o[s]=f,n.languages.DFS(n.languages,function(S,q){q===x&&S!=s&&(this[S]=f)}),f},DFS:function s(a,l,o,u){u=u||{};var f=n.util.objId;for(var b in a)if(a.hasOwnProperty(b)){l.call(a,b,a[b],o||b);var d=a[b],x=n.util.type(d);x==="Object"&&!u[f(d)]?(u[f(d)]=!0,s(d,l,null,u)):x==="Array"&&!u[f(d)]&&(u[f(d)]=!0,s(d,l,b,u))}}},plugins:{},highlightAll:function(s,a){n.highlightAllUnder(document,s,a)},highlightAllUnder:function(s,a,l){var o={callback:l,container:s,selector:'code[class*="language-"], [class*="language-"] code, code[class*="lang-"], [class*="lang-"] code'};n.hooks.run("before-highlightall",o),o.elements=Array.prototype.slice.apply(o.container.querySelectorAll(o.selector)),n.hooks.run("before-all-elements-highlight",o);for(var u=0,f;f=o.elements[u++];)n.highlightElement(f,a===!0,o.callback)},highlightElement:function(s,a,l){var o=n.util.getLanguage(s),u=n.languages[o];n.util.setLanguage(s,o);var f=s.parentElement;f&&f.nodeName.toLowerCase()==="pre"&&n.util.setLanguage(f,o);var b=s.textContent,d={element:s,language:o,grammar:u,code:b};function x(q){d.highlightedCode=q,n.hooks.run("before-insert",d),d.element.innerHTML=d.highlightedCode,n.hooks.run("after-highlight",d),n.hooks.run("complete",d),l&&l.call(d.element)}if(n.hooks.run("before-sanity-check",d),f=d.element.parentElement,f&&f.nodeName.toLowerCase()==="pre"&&!f.hasAttribute("tabindex")&&f.setAttribute("tabindex","0"),!d.code){n.hooks.run("complete",d),l&&l.call(d.element);return}if(n.hooks.run("before-highlight",d),!d.grammar){x(n.util.encode(d.code));return}if(a&&t.Worker){var S=new Worker(n.filename);S.onmessage=function(q){x(q.data)},S.postMessage(JSON.stringify({language:d.language,code:d.code,immediateClose:!0}))}else x(n.highlight(d.code,d.grammar,d.language))},highlight:function(s,a,l){var o={code:s,grammar:a,language:l};if(n.hooks.run("before-tokenize",o),!o.grammar)throw new Error('The language "'+o.language+'" has no grammar.');return o.tokens=n.tokenize(o.code,o.grammar),n.hooks.run("after-tokenize",o),p.stringify(n.util.encode(o.tokens),o.language)},tokenize:function(s,a){var l=a.rest;if(l){for(var o in l)a[o]=l[o];delete a.rest}var u=new _;return y(u,u.head,s),g(s,u,a,u.head,0),F(u)},hooks:{all:{},add:function(s,a){var l=n.hooks.all;l[s]=l[s]||[],l[s].push(a)},run:function(s,a){var l=n.hooks.all[s];if(!(!l||!l.length))for(var o=0,u;u=l[o++];)u(a)}},Token:p};t.Prism=n;function p(s,a,l,o){this.type=s,this.content=a,this.alias=l,this.length=(o||"").length|0}p.stringify=function s(a,l){if(typeof a=="string")return a;if(Array.isArray(a)){var o="";return a.forEach(function(x){o+=s(x,l)}),o}var u={type:a.type,content:s(a.content,l),tag:"span",classes:["token",a.type],attributes:{},language:l},f=a.alias;f&&(Array.isArray(f)?Array.prototype.push.apply(u.classes,f):u.classes.push(f)),n.hooks.run("wrap",u);var b="";for(var d in u.attributes)b+=" "+d+'="'+(u.attributes[d]||"").replace(/"/g,""")+'"';return"<"+u.tag+' class="'+u.classes.join(" ")+'"'+b+">"+u.content+""};function m(s,a,l,o){s.lastIndex=a;var u=s.exec(l);if(u&&o&&u[1]){var f=u[1].length;u.index+=f,u[0]=u[0].slice(f)}return u}function g(s,a,l,o,u,f){for(var b in l)if(!(!l.hasOwnProperty(b)||!l[b])){var d=l[b];d=Array.isArray(d)?d:[d];for(var x=0;x=f.reach);L+=P.value.length,P=P.next){var B=P.value;if(a.length>s.length)return;if(!(B instanceof p)){var ce=1,$;if(Ue){if($=m(Ze,L,s,Ge),!$||$.index>=s.length)break;var de=$.index,wt=$.index+$[0].length,R=L;for(R+=P.value.length;de>=R;)P=P.next,R+=P.value.length;if(R-=P.value.length,L=R,P.value instanceof p)continue;for(var V=P;V!==a.tail&&(Rf.reach&&(f.reach=je);var pe=P.prev;ke&&(pe=y(a,pe,ke),L+=ke.length),A(a,pe,ce);var At=new p(b,q?n.tokenize(fe,q):fe,vt,fe);if(P=y(a,pe,At),We&&y(a,P,We),ce>1){var Se={cause:b+","+x,reach:je};g(s,a,l,P.prev,L,Se),f&&Se.reach>f.reach&&(f.reach=Se.reach)}}}}}}function _(){var s={value:null,prev:null,next:null},a={value:null,prev:s,next:null};s.next=a,this.head=s,this.tail=a,this.length=0}function y(s,a,l){var o=a.next,u={value:l,prev:a,next:o};return a.next=u,o.prev=u,s.length++,u}function A(s,a,l){for(var o=a.next,u=0;u/,greedy:!0},prolog:{pattern:/<\?[\s\S]+?\?>/,greedy:!0},doctype:{pattern:/"'[\]]|"[^"]*"|'[^']*')+(?:\[(?:[^<"'\]]|"[^"]*"|'[^']*'|<(?!!--)|)*\]\s*)?>/i,greedy:!0,inside:{"internal-subset":{pattern:/(^[^\[]*\[)[\s\S]+(?=\]>$)/,lookbehind:!0,greedy:!0,inside:null},string:{pattern:/"[^"]*"|'[^']*'/,greedy:!0},punctuation:/^$|[[\]]/,"doctype-tag":/^DOCTYPE/i,name:/[^\s<>'"]+/}},cdata:{pattern://i,greedy:!0},tag:{pattern:/<\/?(?!\d)[^\s>\/=$<%]+(?:\s(?:\s*[^\s>\/=]+(?:\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))|(?=[\s/>])))+)?\s*\/?>/,greedy:!0,inside:{tag:{pattern:/^<\/?[^\s>\/]+/,inside:{punctuation:/^<\/?/,namespace:/^[^\s>\/:]+:/}},"special-attr":[],"attr-value":{pattern:/=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+)/,inside:{punctuation:[{pattern:/^=/,alias:"attr-equals"},{pattern:/^(\s*)["']|["']$/,lookbehind:!0}]}},punctuation:/\/?>/,"attr-name":{pattern:/[^\s>\/]+/,inside:{namespace:/^[^\s>\/:]+:/}}}},entity:[{pattern:/&[\da-z]{1,8};/i,alias:"named-entity"},/&#x?[\da-f]{1,8};/i]};c.languages.markup.tag.inside["attr-value"].inside.entity=c.languages.markup.entity;c.languages.markup.doctype.inside["internal-subset"].inside=c.languages.markup;c.hooks.add("wrap",function(t){t.type==="entity"&&(t.attributes.title=t.content.replace(/&/,"&"))});Object.defineProperty(c.languages.markup.tag,"addInlined",{value:function(e,r){var i={};i["language-"+r]={pattern:/(^$)/i,lookbehind:!0,inside:c.languages[r]},i.cdata=/^$/i;var n={"included-cdata":{pattern://i,inside:i}};n["language-"+r]={pattern:/[\s\S]+/,inside:c.languages[r]};var p={};p[e]={pattern:RegExp(/(<__[^>]*>)(?:))*\]\]>|(?!)/.source.replace(/__/g,function(){return e}),"i"),lookbehind:!0,greedy:!0,inside:n},c.languages.insertBefore("markup","cdata",p)}});Object.defineProperty(c.languages.markup.tag,"addAttribute",{value:function(t,e){c.languages.markup.tag.inside["special-attr"].push({pattern:RegExp(/(^|["'\s])/.source+"(?:"+t+")"+/\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))/.source,"i"),lookbehind:!0,inside:{"attr-name":/^[^\s=]+/,"attr-value":{pattern:/=[\s\S]+/,inside:{value:{pattern:/(^=\s*(["']|(?!["'])))\S[\s\S]*(?=\2$)/,lookbehind:!0,alias:[e,"language-"+e],inside:c.languages[e]},punctuation:[{pattern:/^=/,alias:"attr-equals"},/"|'/]}}}})}});c.languages.html=c.languages.markup;c.languages.mathml=c.languages.markup;c.languages.svg=c.languages.markup;c.languages.xml=c.languages.extend("markup",{});c.languages.ssml=c.languages.xml;c.languages.atom=c.languages.xml;c.languages.rss=c.languages.xml;(function(t){var e=/(?:"(?:\\(?:\r\n|[\s\S])|[^"\\\r\n])*"|'(?:\\(?:\r\n|[\s\S])|[^'\\\r\n])*')/;t.languages.css={comment:/\/\*[\s\S]*?\*\//,atrule:{pattern:RegExp("@[\\w-](?:"+/[^;{\s"']|\s+(?!\s)/.source+"|"+e.source+")*?"+/(?:;|(?=\s*\{))/.source),inside:{rule:/^@[\w-]+/,"selector-function-argument":{pattern:/(\bselector\s*\(\s*(?![\s)]))(?:[^()\s]|\s+(?![\s)])|\((?:[^()]|\([^()]*\))*\))+(?=\s*\))/,lookbehind:!0,alias:"selector"},keyword:{pattern:/(^|[^\w-])(?:and|not|only|or)(?![\w-])/,lookbehind:!0}}},url:{pattern:RegExp("\\burl\\((?:"+e.source+"|"+/(?:[^\\\r\n()"']|\\[\s\S])*/.source+")\\)","i"),greedy:!0,inside:{function:/^url/i,punctuation:/^\(|\)$/,string:{pattern:RegExp("^"+e.source+"$"),alias:"url"}}},selector:{pattern:RegExp(`(^|[{}\\s])[^{}\\s](?:[^{};"'\\s]|\\s+(?![\\s{])|`+e.source+")*(?=\\s*\\{)"),lookbehind:!0},string:{pattern:e,greedy:!0},property:{pattern:/(^|[^-\w\xA0-\uFFFF])(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*(?=\s*:)/i,lookbehind:!0},important:/!important\b/i,function:{pattern:/(^|[^-a-z0-9])[-a-z0-9]+(?=\()/i,lookbehind:!0},punctuation:/[(){};:,]/},t.languages.css.atrule.inside.rest=t.languages.css;var r=t.languages.markup;r&&(r.tag.addInlined("style","css"),r.tag.addAttribute("style","css"))})(c);c.languages.clike={comment:[{pattern:/(^|[^\\])\/\*[\s\S]*?(?:\*\/|$)/,lookbehind:!0,greedy:!0},{pattern:/(^|[^\\:])\/\/.*/,lookbehind:!0,greedy:!0}],string:{pattern:/(["'])(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/,greedy:!0},"class-name":{pattern:/(\b(?:class|extends|implements|instanceof|interface|new|trait)\s+|\bcatch\s+\()[\w.\\]+/i,lookbehind:!0,inside:{punctuation:/[.\\]/}},keyword:/\b(?:break|catch|continue|do|else|finally|for|function|if|in|instanceof|new|null|return|throw|try|while)\b/,boolean:/\b(?:false|true)\b/,function:/\b\w+(?=\()/,number:/\b0x[\da-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:e[+-]?\d+)?/i,operator:/[<>]=?|[!=]=?=?|--?|\+\+?|&&?|\|\|?|[?*/~^%]/,punctuation:/[{}[\];(),.:]/};c.languages.javascript=c.languages.extend("clike",{"class-name":[c.languages.clike["class-name"],{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$A-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\.(?:constructor|prototype))/,lookbehind:!0}],keyword:[{pattern:/((?:^|\})\s*)catch\b/,lookbehind:!0},{pattern:/(^|[^.]|\.\.\.\s*)\b(?:as|assert(?=\s*\{)|async(?=\s*(?:function\b|\(|[$\w\xA0-\uFFFF]|$))|await|break|case|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally(?=\s*(?:\{|$))|for|from(?=\s*(?:['"]|$))|function|(?:get|set)(?=\s*(?:[#\[$\w\xA0-\uFFFF]|$))|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)\b/,lookbehind:!0}],function:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*(?:\.\s*(?:apply|bind|call)\s*)?\()/,number:{pattern:RegExp(/(^|[^\w$])/.source+"(?:"+(/NaN|Infinity/.source+"|"+/0[bB][01]+(?:_[01]+)*n?/.source+"|"+/0[oO][0-7]+(?:_[0-7]+)*n?/.source+"|"+/0[xX][\dA-Fa-f]+(?:_[\dA-Fa-f]+)*n?/.source+"|"+/\d+(?:_\d+)*n/.source+"|"+/(?:\d+(?:_\d+)*(?:\.(?:\d+(?:_\d+)*)?)?|\.\d+(?:_\d+)*)(?:[Ee][+-]?\d+(?:_\d+)*)?/.source)+")"+/(?![\w$])/.source),lookbehind:!0},operator:/--|\+\+|\*\*=?|=>|&&=?|\|\|=?|[!=]==|<<=?|>>>?=?|[-+*/%&|^!=<>]=?|\.{3}|\?\?=?|\?\.?|[~:]/});c.languages.javascript["class-name"][0].pattern=/(\b(?:class|extends|implements|instanceof|interface|new)\s+)[\w.\\]+/;c.languages.insertBefore("javascript","keyword",{regex:{pattern:RegExp(/((?:^|[^$\w\xA0-\uFFFF."'\])\s]|\b(?:return|yield))\s*)/.source+/\//.source+"(?:"+/(?:\[(?:[^\]\\\r\n]|\\.)*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}/.source+"|"+/(?:\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.)*\])*\])*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}v[dgimyus]{0,7}/.source+")"+/(?=(?:\s|\/\*(?:[^*]|\*(?!\/))*\*\/)*(?:$|[\r\n,.;:})\]]|\/\/))/.source),lookbehind:!0,greedy:!0,inside:{"regex-source":{pattern:/^(\/)[\s\S]+(?=\/[a-z]*$)/,lookbehind:!0,alias:"language-regex",inside:c.languages.regex},"regex-delimiter":/^\/|\/$/,"regex-flags":/^[a-z]+$/}},"function-variable":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*[=:]\s*(?:async\s*)?(?:\bfunction\b|(?:\((?:[^()]|\([^()]*\))*\)|(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)\s*=>))/,alias:"function"},parameter:[{pattern:/(function(?:\s+(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)?\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\))/,lookbehind:!0,inside:c.languages.javascript},{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$a-z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*=>)/i,lookbehind:!0,inside:c.languages.javascript},{pattern:/(\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*=>)/,lookbehind:!0,inside:c.languages.javascript},{pattern:/((?:\b|\s|^)(?!(?:as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)(?![$\w\xA0-\uFFFF]))(?:(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*)\(\s*|\]\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*\{)/,lookbehind:!0,inside:c.languages.javascript}],constant:/\b[A-Z](?:[A-Z_]|\dx?)*\b/});c.languages.insertBefore("javascript","string",{hashbang:{pattern:/^#!.*/,greedy:!0,alias:"comment"},"template-string":{pattern:/`(?:\\[\s\S]|\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}|(?!\$\{)[^\\`])*`/,greedy:!0,inside:{"template-punctuation":{pattern:/^`|`$/,alias:"string"},interpolation:{pattern:/((?:^|[^\\])(?:\\{2})*)\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}/,lookbehind:!0,inside:{"interpolation-punctuation":{pattern:/^\$\{|\}$/,alias:"punctuation"},rest:c.languages.javascript}},string:/[\s\S]+/}},"string-property":{pattern:/((?:^|[,{])[ \t]*)(["'])(?:\\(?:\r\n|[\s\S])|(?!\2)[^\\\r\n])*\2(?=\s*:)/m,lookbehind:!0,greedy:!0,alias:"property"}});c.languages.insertBefore("javascript","operator",{"literal-property":{pattern:/((?:^|[,{])[ \t]*)(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*:)/m,lookbehind:!0,alias:"property"}});c.languages.markup&&(c.languages.markup.tag.addInlined("script","javascript"),c.languages.markup.tag.addAttribute(/on(?:abort|blur|change|click|composition(?:end|start|update)|dblclick|error|focus(?:in|out)?|key(?:down|up)|load|mouse(?:down|enter|leave|move|out|over|up)|reset|resize|scroll|select|slotchange|submit|unload|wheel)/.source,"javascript"));c.languages.js=c.languages.javascript;(function(){if(typeof c>"u"||typeof document>"u")return;Element.prototype.matches||(Element.prototype.matches=Element.prototype.msMatchesSelector||Element.prototype.webkitMatchesSelector);var t="Loading\u2026",e=function(T,v){return"\u2716 Error "+T+" while fetching file: "+v},r="\u2716 Error: File does not exist or is empty",i={js:"javascript",py:"python",rb:"ruby",ps1:"powershell",psm1:"powershell",sh:"bash",bat:"batch",h:"c",tex:"latex"},n="data-src-status",p="loading",m="loaded",g="failed",_="pre[data-src]:not(["+n+'="'+m+'"]):not(['+n+'="'+p+'"])';function y(T,v,E){var s=new XMLHttpRequest;s.open("GET",T,!0),s.onreadystatechange=function(){s.readyState==4&&(s.status<400&&s.responseText?v(s.responseText):s.status>=400?E(e(s.status,s.statusText)):E(r))},s.send(null)}function A(T){var v=/^\s*(\d+)\s*(?:(,)\s*(?:(\d+)\s*)?)?$/.exec(T||"");if(v){var E=Number(v[1]),s=v[2],a=v[3];return s?a?[E,Number(a)]:[E,void 0]:[E,E]}}c.hooks.add("before-highlightall",function(T){T.selector+=", "+_}),c.hooks.add("before-sanity-check",function(T){var v=T.element;if(v.matches(_)){T.code="",v.setAttribute(n,p);var E=v.appendChild(document.createElement("CODE"));E.textContent=t;var s=v.getAttribute("data-src"),a=T.language;if(a==="none"){var l=(/\.(\w+)$/.exec(s)||[,"none"])[1];a=i[l]||l}c.util.setLanguage(E,a),c.util.setLanguage(v,a);var o=c.plugins.autoloader;o&&o.loadLanguages(a),y(s,function(u){v.setAttribute(n,m);var f=A(v.getAttribute("data-range"));if(f){var b=u.split(/\r\n?|\n/g),d=f[0],x=f[1]==null?b.length:f[1];d<0&&(d+=b.length),d=Math.max(0,Math.min(d-1,b.length)),x<0&&(x+=b.length),x=Math.max(0,Math.min(x,b.length)),u=b.slice(d,x).join(`
-`),v.hasAttribute("data-start")||v.setAttribute("data-start",String(d+1))}E.textContent=u,c.highlightElement(E)},function(u){v.setAttribute(n,g),E.textContent=u})}}),c.plugins.fileHighlight={highlight:function(v){for(var E=(v||document).querySelectorAll(_),s=0,a;a=E[s++];)c.highlightElement(a)}};var F=!1;c.fileHighlight=function(){F||(console.warn("Prism.fileHighlight is deprecated. Use `Prism.plugins.fileHighlight.highlight` instead."),F=!0),c.plugins.fileHighlight.highlight.apply(this,arguments)}})()});var oe=O((Tr,bt)=>{bt.exports={...ze()}});var ir={};jt(ir,{BUILD_ID:()=>sr,TempleComponent:()=>k.TempleComponent,TempleElement:()=>k.TempleElement,TempleEmitter:()=>k.TempleEmitter,TempleException:()=>k.TempleException,TempleRegistry:()=>k.TempleRegistry,children:()=>k.children,components:()=>ar,data:()=>k.data,emitter:()=>k.emitter,props:()=>k.props,signal:()=>k.signal});var C=D(I());var Ae=D(I()),Z=class extends Ae.TempleComponent{static component=["main","Main_fd7f1af6410c5b5c8e1f"];styles(){return""}template(){let e=this.props,r=()=>this.originalChildren;return()=>[Ae.TempleRegistry.createElement("main",{},[...this._toNodeList(r())]).element]}};var w=D(I()),He=D(mt()),_t=D(oe()),W=class extends w.TempleComponent{static component=["code","Code_6f36bc13bb6a166c7abc"];styles(){return`:host {
+var TempleAPI=(()=>{var Zt=Object.create;var Oe=Object.defineProperty;var Jt=Object.getOwnPropertyDescriptor;var Xt=Object.getOwnPropertyNames;var Yt=Object.getPrototypeOf,Vt=Object.prototype.hasOwnProperty;var C=(t,e)=>()=>(e||t((e={exports:{}}).exports,e),e.exports),Kt=(t,e)=>{for(var r in e)Oe(t,r,{get:e[r],enumerable:!0})},_t=(t,e,r,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let s of Xt(e))!Vt.call(t,s)&&s!==r&&Oe(t,s,{get:()=>e[s],enumerable:!(i=Jt(e,s))||i.enumerable});return t};var T=(t,e,r)=>(r=t!=null?Zt(Yt(t)):{},_t(e||!t||!t.__esModule?Oe(r,"default",{value:t,enumerable:!0}):r,t)),Qt=t=>_t(Oe({},"__esModule",{value:!0}),t);var ve=C(nt=>{"use strict";Object.defineProperty(nt,"__esModule",{value:!0});var st=class extends Error{static for(e,...r){return r.forEach(function(i){e=e.replace("%s",i)}),new this(e)}static forErrorsFound(e){let r=new this("Invalid Parameters");return r.errors=e,r}static require(e,r,...i){if(!e){for(let s of i)r=r.replace("%s",s);throw new this(r)}}constructor(e,r=500){super(),this.errors={},this.start=0,this.end=0,this.message=e,this.name=this.constructor.name,this.code=r}withCode(e){return this.code=e,this}withPosition(e,r){return this.start=e,this.end=r,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};nt.default=st});var Re=C(M=>{"use strict";var er=M&&M.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(M,"__esModule",{value:!0});M.match=M.TempleEmitter=M.events=void 0;M.bindAttribute=B;M.unbindAttribute=xt;var yt=er(qe());M.events=["click","dblclick","mousedown","mouseup","mousemove","mouseover","mouseout","wheel","keydown","keypress","keyup","blur","change","contextmenu","focus","input","submit","invalid","reset","search","select","copy","cut","paste","drag","dragstart","dragend","dragover","dragenter","dragleave","drop","scroll","durationchange","ended","error","loadeddata","loadedmetadata","loadstart","pause","play","playing","progress","ratechange","seeked","seeking","stalled","suspend","timeupdate","volumechange","waiting","animationstart","animationend","animationiteration","transitionend","toggle"];var $e=class extends EventTarget{emit(e,r){return this.dispatchEvent(new CustomEvent(e,{detail:r})),this}on(e,r){if(e==="ready"&&document.readyState!=="loading"){let i=new CustomEvent("ready");return setTimeout(()=>r(i),1),this}return this.addEventListener(e,r),this}once(e,r){let i=s=>{this.unbind(e,i),r(s)};return this.on(e,i),this}unbind(e,r){return this.removeEventListener(e,r),this}};M.TempleEmitter=$e;var tr=(t,e)=>Array.from(t.querySelectorAll("*")).filter(r=>{let i=yt.default.get(r),s=i&&i.hasAttribute(e)&&!i.hasEvent(e);return s&&i.addEvent(e),s}).map(r=>yt.default.get(r));M.match=tr;function B(t,e){Ne.on("mounted",r=>{if(!r.detail)return;let i=r.detail;(0,M.match)(i.shadowRoot||i,t).forEach(e)})}function xt(t,e){Ne.on("unmounted",r=>{if(!r.detail)return;let i=r.detail;(0,M.match)(i.shadowRoot||i,t).forEach(e)})}var Ne=new $e;M.default=(document.onreadystatechange=()=>{document.readyState!=="loading"&&Ne.emit("ready")},B("mount",t=>{let e=t.getAttribute("mount");if(typeof e=="function"){let r=new CustomEvent("mount",{detail:{node:t,target:t.element}});e(r)}}),xt("unmount",t=>{let e=t.getAttribute("unmount");if(typeof e=="function"){let r=new CustomEvent("unmount",{detail:{node:t,target:t.element}});e(r)}}),B("connect",t=>{let e=t.getAttribute("connect");if(typeof e=="function"){let r=new CustomEvent("connect",{detail:{node:t,target:t.element}});e(r)}}),B("disconnect",t=>{let e=t.getAttribute("disconnect");if(typeof e=="function"){let r=new CustomEvent("disconnect",{detail:{node:t,target:t.element}});e(r)}}),B("adopt",t=>{let e=t.getAttribute("adopt");if(typeof e=="function"){let r=new CustomEvent("adopt",{detail:{node:t,target:t.element}});e(r)}}),B("if",t=>{let e=t.getAttribute("if");(e===!1||e==="false"||typeof e=="function"&&!e())&&t.element.remove()}),M.events.forEach(t=>B(t,e=>{let r=e.getAttribute(t);typeof r=="function"&&(e.element.removeEventListener(t,r),e.element.addEventListener(t,r))})),Ne)});var lt=C(_e=>{"use strict";var rr=_e&&_e.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(_e,"__esModule",{value:!0});var at=rr(Re()),it=class{get attributes(){return Object.assign({},this._attributes)}get element(){return this._element}get events(){return this._events}constructor(e,r){this._events=new Set,this._element=e,this._attributes=r}addEvent(e){return this._events.add(e),this}getAttribute(e){return this._attributes[e]}hasAttribute(e){return e in this._attributes}hasEvent(e){return this._events.has(e)}removeAttribute(e,r=!1){let i=this.getAttribute(e);return typeof i>"u"?this:(delete this._attributes[e],this._element.removeAttribute(e),r||at.default.emit("attribute-remove",{element:this,key:e,previous:i}),this)}setAttribute(e,r,i=!1){if(typeof r>"u")return this.removeAttribute(e,i);let s=this.getAttribute(e);return s===r?this:(this._attributes[e]=r,typeof r=="string"&&this._element.setAttribute(e,r),i||(typeof s>"u"?at.default.emit("attribute-create",{element:this,key:e,value:r}):at.default.emit("attribute-update",{element:this,key:e,value:r,previous:s})),this)}setAttributes(e,r=!1){for(let[s,d]of Object.entries(e))this.setAttribute(s,d,r);let i=Object.keys(e);for(let s of Object.keys(this._attributes))i.includes(s)||this.removeAttribute(s,r);return this}};_e.default=it});var qe=C(ye=>{"use strict";var sr=ye&&ye.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ye,"__esModule",{value:!0});var nr=sr(lt()),wt=document.createElement("textarea"),ar=t=>(wt.innerHTML=t,wt.value),He=class{static get elements(){return this._elements}static createComponent(e,r,i,s=[]){let d=document.createElement("template");d.innerHTML=`<${e}>`;let b=d.content.querySelector(`${e}`);return Object.setPrototypeOf(b,r.prototype),b.constructor=r.constructor,b.constructor.component=r.component,b.register(i,s),b.element}static createElement(e,r,i=[]){let s=document.createElement(e);for(let[d,v]of Object.entries(r))typeof v=="string"?s.setAttribute(d,v):v===!0&&s.setAttribute(d,d);return i.filter(d=>typeof d<"u").forEach(d=>s.appendChild(d)),this.register(s,r)}static createText(e,r=!0){return document.createTextNode(ar(e))}static filter(e){let r=[];return this._elements.forEach((i,s)=>{e(i,s)&&r.push(i)}),r}static get(e){return this._elements.get(e)||null}static has(e){return this._elements.has(e)}static map(e){let r=[];return this._elements.forEach((i,s)=>{r.push(e(i,s))}),r}static register(e,r){if(this.has(e))return this.get(e);let i=new nr.default(e,r||{});return this._elements.set(e,i),i}};He._elements=new Map;ye.default=He});var ee=C(xe=>{"use strict";Object.defineProperty(xe,"__esModule",{value:!0});xe.TempleDataMap=void 0;var Ie=class{constructor(){window.__APP_DATA__||(window.__APP_DATA__={})}clear(){return window.__APP_DATA__={},this}delete(e){return this.has(e)?(delete window.__APP_DATA__[e],!0):!1}entries(){return Object.entries(window.__APP_DATA__)}has(e){return e in window.__APP_DATA__}get(e){return window.__APP_DATA__[e]}keys(){return Object.keys(window.__APP_DATA__)}set(e,r){return window.__APP_DATA__[e]=r,this}values(){return Object.values(window.__APP_DATA__)}};xe.TempleDataMap=Ie;var ir=new Ie;xe.default=ir});var Tt=C(we=>{"use strict";var Be=we&&we.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(we,"__esModule",{value:!0});var At=Be(ve()),G=Be(qe()),W=Be(Re()),ze=Be(ee()),ot=class t extends HTMLElement{static register(){customElements.define(this.component[0],this)}get attr(){return Object.fromEntries(Array.from(this.attributes).map(e=>[e.name,e.value]))}get element(){if(!G.default.has(this))throw At.default.for("Component not mapped.");return G.default.get(this)}get metadata(){let[e,r]=this.constructor.component;return{tagname:e,classname:r}}get originalChildren(){return this._children}get initiated(){return this._initiated}get props(){return this.getAttributes()}get virtual(){return this._virtual}set props(e){this.setAttributes(e)}constructor(){if(super(),this._initiated=!1,this._template=null,this._children=void 0,this._rendering=!1,this._observer=null,this._virtual=!1,!G.default.has(this))throw At.default.for("Component not mapped.")}adoptedCallback(){this.render(),W.default.emit("adopt",this)}connectedCallback(){this.wait(),W.default.emit("connect",this)}disconnectedCallback(){W.default.emit("disconnect",this)}getAttribute(e){return this.element.getAttribute(e)}getAttributes(){return Object.assign({},this.element.attributes)}getParentComponent(){let e=this.parentElement;for(;e;){if(e instanceof t)return e;e=e.parentElement}return null}hasAttribute(e){return this.element.hasAttribute(e)}register(e={},r=[]){G.default.has(this)?G.default.get(this).setAttributes(e):G.default.register(this,e);for(let[i,s]of Object.entries(e))typeof s=="string"?super.setAttribute(i,s):s===!0&&super.setAttribute(i,i);this._children=r,this._virtual=!0,this.connectedCallback()}removeAttribute(e){this.hasAttribute(e)&&this.element.removeAttribute(e),super.hasAttribute(e)&&super.removeAttribute(e)}render(){let e=this.getParentComponent();if(e&&!e.initiated)return;if(this._rendering)return;this._rendering=!0;let r=ze.default.get("current");ze.default.set("current",this);let i=this.styles();this._template?W.default.emit("unmounted",this):this._template=this.template();let s=this._template().filter(Boolean);if(i.length===0)this.textContent="",s.forEach(d=>this.appendChild(d));else{this.shadowRoot||this.attachShadow({mode:"open"});let d=this.shadowRoot;this.textContent="",d.textContent="";let v=document.createElement("style");v.innerText=i,d.appendChild(v),s.forEach(b=>{var _;return(_=this.shadowRoot)===null||_===void 0?void 0:_.appendChild(b)})}return r?ze.default.set("current",r):ze.default.delete("current"),this._initiated=!0,this._rendering=!1,W.default.emit("mounted",this),this.shadowRoot?this.shadowRoot.innerHTML:this.innerHTML}setAttribute(e,r){this.element.setAttribute(e,r),(typeof r=="string"||r===!0)&&super.setAttribute(e,r)}setAttributes(e){this.element.setAttributes(e)}wait(){if(document.readyState!=="loading")this._update();else{let e=()=>{this._update(),W.default.unbind("ready",e)};W.default.on("ready",e)}}_toNodeList(e){return e instanceof Node?[e]:Array.isArray(e)&&e.every(r=>r instanceof Node)?e:[G.default.createText(String(e))]}_update(){typeof this._children>"u"&&(this._children=Array.from(this.childNodes||[])),this._initiated||this.render()}};we.default=ot});var te=C(Ae=>{"use strict";var Et=Ae&&Ae.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Ae,"__esModule",{value:!0});Ae.default=cr;var lr=Et(ve()),or=Et(ee());function cr(t=null,e=!1){if(!t&&(t=or.default.get("current"),!t)){if(!e)throw lr.default.for("Not called within a Temple component");return null}return t}});var kt=C(Te=>{"use strict";var ur=Te&&Te.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Te,"__esModule",{value:!0});var dr=ur(ee());function fr(t){let e=dr.default.get("env")||{};return t?e[t]||null:e}Te.default=fr});var ct=C(Ee=>{"use strict";var Ft=Ee&&Ee.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Ee,"__esModule",{value:!0});Ee.default=hr;var pr=Ft(te()),mr=Ft(ee());function hr(t=null){let e=(0,pr.default)(t,!0);return typeof e=="string"?mr.default.get("props")||{}:e?e.props:{}}});var Pt=C(re=>{"use strict";var Lt=re&&re.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(re,"__esModule",{value:!0});re.classlist=vr;re.default=_r;var gr=Lt(te()),br=Lt(ct());function vr(t=null){var e;if(t==="body")return document.body.classList;if(t==="head")return document.head.classList;if(t==="document")return(e=document.body.parentElement)===null||e===void 0?void 0:e.classList;let r=(0,gr.default)(t);return r?.classList}function _r(t=null){return(0,br.default)(t).class}});var jt=C(U=>{"use strict";var yr=U&&U.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(U,"__esModule",{value:!0});U.innerHTML=wr;U.innerText=Ar;U.default=ut;var xr=yr(te());function wr(t=null){let e=ut(t),r=document.createElement("template");return r.append(...e.map(i=>i.cloneNode(!0))),r.innerHTML}function Ar(t=null){let e=ut(t),r=document.createElement("template");return r.append(...e.map(i=>i.cloneNode(!0))),r.innerText}function ut(t=null){let e=(0,xr.default)(t,!0);return typeof e!="string"&&e?e.originalChildren||[]:[]}});var Ct=C(Z=>{"use strict";var St=Z&&Z.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Z,"__esModule",{value:!0});Z.SignalRegistry=void 0;Z.default=kr;var Tr=St(te()),Er=St(ve()),se=class t{static observe(e,r){let i={getter:()=>d.raw,setter:b=>b},s=new Set,d={raw:r,change(b){s.add(b)},getter(b){return i.getter=b,d},setter(b){return i.setter=b,d}};Object.defineProperty(d,"value",{get(){return i.getter()},set(b){let _=i.setter(b),x=t.serialize(_)!==t.serialize(d.raw);d.raw=_,x&&(s.forEach(h=>h(_)),e.render())}});let v=this._observers.get(e);return v?(v.observed++,v.values.push(d)):this._observers.set(e,{observed:1,values:[d]}),d}static observer(e){return this._observers.get(e)||null}static serialize(e){return JSON.stringify(e)}};Z.SignalRegistry=se;se._observers=new Map;function kr(t,e=null){let r=(0,Tr.default)(e);if(!r.initiated)return se.observe(r,t);let i=se.observer(r);if(!i)throw Er.default.for("Signal state mismatch");return i.values[i.observed++%i.values.length]}});var ft=C(m=>{"use strict";var Fr=m&&m.__createBinding||(Object.create?function(t,e,r,i){i===void 0&&(i=r);var s=Object.getOwnPropertyDescriptor(e,r);(!s||("get"in s?!e.__esModule:s.writable||s.configurable))&&(s={enumerable:!0,get:function(){return e[r]}}),Object.defineProperty(t,i,s)}:function(t,e,r,i){i===void 0&&(i=r),t[i]=e[r]}),Lr=m&&m.__setModuleDefault||(Object.create?function(t,e){Object.defineProperty(t,"default",{enumerable:!0,value:e})}:function(t,e){t.default=e}),ke=m&&m.__importStar||function(t){if(t&&t.__esModule)return t;var e={};if(t!=null)for(var r in t)r!=="default"&&Object.prototype.hasOwnProperty.call(t,r)&&Fr(e,t,r);return Lr(e,t),e},J=m&&m.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(m,"__esModule",{value:!0});m.SignalRegistry=m.TempleException=m.TempleEmitter=m.TempleElement=m.TempleRegistry=m.TempleComponent=m.TempleDataMap=m.emitter=m.signal=m.innerHTML=m.innerText=m.children=m.classnames=m.classlist=m.props=m.env=m.data=m.component=void 0;var Pr=J(ve());m.TempleException=Pr.default;var jr=J(Tt());m.TempleComponent=jr.default;var Sr=J(qe());m.TempleRegistry=Sr.default;var Cr=J(lt());m.TempleElement=Cr.default;var Mt=ke(Re());m.emitter=Mt.default;Object.defineProperty(m,"TempleEmitter",{enumerable:!0,get:function(){return Mt.TempleEmitter}});var Mr=J(te());m.component=Mr.default;var Dt=ke(ee());m.data=Dt.default;Object.defineProperty(m,"TempleDataMap",{enumerable:!0,get:function(){return Dt.TempleDataMap}});var Dr=J(kt());m.env=Dr.default;var Or=J(ct());m.props=Or.default;var Ot=ke(Pt());m.classnames=Ot.default;Object.defineProperty(m,"classlist",{enumerable:!0,get:function(){return Ot.classlist}});var dt=ke(jt());m.children=dt.default;Object.defineProperty(m,"innerHTML",{enumerable:!0,get:function(){return dt.innerHTML}});Object.defineProperty(m,"innerText",{enumerable:!0,get:function(){return dt.innerText}});var $t=ke(Ct());m.signal=$t.default;Object.defineProperty(m,"SignalRegistry",{enumerable:!0,get:function(){return $t.SignalRegistry}})});var D=C((ts,Nt)=>{Nt.exports={...ft()}});var $=C((rs,Rt)=>{Rt.exports={...ft()}});var Ht=C((ps,Ke)=>{var $r=typeof window<"u"?window:typeof WorkerGlobalScope<"u"&&self instanceof WorkerGlobalScope?self:{};var u=function(t){var e=/(?:^|\s)lang(?:uage)?-([\w-]+)(?=\s|$)/i,r=0,i={},s={manual:t.Prism&&t.Prism.manual,disableWorkerMessageHandler:t.Prism&&t.Prism.disableWorkerMessageHandler,util:{encode:function n(a){return a instanceof d?new d(a.type,n(a.content),a.alias):Array.isArray(a)?a.map(n):a.replace(/&/g,"&").replace(/"u")return null;if("currentScript"in document)return document.currentScript;try{throw new Error}catch(o){var n=(/at [^(\r\n]*\((.*):[^:]+:[^:]+\)$/i.exec(o.stack)||[])[1];if(n){var a=document.getElementsByTagName("script");for(var l in a)if(a[l].src==n)return a[l]}return null}},isActive:function(n,a,l){for(var o="no-"+a;n;){var c=n.classList;if(c.contains(a))return!0;if(c.contains(o))return!1;n=n.parentElement}return!!l}},languages:{plain:i,plaintext:i,text:i,txt:i,extend:function(n,a){var l=s.util.clone(s.languages[n]);for(var o in a)l[o]=a[o];return l},insertBefore:function(n,a,l,o){o=o||s.languages;var c=o[n],p={};for(var y in c)if(c.hasOwnProperty(y)){if(y==a)for(var f in l)l.hasOwnProperty(f)&&(p[f]=l[f]);l.hasOwnProperty(y)||(p[y]=c[y])}var F=o[n];return o[n]=p,s.languages.DFS(s.languages,function(j,I){I===F&&j!=n&&(this[j]=p)}),p},DFS:function n(a,l,o,c){c=c||{};var p=s.util.objId;for(var y in a)if(a.hasOwnProperty(y)){l.call(a,y,a[y],o||y);var f=a[y],F=s.util.type(f);F==="Object"&&!c[p(f)]?(c[p(f)]=!0,n(f,l,null,c)):F==="Array"&&!c[p(f)]&&(c[p(f)]=!0,n(f,l,y,c))}}},plugins:{},highlightAll:function(n,a){s.highlightAllUnder(document,n,a)},highlightAllUnder:function(n,a,l){var o={callback:l,container:n,selector:'code[class*="language-"], [class*="language-"] code, code[class*="lang-"], [class*="lang-"] code'};s.hooks.run("before-highlightall",o),o.elements=Array.prototype.slice.apply(o.container.querySelectorAll(o.selector)),s.hooks.run("before-all-elements-highlight",o);for(var c=0,p;p=o.elements[c++];)s.highlightElement(p,a===!0,o.callback)},highlightElement:function(n,a,l){var o=s.util.getLanguage(n),c=s.languages[o];s.util.setLanguage(n,o);var p=n.parentElement;p&&p.nodeName.toLowerCase()==="pre"&&s.util.setLanguage(p,o);var y=n.textContent,f={element:n,language:o,grammar:c,code:y};function F(I){f.highlightedCode=I,s.hooks.run("before-insert",f),f.element.innerHTML=f.highlightedCode,s.hooks.run("after-highlight",f),s.hooks.run("complete",f),l&&l.call(f.element)}if(s.hooks.run("before-sanity-check",f),p=f.element.parentElement,p&&p.nodeName.toLowerCase()==="pre"&&!p.hasAttribute("tabindex")&&p.setAttribute("tabindex","0"),!f.code){s.hooks.run("complete",f),l&&l.call(f.element);return}if(s.hooks.run("before-highlight",f),!f.grammar){F(s.util.encode(f.code));return}if(a&&t.Worker){var j=new Worker(s.filename);j.onmessage=function(I){F(I.data)},j.postMessage(JSON.stringify({language:f.language,code:f.code,immediateClose:!0}))}else F(s.highlight(f.code,f.grammar,f.language))},highlight:function(n,a,l){var o={code:n,grammar:a,language:l};if(s.hooks.run("before-tokenize",o),!o.grammar)throw new Error('The language "'+o.language+'" has no grammar.');return o.tokens=s.tokenize(o.code,o.grammar),s.hooks.run("after-tokenize",o),d.stringify(s.util.encode(o.tokens),o.language)},tokenize:function(n,a){var l=a.rest;if(l){for(var o in l)a[o]=l[o];delete a.rest}var c=new _;return x(c,c.head,n),b(n,c,a,c.head,0),E(c)},hooks:{all:{},add:function(n,a){var l=s.hooks.all;l[n]=l[n]||[],l[n].push(a)},run:function(n,a){var l=s.hooks.all[n];if(!(!l||!l.length))for(var o=0,c;c=l[o++];)c(a)}},Token:d};t.Prism=s;function d(n,a,l,o){this.type=n,this.content=a,this.alias=l,this.length=(o||"").length|0}d.stringify=function n(a,l){if(typeof a=="string")return a;if(Array.isArray(a)){var o="";return a.forEach(function(F){o+=n(F,l)}),o}var c={type:a.type,content:n(a.content,l),tag:"span",classes:["token",a.type],attributes:{},language:l},p=a.alias;p&&(Array.isArray(p)?Array.prototype.push.apply(c.classes,p):c.classes.push(p)),s.hooks.run("wrap",c);var y="";for(var f in c.attributes)y+=" "+f+'="'+(c.attributes[f]||"").replace(/"/g,""")+'"';return"<"+c.tag+' class="'+c.classes.join(" ")+'"'+y+">"+c.content+""};function v(n,a,l,o){n.lastIndex=a;var c=n.exec(l);if(c&&o&&c[1]){var p=c[1].length;c.index+=p,c[0]=c[0].slice(p)}return c}function b(n,a,l,o,c,p){for(var y in l)if(!(!l.hasOwnProperty(y)||!l[y])){var f=l[y];f=Array.isArray(f)?f:[f];for(var F=0;F=p.reach);H+=S.value.length,S=S.next){var Q=S.value;if(a.length>n.length)return;if(!(Q instanceof d)){var Se=1,q;if(gt){if(q=v(bt,H,n,ht),!q||q.index>=n.length)break;var Ce=q.index,Wt=q.index+q[0].length,z=H;for(z+=S.value.length;Ce>=z;)S=S.next,z+=S.value.length;if(z-=S.value.length,H=z,S.value instanceof d)continue;for(var be=S;be!==a.tail&&(zp.reach&&(p.reach=tt);var De=S.prev;et&&(De=x(a,De,et),H+=et.length),h(a,De,Se);var Ut=new d(y,I?s.tokenize(Me,I):Me,Bt,Me);if(S=x(a,De,Ut),vt&&x(a,S,vt),Se>1){var rt={cause:y+","+F,reach:tt};b(n,a,l,S.prev,H,rt),p&&rt.reach>p.reach&&(p.reach=rt.reach)}}}}}}function _(){var n={value:null,prev:null,next:null},a={value:null,prev:n,next:null};n.next=a,this.head=n,this.tail=a,this.length=0}function x(n,a,l){var o=a.next,c={value:l,prev:a,next:o};return a.next=c,o.prev=c,n.length++,c}function h(n,a,l){for(var o=a.next,c=0;c/,greedy:!0},prolog:{pattern:/<\?[\s\S]+?\?>/,greedy:!0},doctype:{pattern:/"'[\]]|"[^"]*"|'[^']*')+(?:\[(?:[^<"'\]]|"[^"]*"|'[^']*'|<(?!!--)|)*\]\s*)?>/i,greedy:!0,inside:{"internal-subset":{pattern:/(^[^\[]*\[)[\s\S]+(?=\]>$)/,lookbehind:!0,greedy:!0,inside:null},string:{pattern:/"[^"]*"|'[^']*'/,greedy:!0},punctuation:/^$|[[\]]/,"doctype-tag":/^DOCTYPE/i,name:/[^\s<>'"]+/}},cdata:{pattern://i,greedy:!0},tag:{pattern:/<\/?(?!\d)[^\s>\/=$<%]+(?:\s(?:\s*[^\s>\/=]+(?:\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))|(?=[\s/>])))+)?\s*\/?>/,greedy:!0,inside:{tag:{pattern:/^<\/?[^\s>\/]+/,inside:{punctuation:/^<\/?/,namespace:/^[^\s>\/:]+:/}},"special-attr":[],"attr-value":{pattern:/=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+)/,inside:{punctuation:[{pattern:/^=/,alias:"attr-equals"},{pattern:/^(\s*)["']|["']$/,lookbehind:!0}]}},punctuation:/\/?>/,"attr-name":{pattern:/[^\s>\/]+/,inside:{namespace:/^[^\s>\/:]+:/}}}},entity:[{pattern:/&[\da-z]{1,8};/i,alias:"named-entity"},/&#x?[\da-f]{1,8};/i]};u.languages.markup.tag.inside["attr-value"].inside.entity=u.languages.markup.entity;u.languages.markup.doctype.inside["internal-subset"].inside=u.languages.markup;u.hooks.add("wrap",function(t){t.type==="entity"&&(t.attributes.title=t.content.replace(/&/,"&"))});Object.defineProperty(u.languages.markup.tag,"addInlined",{value:function(e,r){var i={};i["language-"+r]={pattern:/(^$)/i,lookbehind:!0,inside:u.languages[r]},i.cdata=/^$/i;var s={"included-cdata":{pattern://i,inside:i}};s["language-"+r]={pattern:/[\s\S]+/,inside:u.languages[r]};var d={};d[e]={pattern:RegExp(/(<__[^>]*>)(?:))*\]\]>|(?!)/.source.replace(/__/g,function(){return e}),"i"),lookbehind:!0,greedy:!0,inside:s},u.languages.insertBefore("markup","cdata",d)}});Object.defineProperty(u.languages.markup.tag,"addAttribute",{value:function(t,e){u.languages.markup.tag.inside["special-attr"].push({pattern:RegExp(/(^|["'\s])/.source+"(?:"+t+")"+/\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))/.source,"i"),lookbehind:!0,inside:{"attr-name":/^[^\s=]+/,"attr-value":{pattern:/=[\s\S]+/,inside:{value:{pattern:/(^=\s*(["']|(?!["'])))\S[\s\S]*(?=\2$)/,lookbehind:!0,alias:[e,"language-"+e],inside:u.languages[e]},punctuation:[{pattern:/^=/,alias:"attr-equals"},/"|'/]}}}})}});u.languages.html=u.languages.markup;u.languages.mathml=u.languages.markup;u.languages.svg=u.languages.markup;u.languages.xml=u.languages.extend("markup",{});u.languages.ssml=u.languages.xml;u.languages.atom=u.languages.xml;u.languages.rss=u.languages.xml;(function(t){var e=/(?:"(?:\\(?:\r\n|[\s\S])|[^"\\\r\n])*"|'(?:\\(?:\r\n|[\s\S])|[^'\\\r\n])*')/;t.languages.css={comment:/\/\*[\s\S]*?\*\//,atrule:{pattern:RegExp("@[\\w-](?:"+/[^;{\s"']|\s+(?!\s)/.source+"|"+e.source+")*?"+/(?:;|(?=\s*\{))/.source),inside:{rule:/^@[\w-]+/,"selector-function-argument":{pattern:/(\bselector\s*\(\s*(?![\s)]))(?:[^()\s]|\s+(?![\s)])|\((?:[^()]|\([^()]*\))*\))+(?=\s*\))/,lookbehind:!0,alias:"selector"},keyword:{pattern:/(^|[^\w-])(?:and|not|only|or)(?![\w-])/,lookbehind:!0}}},url:{pattern:RegExp("\\burl\\((?:"+e.source+"|"+/(?:[^\\\r\n()"']|\\[\s\S])*/.source+")\\)","i"),greedy:!0,inside:{function:/^url/i,punctuation:/^\(|\)$/,string:{pattern:RegExp("^"+e.source+"$"),alias:"url"}}},selector:{pattern:RegExp(`(^|[{}\\s])[^{}\\s](?:[^{};"'\\s]|\\s+(?![\\s{])|`+e.source+")*(?=\\s*\\{)"),lookbehind:!0},string:{pattern:e,greedy:!0},property:{pattern:/(^|[^-\w\xA0-\uFFFF])(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*(?=\s*:)/i,lookbehind:!0},important:/!important\b/i,function:{pattern:/(^|[^-a-z0-9])[-a-z0-9]+(?=\()/i,lookbehind:!0},punctuation:/[(){};:,]/},t.languages.css.atrule.inside.rest=t.languages.css;var r=t.languages.markup;r&&(r.tag.addInlined("style","css"),r.tag.addAttribute("style","css"))})(u);u.languages.clike={comment:[{pattern:/(^|[^\\])\/\*[\s\S]*?(?:\*\/|$)/,lookbehind:!0,greedy:!0},{pattern:/(^|[^\\:])\/\/.*/,lookbehind:!0,greedy:!0}],string:{pattern:/(["'])(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/,greedy:!0},"class-name":{pattern:/(\b(?:class|extends|implements|instanceof|interface|new|trait)\s+|\bcatch\s+\()[\w.\\]+/i,lookbehind:!0,inside:{punctuation:/[.\\]/}},keyword:/\b(?:break|catch|continue|do|else|finally|for|function|if|in|instanceof|new|null|return|throw|try|while)\b/,boolean:/\b(?:false|true)\b/,function:/\b\w+(?=\()/,number:/\b0x[\da-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:e[+-]?\d+)?/i,operator:/[<>]=?|[!=]=?=?|--?|\+\+?|&&?|\|\|?|[?*/~^%]/,punctuation:/[{}[\];(),.:]/};u.languages.javascript=u.languages.extend("clike",{"class-name":[u.languages.clike["class-name"],{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$A-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\.(?:constructor|prototype))/,lookbehind:!0}],keyword:[{pattern:/((?:^|\})\s*)catch\b/,lookbehind:!0},{pattern:/(^|[^.]|\.\.\.\s*)\b(?:as|assert(?=\s*\{)|async(?=\s*(?:function\b|\(|[$\w\xA0-\uFFFF]|$))|await|break|case|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally(?=\s*(?:\{|$))|for|from(?=\s*(?:['"]|$))|function|(?:get|set)(?=\s*(?:[#\[$\w\xA0-\uFFFF]|$))|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)\b/,lookbehind:!0}],function:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*(?:\.\s*(?:apply|bind|call)\s*)?\()/,number:{pattern:RegExp(/(^|[^\w$])/.source+"(?:"+(/NaN|Infinity/.source+"|"+/0[bB][01]+(?:_[01]+)*n?/.source+"|"+/0[oO][0-7]+(?:_[0-7]+)*n?/.source+"|"+/0[xX][\dA-Fa-f]+(?:_[\dA-Fa-f]+)*n?/.source+"|"+/\d+(?:_\d+)*n/.source+"|"+/(?:\d+(?:_\d+)*(?:\.(?:\d+(?:_\d+)*)?)?|\.\d+(?:_\d+)*)(?:[Ee][+-]?\d+(?:_\d+)*)?/.source)+")"+/(?![\w$])/.source),lookbehind:!0},operator:/--|\+\+|\*\*=?|=>|&&=?|\|\|=?|[!=]==|<<=?|>>>?=?|[-+*/%&|^!=<>]=?|\.{3}|\?\?=?|\?\.?|[~:]/});u.languages.javascript["class-name"][0].pattern=/(\b(?:class|extends|implements|instanceof|interface|new)\s+)[\w.\\]+/;u.languages.insertBefore("javascript","keyword",{regex:{pattern:RegExp(/((?:^|[^$\w\xA0-\uFFFF."'\])\s]|\b(?:return|yield))\s*)/.source+/\//.source+"(?:"+/(?:\[(?:[^\]\\\r\n]|\\.)*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}/.source+"|"+/(?:\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.)*\])*\])*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}v[dgimyus]{0,7}/.source+")"+/(?=(?:\s|\/\*(?:[^*]|\*(?!\/))*\*\/)*(?:$|[\r\n,.;:})\]]|\/\/))/.source),lookbehind:!0,greedy:!0,inside:{"regex-source":{pattern:/^(\/)[\s\S]+(?=\/[a-z]*$)/,lookbehind:!0,alias:"language-regex",inside:u.languages.regex},"regex-delimiter":/^\/|\/$/,"regex-flags":/^[a-z]+$/}},"function-variable":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*[=:]\s*(?:async\s*)?(?:\bfunction\b|(?:\((?:[^()]|\([^()]*\))*\)|(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)\s*=>))/,alias:"function"},parameter:[{pattern:/(function(?:\s+(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)?\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\))/,lookbehind:!0,inside:u.languages.javascript},{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$a-z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*=>)/i,lookbehind:!0,inside:u.languages.javascript},{pattern:/(\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*=>)/,lookbehind:!0,inside:u.languages.javascript},{pattern:/((?:\b|\s|^)(?!(?:as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)(?![$\w\xA0-\uFFFF]))(?:(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*)\(\s*|\]\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*\{)/,lookbehind:!0,inside:u.languages.javascript}],constant:/\b[A-Z](?:[A-Z_]|\dx?)*\b/});u.languages.insertBefore("javascript","string",{hashbang:{pattern:/^#!.*/,greedy:!0,alias:"comment"},"template-string":{pattern:/`(?:\\[\s\S]|\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}|(?!\$\{)[^\\`])*`/,greedy:!0,inside:{"template-punctuation":{pattern:/^`|`$/,alias:"string"},interpolation:{pattern:/((?:^|[^\\])(?:\\{2})*)\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}/,lookbehind:!0,inside:{"interpolation-punctuation":{pattern:/^\$\{|\}$/,alias:"punctuation"},rest:u.languages.javascript}},string:/[\s\S]+/}},"string-property":{pattern:/((?:^|[,{])[ \t]*)(["'])(?:\\(?:\r\n|[\s\S])|(?!\2)[^\\\r\n])*\2(?=\s*:)/m,lookbehind:!0,greedy:!0,alias:"property"}});u.languages.insertBefore("javascript","operator",{"literal-property":{pattern:/((?:^|[,{])[ \t]*)(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*:)/m,lookbehind:!0,alias:"property"}});u.languages.markup&&(u.languages.markup.tag.addInlined("script","javascript"),u.languages.markup.tag.addAttribute(/on(?:abort|blur|change|click|composition(?:end|start|update)|dblclick|error|focus(?:in|out)?|key(?:down|up)|load|mouse(?:down|enter|leave|move|out|over|up)|reset|resize|scroll|select|slotchange|submit|unload|wheel)/.source,"javascript"));u.languages.js=u.languages.javascript;(function(){if(typeof u>"u"||typeof document>"u")return;Element.prototype.matches||(Element.prototype.matches=Element.prototype.msMatchesSelector||Element.prototype.webkitMatchesSelector);var t="Loading\u2026",e=function(k,g){return"\u2716 Error "+k+" while fetching file: "+g},r="\u2716 Error: File does not exist or is empty",i={js:"javascript",py:"python",rb:"ruby",ps1:"powershell",psm1:"powershell",sh:"bash",bat:"batch",h:"c",tex:"latex"},s="data-src-status",d="loading",v="loaded",b="failed",_="pre[data-src]:not(["+s+'="'+v+'"]):not(['+s+'="'+d+'"])';function x(k,g,A){var n=new XMLHttpRequest;n.open("GET",k,!0),n.onreadystatechange=function(){n.readyState==4&&(n.status<400&&n.responseText?g(n.responseText):n.status>=400?A(e(n.status,n.statusText)):A(r))},n.send(null)}function h(k){var g=/^\s*(\d+)\s*(?:(,)\s*(?:(\d+)\s*)?)?$/.exec(k||"");if(g){var A=Number(g[1]),n=g[2],a=g[3];return n?a?[A,Number(a)]:[A,void 0]:[A,A]}}u.hooks.add("before-highlightall",function(k){k.selector+=", "+_}),u.hooks.add("before-sanity-check",function(k){var g=k.element;if(g.matches(_)){k.code="",g.setAttribute(s,d);var A=g.appendChild(document.createElement("CODE"));A.textContent=t;var n=g.getAttribute("data-src"),a=k.language;if(a==="none"){var l=(/\.(\w+)$/.exec(n)||[,"none"])[1];a=i[l]||l}u.util.setLanguage(A,a),u.util.setLanguage(g,a);var o=u.plugins.autoloader;o&&o.loadLanguages(a),x(n,function(c){g.setAttribute(s,v);var p=h(g.getAttribute("data-range"));if(p){var y=c.split(/\r\n?|\n/g),f=p[0],F=p[1]==null?y.length:p[1];f<0&&(f+=y.length),f=Math.max(0,Math.min(f-1,y.length)),F<0&&(F+=y.length),F=Math.max(0,Math.min(F,y.length)),c=y.slice(f,F).join(`
+`),g.hasAttribute("data-start")||g.setAttribute("data-start",String(f+1))}A.textContent=c,u.highlightElement(A)},function(c){g.setAttribute(s,b),A.textContent=c})}}),u.plugins.fileHighlight={highlight:function(g){for(var A=(g||document).querySelectorAll(_),n=0,a;a=A[n++];)u.highlightElement(a)}};var E=!1;u.fileHighlight=function(){E||(console.warn("Prism.fileHighlight is deprecated. Use `Prism.plugins.fileHighlight.highlight` instead."),E=!0),u.plugins.fileHighlight.highlight.apply(this,arguments)}})()});var Hr={};Kt(Hr,{BUILD_ID:()=>qr,TempleComponent:()=>P.TempleComponent,TempleElement:()=>P.TempleElement,TempleEmitter:()=>P.TempleEmitter,TempleException:()=>P.TempleException,TempleRegistry:()=>P.TempleRegistry,children:()=>P.children,components:()=>Rr,data:()=>P.data,emitter:()=>P.emitter,props:()=>P.props,signal:()=>P.signal});var N=T(D());var qt=T(D()),R=T($()),ne=class extends qt.TempleComponent{static component=["layout","Layout_9f3ab204ce271feaf6f7"];styles(){return""}template(){(0,R.classlist)().add("relative","w-full","vh","scroll-hidden");let e=(0,R.children)(),r=e.find(h=>h.nodeName.endsWith("PANEL-MAIN")),i=e.find(h=>h.nodeName.endsWith("PANEL-HEAD")),s=e.find(h=>h.nodeName.endsWith("PANEL-FOOT")),d=e.find(h=>h.nodeName.endsWith("PANEL-LEFT")),v=e.find(h=>h.nodeName.endsWith("PANEL-RIGHT")),b={head:!!i,foot:!!s,left:!!d,right:!!v},_=new Set,x={left:!1,right:!1,change:h=>_.add(h)};return r&&R.TempleRegistry.get(r).setAttribute("show",x).setAttribute("layout",b),i&&R.TempleRegistry.get(i).setAttribute("show",x).setAttribute("layout",b),s&&R.TempleRegistry.get(s).setAttribute("show",x).setAttribute("layout",b),d&&R.TempleRegistry.get(d).setAttribute("show",x).setAttribute("layout",b),v&&R.TempleRegistry.get(v).setAttribute("show",x).setAttribute("layout",b),this.toggle=h=>{x[h]=!x[h],_.forEach(E=>E())},()=>[R.TempleRegistry.createText(`
+`,!1),...this._toNodeList(e)]}};var Fe=T(D()),Ge=T($()),ae=class extends Fe.TempleComponent{static component=["head","Head_2bf4dff19bc88ba4138b"];styles(){return""}template(){let{layout:e,show:r}=this.element.attributes,i=(0,Ge.classlist)(),s=d=>{this.classList.add("absolute","top-0","right-0","h-60","transition-500"),e?.left?(this.classList.remove("left-0"),this.classList.add("left-226")):this.classList.add("left-0"),r.left?(this.classList.remove("md-left-0"),this.classList.add("md-left-226")):(this.classList.remove("md-left-226"),this.classList.add("md-left-0"))};return r.change(s),s(),()=>[Fe.TempleRegistry.createText(`
+`,!1),Fe.TempleRegistry.createElement("header",{class:"block w-full h-full relative"},[...this._toNodeList((0,Ge.children)())]).element]}};var Le=T(D()),We=T($()),ie=class extends Le.TempleComponent{static component=["left","Left_f4ab589e043eee17d229"];styles(){return""}template(){let{layout:e,show:r}=this.element.attributes,i=(0,We.classlist)(),s=d=>{this.classList.add("w-226","absolute","bottom-0","left-0","top-0","transition-500"),r.left?(this.classList.remove("md-left--226"),this.classList.add("md-left-0")):this.classList.add("md-left--226")};return r.change(s),s(),()=>[Le.TempleRegistry.createText(`
+`,!1),Le.TempleRegistry.createElement("aside",{class:"block w-full h-full relative"},[...this._toNodeList((0,We.children)())]).element]}};var Pe=T(D()),Ue=T($()),le=class extends Pe.TempleComponent{static component=["main","Main_847772763f4518728ede"];styles(){return""}template(){let{layout:e,show:r}=this.element.attributes,i=(0,Ue.classlist)(),s=d=>{this.classList.add("absolute","transition-500"),e?.head?(this.classList.remove("top-0"),this.classList.add("top-60")):this.classList.add("top-0"),e?.foot?(this.classList.remove("bottom-0"),this.classList.add("bottom-60")):this.classList.add("bottom-0"),e?.left?(this.classList.remove("left-0"),this.classList.add("left-226")):this.classList.add("left-0"),e?.right?(this.classList.remove("right-0"),this.classList.add("right-200")):this.classList.add("right-0"),r.left?(this.classList.remove("md-left-0"),this.classList.add("md-left-226")):(this.classList.remove("md-left-226"),this.classList.add("md-left-0")),r.right?(this.classList.remove("md-right-0"),this.classList.add("md-right-200")):(this.classList.remove("md-right-200"),this.classList.add("md-right-0"))};return r.change(s),s(),()=>[Pe.TempleRegistry.createText(`
+`,!1),Pe.TempleRegistry.createElement("main",{class:"block w-full h-full relative"},[...this._toNodeList((0,Ue.children)())]).element]}};var X=T(D()),ce=T($()),oe=class extends X.TempleComponent{static component=["tab","Tab_5a341768ef0a010965e3"];styles(){return""}template(){let{group:e,selector:r="",active:i="",inactive:s="",style:d,class:v,...b}=(0,ce.props)(),_=(0,ce.component)(),x=i.split(" "),h=s.split(" ");_.classList.add("cursor-pointer");let E=()=>{let g=_.hasAttribute("on");_.classList.remove(...g?h:x),_.classList.add(...g?x:h),Array.from(document.querySelectorAll(r)).forEach(A=>{A.style.display=g?"block":"none"})},k=()=>{Array.from(document.querySelectorAll(`[group="${e}"]`)).forEach(g=>{let A=g.getAttribute("selector");r===A&&!g.hasAttribute("on")?(g.setAttribute("on",""),Array.from(document.querySelectorAll(r)).forEach(n=>{n.style.display="block"}),typeof g.render=="function"&&g.render()):r!==A&&g.hasAttribute("on")&&(g.removeAttribute("on"),Array.from(document.querySelectorAll(A)).forEach(n=>{n.style.display="none"}),typeof g.render=="function"&&g.render())})};return()=>[X.TempleRegistry.createText(`
+`,!1),X.TempleRegistry.createElement("a",{...b,class:"block h-full w-full",click:k,mount:E},[X.TempleRegistry.createText(`
+  `,!1),...this._toNodeList((0,ce.children)()),X.TempleRegistry.createText(`
+`,!1)]).element]}};var je=T(D()),Ze=T($()),ue=class extends je.TempleComponent{static component=["docs","Docs_40562a7bb56d70d971df"];styles(){return""}template(){return(0,Ze.classlist)().add("block","w-full","h-full","scroll-y-auto","scroll-x-hidden"),()=>[je.TempleRegistry.createText(`
+`,!1),je.TempleRegistry.createElement("article",{class:"block p-10 tx-t-1"},[...this._toNodeList((0,Ze.children)())]).element]}};var Y=T(D()),Je=T($()),de=class extends Y.TempleComponent{static component=["head","Head_939ecb5f22962d8c2924"];styles(){return""}template(){return(0,Je.classlist)().add("absolute","top-0","right-0","left-170","h-45","bg-t-0","z-1"),()=>[Y.TempleRegistry.createText(`
+`,!1),Y.TempleRegistry.createElement("header",{class:"w-full h-full scroll-x-auto"},[Y.TempleRegistry.createText(`
+  `,!1),...this._toNodeList((0,Je.children)()),Y.TempleRegistry.createText(`
+`,!1)]).element]}};var V=T(D()),Xe=T($()),fe=class extends V.TempleComponent{static component=["left","Left_a7102198c3628da88b4f"];styles(){return""}template(){return(0,Xe.classlist)().add("absolute","top-0","bottom-0","left-0","w-170","bg-h-000000","bd-solid","bd-t-2","bdy-0","bdl-0","bdr-1","z-2"),()=>[V.TempleRegistry.createText(`
+`,!1),V.TempleRegistry.createElement("aside",{class:"w-full h-full scroll-auto"},[V.TempleRegistry.createText(`
+  `,!1),...this._toNodeList((0,Xe.children)()),V.TempleRegistry.createText(`
+`,!1)]).element]}};var K=T(D()),Ye=T($()),pe=class extends K.TempleComponent{static component=["main","Main_bbd0517424ebab9de270"];styles(){return""}template(){return(0,Ye.classlist)().add("absolute","top-45","right-0","left-170","bottom-0","bg-black","bd-solid","bd-t-2","bdx-0","bdb-0","bdt-1"),()=>[K.TempleRegistry.createText(`
+`,!1),K.TempleRegistry.createElement("main",{class:"w-full h-full scroll-auto"},[K.TempleRegistry.createText(`
+  `,!1),...this._toNodeList((0,Ye.children)()),K.TempleRegistry.createText(`
+`,!1)]).element]}};var L=T(D()),Ve=T($()),me=class extends L.TempleComponent{static component=["app","App_381239c61b65b86a1c20"];styles(){return""}template(){let{title:e,height:r}=(0,Ve.props)(),i=r?`height:${r}px`:"";return()=>[L.TempleRegistry.createText(`
+`,!1),L.TempleRegistry.createElement("div",{class:"bd-rad-curved scroll-hidden shadow-0-0-10-0-0-0-5"},[L.TempleRegistry.createText(`
+  `,!1),L.TempleRegistry.createElement("div",{class:"relative flex flex-center-y gap-10 p-10 bg-t-1 tx-c-999999 tx-16"},[L.TempleRegistry.createText(`
+    `,!1),L.TempleRegistry.createElement("span",{class:"bg-h-999999 pill h-10 w-10"},[]).element,L.TempleRegistry.createText(`
+    `,!1),L.TempleRegistry.createElement("span",{class:"bg-h-999999 pill h-10 w-10"},[]).element,L.TempleRegistry.createText(`
+    `,!1),L.TempleRegistry.createElement("span",{class:"bg-h-999999 pill h-10 w-10"},[]).element,L.TempleRegistry.createText(`
+    `,!1),L.TempleRegistry.createElement("span",{class:"flex flex-center h-full w-full absolute top-0 left-0"},[L.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(e),L.TempleRegistry.createText(`
+    `,!1)]).element,L.TempleRegistry.createText(`
+  `,!1)]).element,L.TempleRegistry.createText(`
+  `,!1),L.TempleRegistry.createElement("div",{class:"bg-black tx-t-1 relative",style:i},[...this._toNodeList((0,Ve.children)())]).element,L.TempleRegistry.createText(`
+`,!1)]).element]}};var w=T(D()),pt=T(Ht()),It=T($()),he=class extends w.TempleComponent{static component=["code","Code_5294df1c620ef5ddbd2f"];styles(){return`:host {
     display: block;
     font-size: 14px;
     line-height: 20px;
   }
   :host([inline]) {
-    display: inline;
+    display: inline !important;
   }
   :host([inline]),
   :host([inline]) > pre,
   :host([inline]) > pre > code {
-    display: inline;
+    display: inline !important;
   }
   .snippet {
     background-color: #000000;
     color: #ABB2BF;
+    height: 100%;
     margin: 0;
     padding: 0;
   }
@@ -73,42 +102,38 @@ var TempleAPI=(()=>{var xt=Object.create;var ge=Object.defineProperty;var Tt=Obj
 
   .terminal {
     background-color: #000000;
+    font-family: 'Courier New', Courier, monospace;
     font-size: 15px;
+    height: 100%;
     padding: 10px;
   }
   .terminal span {
     color: #00FF00;
-  }`}template(){let e=this.props,{lang:r="markup",numbers:i=!1,inline:n=!1,trim:p=!1,ltrim:m=!1,rtrim:g=!1,detab:_=0}=e,y=(0,_t.children)(),A=y[0]?.textContent||"";_&&(A=A.replace(new RegExp(`\\n {${_}}`,"g"),`
-`)),p?A=A.trim():m?A=A.replace(/^\s+/,""):g&&(A=A.replace(/\s+$/,""));let F=T=>{if(!A)return;let v=He.default.highlight(A,He.default.languages[r],r);if(T.detail.target.innerHTML=v,i){let E=v.match(/\n(?!$)/g),s=E?E.length+1:1,a=new Array(s+1).join(""),l=document.createElement("span");l.setAttribute("aria-hidden","true"),l.className="line-numbers-rows",l.innerHTML=a,T.detail.target.appendChild(l)}};return()=>[w.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism.min.css"}).element,w.TempleRegistry.createText(`
+  }`}template(){let e=this.props,{lang:r="markup",numbers:i=!1,inline:s=!1,trim:d=!1,ltrim:v=!1,rtrim:b=!1,detab:_=0}=e,x=(0,It.children)(),h=x[0]?.textContent||"";_&&(h=h.replace(new RegExp(`\\n {${_}}`,"g"),`
+`)),d?h=h.trim():v?h=h.replace(/^\s+/,""):b&&(h=h.replace(/\s+$/,""));let E=k=>{if(!h)return;let g=pt.default.highlight(h,pt.default.languages[r],r);if(k.detail.target.innerHTML=g,i){let A=g.match(/\n(?!$)/g),n=A?A.length+1:1,a=new Array(n+1).join(""),l=document.createElement("span");l.setAttribute("aria-hidden","true"),l.className="line-numbers-rows",l.innerHTML=a,k.detail.target.appendChild(l)}};return()=>[w.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism.min.css"}).element,w.TempleRegistry.createText(`
 `,!1),w.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism-tomorrow.min.css"}).element,w.TempleRegistry.createText(`
 `,!1),...r==="bash"?[w.TempleRegistry.createText(`
-  `,!1),w.TempleRegistry.createElement("div",{class:"terminal"},[w.TempleRegistry.createElement("span",{},[w.TempleRegistry.createText("$",!1)]).element,w.TempleRegistry.createText(" ",!1),...this._toNodeList(y)]).element,w.TempleRegistry.createText(`
-`,!1)]:A?[,w.TempleRegistry.createText(`
+  `,!1),w.TempleRegistry.createElement("div",{class:"terminal"},[w.TempleRegistry.createElement("span",{},[w.TempleRegistry.createText("$",!1)]).element,w.TempleRegistry.createText(" ",!1),...this._toNodeList(x)]).element,w.TempleRegistry.createText(`
+`,!1)]:h?[,w.TempleRegistry.createText(`
   `,!1),...i?[w.TempleRegistry.createText(`
-    `,!1),w.TempleRegistry.createElement("pre",{class:"snippet line-numbers"},[w.TempleRegistry.createElement("code",{mount:F},[]).element]).element,w.TempleRegistry.createText(`
+    `,!1),w.TempleRegistry.createElement("pre",{class:"snippet line-numbers"},[w.TempleRegistry.createElement("code",{mount:E},[]).element]).element,w.TempleRegistry.createText(`
   `,!1)]:[,w.TempleRegistry.createText(`
-    `,!1),w.TempleRegistry.createElement("pre",{class:"snippet pad"},[w.TempleRegistry.createElement("code",{mount:F},[]).element]).element,w.TempleRegistry.createText(`
+    `,!1),w.TempleRegistry.createElement("pre",{class:"snippet pad"},[w.TempleRegistry.createElement("code",{mount:E},[]).element]).element,w.TempleRegistry.createText(`
   `,!1)],w.TempleRegistry.createText(`
-`,!1)]:[]]}};var j=D(I()),Te=D(oe()),J=class extends j.TempleComponent{static component=["app","App_05341fddbfd1fe4f273b"];styles(){return""}template(){let{title:e,panel:r}=(0,Te.props)(),i=`body ${r?"panel":""}`,n=r?`height:${r}px`:"";return()=>[j.TempleRegistry.createText(`
-`,!1),j.TempleRegistry.createElement("div",{class:"window"},[j.TempleRegistry.createText(`
-  `,!1),j.TempleRegistry.createElement("div",{class:"head"},[j.TempleRegistry.createText(`
-    `,!1),j.TempleRegistry.createElement("span",{class:"dot"},[]).element,j.TempleRegistry.createText(`
-    `,!1),j.TempleRegistry.createElement("span",{class:"dot"},[]).element,j.TempleRegistry.createText(`
-    `,!1),j.TempleRegistry.createElement("span",{class:"dot"},[]).element,j.TempleRegistry.createText(`
-    `,!1),j.TempleRegistry.createElement("span",{class:"title"},[...this._toNodeList(e)]).element,j.TempleRegistry.createText(`
-  `,!1)]).element,j.TempleRegistry.createText(`
-  `,!1),j.TempleRegistry.createElement("div",{class:i,style:n},[...this._toNodeList((0,Te.children)())]).element,j.TempleRegistry.createText(`
-`,!1)]).element]}};var ue=D(I()),Ee=D(oe()),X=class extends ue.TempleComponent{static component=["tab","Tab_dd9d261e4f37efc3079c"];styles(){return""}template(){let{group:e,selector:r,class:i,...n}=(0,Ee.props)(),p=()=>{Array.from(document.querySelectorAll(r)).forEach(g=>{g.style.display=i.indexOf("active")>-1?"block":"none"})},m=()=>{Array.from(document.querySelectorAll(`[group="${e}"]`)).forEach(g=>{let _=g.props.selector;r===_?(g.classList.add("active"),Array.from(document.querySelectorAll(r)).forEach(y=>{y.style.display="block"})):(g.classList.remove("active"),Array.from(document.querySelectorAll(_)).forEach(y=>{y.style.display="none"}))})};return()=>[ue.TempleRegistry.createText(`
-`,!1),ue.TempleRegistry.createElement("a",{...n,click:m,mount:p},[...this._toNodeList((0,Ee.children)())]).element]}};var M=D(I());var Ne=function(t,...e){let r=Be(t);for(let i=0;i[M.TempleRegistry.createText(`
-    `,!1),...r?[M.TempleRegistry.createText(`
-      `,!1),M.TempleRegistry.createElement("p",{},[...this._toNodeList(A)]).element,M.TempleRegistry.createText(`
-    `,!1)]:i?[,M.TempleRegistry.createText(`
-      `,!1),M.TempleRegistry.createElement("li",{},[...this._toNodeList(A)]).element,M.TempleRegistry.createText(`
-    `,!1)]:n?[,M.TempleRegistry.createText(`
-      `,!1),M.TempleRegistry.createElement("div",{},[...this._toNodeList(A)]).element,M.TempleRegistry.createText(`
-    `,!1)]:[,M.TempleRegistry.createText(`
-      `,!1),...this._toNodeList(A),M.TempleRegistry.createText(`
-    `,!1)]]}};var k=D(I());C.emitter.once("ready",()=>{let t=document.querySelector("script[data-app]");if(!t)throw C.TempleException.for("APP_DATA not found");try{let m=atob(t.getAttribute("data-app"));window.__APP_DATA__=JSON.parse(m),Object.entries(window.__APP_DATA__).forEach(([g,_])=>{C.data.set(g,_)})}catch{throw C.TempleException.for("APP_DATA is not a valid JSON")}C.data.set("current","document");let e="/docs/single-page.html",r=Ne("Single Page App - Temple reactive web component template engine."),i=Ne("How to use Temple to develop single page apps."),n=m=>{document.body.classList.toggle("panel-left-open")};C.data.delete("current");let p={0:{class:"head panel-head"},1:{class:"menu fas fa-fw fa-bars",click:n},2:{href:"/temple"},3:{src:"/temple/temple-icon.png",alt:"Temple Logo"},5:{class:"tx-white",href:"/temple"},7:{class:"tx-white",href:"/temple/docs/index.html"},8:{class:"github",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},9:{class:"fab fa-github"},10:{class:"npm",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},11:{class:"fab fa-npm text-white"},12:{class:"discord",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},13:{class:"fab fa-discord text-white"},14:{class:"left panel-left"},16:{href:"/temple"},17:{src:"/temple/temple-icon.png",alt:"Temple Logo"},19:{class:"tx-white",href:"/temple"},20:{class:"toggle fas fa-fw fa-chevron-left",click:n},23:{href:"/temple/docs/index.html"},24:{href:"/temple/docs/getting-started.html"},26:{href:"/temple/docs/markup-syntax.html"},27:{href:"/temple/docs/state-management.html"},28:{href:"/temple/docs/component-strategy.html"},29:{href:"/temple/docs/compiler-api.html"},30:{href:"/temple/docs/client-api.html"},32:{href:"/temple/docs/template-engine.html"},33:{href:"/temple/docs/single-page.html"},34:{href:"/temple/docs/static-site.html"},35:{href:"/temple/docs/component-publisher.html"},36:{href:"/temple/docs/developer-tools.html"},37:{class:"panel-main"},38:{class:"docs container"},40:{p:!0,trim:!0},41:{p:!0,trim:!0},42:{lang:"bash"},43:{p:!0,trim:!0},44:{lang:"bash"},45:{p:!0,trim:!0},46:{lang:"bash"},47:{p:!0,trim:!0},48:{panel:400,title:"My Project"},49:{class:"panel-head"},50:{class:"tabs"},51:{class:"tab",group:"project",selector:"#client-ts"},52:{class:"tab",group:"project",selector:"#app-tml"},53:{class:"tab",group:"project",selector:"#index-html"},54:{class:"tab active",group:"project",selector:"#webpack-js"},55:{class:"tab",group:"project",selector:"#tsconfig-json"},56:{class:"tab",group:"project",selector:"#package-json"},57:{class:"panel-left"},58:{class:"folder"},59:{class:"fas fa-fw fa-chevron-down"},61:{class:"shift-1 block",group:"project",selector:"#app-tml"},62:{class:"fas fa-fw fa-file"},63:{class:"shift-1 block",group:"project",selector:"#client-ts"},64:{class:"fas fa-fw fa-file"},65:{class:"block",group:"project",selector:"#index-html"},66:{class:"fas fa-fw fa-file"},67:{class:"block",group:"project",selector:"#package-json"},68:{class:"fas fa-fw fa-file"},69:{class:"block",group:"project",selector:"#tsconfig-json"},70:{class:"fas fa-fw fa-file"},71:{class:"block active",group:"project",selector:"#webpack-js"},72:{class:"fas fa-fw fa-file"},73:{class:"panel-main"},75:{id:"client-ts",style:"display:none",lang:"js",numbers:!0,trim:!0,detab:16},76:{id:"app-tml",style:"display:none",numbers:!0,trim:!0,detab:16},77:{id:"index-html",style:"display:none",numbers:!0,trim:!0,detab:16},78:{id:"webpack-js",lang:"js",numbers:!0,trim:!0,detab:16},79:{id:"tsconfig-json",style:"display:none",lang:"js",numbers:!0,trim:!0,detab:16},80:{id:"package-json",style:"display:none",lang:"js",numbers:!0,trim:!0,detab:16},81:{p:!0,trim:!0},82:{title:"Terminal"},83:{lang:"bash"},84:{class:"pager"},85:{class:"prev",href:"/temple/docs/template-engine.html"},86:{class:"fas fa-fw fa-chevron-left"},87:{class:"next",href:"/temple/docs/static-site.html"},88:{class:"fas fa-fw fa-chevron-right"},89:{class:"foot"}};for(let m of document.body.querySelectorAll("*")){let g=Object.fromEntries(Array.from(m.attributes).map(y=>[y.nodeName,y.nodeValue.length>0?y.nodeValue:!0])),_=String(C.TempleRegistry.elements.size);p[_]&&(Object.assign(g,p[_]),m.TempleAttributes=p[_]),C.TempleRegistry.register(m,g)}customElements.define("panel-main",Z),customElements.define("ide-code",W),customElements.define("ide-app",J),customElements.define("tui-tab",X),customElements.define("i18n-translate",Y),C.emitter.emit("mounted",document.body)});var ar={PanelMain_fd7f1af6410c5b5c8e1f:Z,IdeCode_6f36bc13bb6a166c7abc:W,IdeApp_05341fddbfd1fe4f273b:J,TuiTab_dd9d261e4f37efc3079c:X,I18nTranslate_7d25e372f5ffb5e39dad:Y},sr="3550a936d66e61695120";return St(ir);})();
+`,!1)]:[,w.TempleRegistry.createText(`
+  `,!1),w.TempleRegistry.createElement("span",{},[w.TempleRegistry.createText("????",!1)]).element,w.TempleRegistry.createText(`
+`,!1)],w.TempleRegistry.createText(`
+
+`,!1)]}};var O=T(D());var zt=function(t){return t};var Qe=T($()),ge=class extends O.TempleComponent{static component=["translate","Translate_0014b007fc91289b2776"];styles(){return""}template(){let{trim:e=!1,p:r=!1,li:i=!1,div:s=!1}=(0,Qe.props)(),d=(0,Qe.children)(),v=[],b=[];for(let E of d)typeof E=="string"?v.push(E):E instanceof Node&&E.textContent?v.push(E.textContent):(v.push("%s"),b.push(E));let _=v.join("");e&&(_=_.replace(/\s+/," ").trim());let x=zt(_).split("%s"),h=[];for(let E=0;E[O.TempleRegistry.createText(`
+    `,!1),...r?[O.TempleRegistry.createText(`
+      `,!1),O.TempleRegistry.createElement("p",{},[...this._toNodeList(h)]).element,O.TempleRegistry.createText(`
+    `,!1)]:i?[,O.TempleRegistry.createText(`
+      `,!1),O.TempleRegistry.createElement("li",{},[...this._toNodeList(h)]).element,O.TempleRegistry.createText(`
+    `,!1)]:s?[,O.TempleRegistry.createText(`
+      `,!1),O.TempleRegistry.createElement("div",{},[...this._toNodeList(h)]).element,O.TempleRegistry.createText(`
+    `,!1)]:[,O.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(h),O.TempleRegistry.createText(`
+    `,!1)]]}};var mt=function(t,...e){let r=Nr(t);for(let i=0;i{let t=document.querySelector("script[data-app]");if(!t)throw N.TempleException.for("APP_DATA not found");try{let v=atob(t.getAttribute("data-app"));window.__APP_DATA__=JSON.parse(v),Object.entries(window.__APP_DATA__).forEach(([b,_])=>{N.data.set(b,_)})}catch{throw N.TempleException.for("APP_DATA is not a valid JSON")}N.data.set("current","document");let e="/docs/single-page.html",r=mt("Single Page App - Temple reactive web component template engine."),i=mt("How to use Temple to develop single page apps."),s=()=>{document.getElementsByTagName("panel-layout")[0].toggle("left")};N.data.delete("current");let d={2:{class:"flex flex-center-y px-20 py-15 m-0 bg-t-1"},3:{class:"fas fa-fw fa-bars cursor-pointer py-5 pr-10 none md-inline-block tx-t-1",click:s},4:{class:"flex-grow"},5:{class:"flex flex-center-y"},6:{class:"tx-white",href:"/temple/docs/index.html"},7:{class:"tx-t-1 tx-5xl ml-10",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},8:{class:"fab fa-github"},9:{class:"bg-h-cb3837 pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},10:{class:"fab fa-npm text-white"},11:{class:"bg-h-7289da pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},12:{class:"fab fa-discord text-white"},14:{class:"flex flex-center-y bg-t-2 py-15 pr-5 pl-10"},15:{href:"/temple"},16:{class:"h-26 mr-10",src:"/temple/temple-icon.png",alt:"Temple Logo"},17:{class:"flex-grow m-0 tx-uppercase"},18:{class:"tx-white",href:"/temple"},19:{class:"fas fa-fw fa-chevron-left cursor-pointer none md-inline-block",click:s},20:{class:"bg-t-1 scroll-auto h-calc-full-60"},21:{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-0 pt-20 pb-10 pl-10 tx-uppercase"},22:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/index.html"},23:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/getting-started.html"},24:{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},25:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/markup-syntax.html"},26:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/state-management.html"},27:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-strategy.html"},28:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/compiler-api.html"},29:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/client-api.html"},30:{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},31:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/template-engine.html"},32:{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/single-page.html"},33:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/static-site.html"},34:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-publisher.html"},35:{class:"block tx-t-1 py-10 pl-10 mb-100",href:"/temple/docs/developer-tools.html"},38:{class:"tx-primary tx-uppercase tx-30 py-20"},39:{p:!0,trim:!0,class:"tx-lh-36 py-20"},40:{p:!0,trim:!0,class:"tx-lh-36 py-20"},41:{lang:"bash"},42:{p:!0,trim:!0,class:"tx-lh-36 py-20"},43:{lang:"bash"},44:{p:!0,trim:!0,class:"tx-lh-36 py-20"},45:{lang:"bash"},46:{p:!0,trim:!0,class:"tx-lh-36 py-20"},47:{height:400,title:"My Project"},49:{class:"flex scroll-x-auto pt-5 pl-5"},50:{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"project",selector:"#client-ts"},51:{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"project",selector:"#app-tml"},52:{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"project",selector:"#index-html"},53:{on:!0,class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"project",selector:"#webpack-js"},54:{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"project",selector:"#tsconfig-json"},55:{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"project",selector:"#package-json"},57:{class:"folder"},58:{class:"fas fa-fw fa-chevron-down"},60:{class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"project",selector:"#app-tml"},61:{class:"fas fa-fw fa-file"},62:{class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"project",selector:"#client-ts"},63:{class:"fas fa-fw fa-file"},64:{class:"pt-10 block",active:"tx-white",inactive:"tx-muted",group:"project",selector:"#index-html"},65:{class:"fas fa-fw fa-file"},66:{class:"pt-10 block",active:"tx-white",inactive:"tx-muted",group:"project",selector:"#package-json"},67:{class:"fas fa-fw fa-file"},68:{class:"pt-10 block",active:"tx-white",inactive:"tx-muted",group:"project",selector:"#tsconfig-json"},69:{class:"fas fa-fw fa-file"},70:{on:!0,class:"pt-10 block",active:"tx-white",inactive:"tx-muted",group:"project",selector:"#webpack-js"},71:{class:"fas fa-fw fa-file"},73:{id:"client-ts",style:"display:none",lang:"js",numbers:!0,trim:!0,detab:16},74:{id:"app-tml",style:"display:none",numbers:!0,trim:!0,detab:16},75:{id:"index-html",style:"display:none",numbers:!0,trim:!0,detab:16},76:{id:"webpack-js",lang:"js",numbers:!0,trim:!0,detab:16},77:{id:"tsconfig-json",style:"display:none",lang:"js",numbers:!0,trim:!0,detab:16},78:{id:"package-json",style:"display:none",lang:"js",numbers:!0,trim:!0,detab:16},79:{p:!0,trim:!0,class:"tx-lh-36 py-20"},80:{title:"Terminal"},81:{lang:"bash"},82:{class:"flex"},83:{class:"tx-primary py-40",href:"/temple/docs/template-engine.html"},84:{class:"fas fa-fw fa-chevron-left tx-t-1"},85:{class:"flex-grow tx-right tx-primary py-40",href:"/temple/docs/static-site.html"},86:{class:"fas fa-fw fa-chevron-right tx-t-1"},87:{class:"foot"}};for(let v of document.body.querySelectorAll("*")){let b=Object.fromEntries(Array.from(v.attributes).map(x=>[x.nodeName,x.nodeValue.length>0?x.nodeValue:!0])),_=String(N.TempleRegistry.elements.size);d[_]&&(Object.assign(b,d[_]),v.TempleAttributes=d[_]),N.TempleRegistry.register(v,b)}customElements.define("panel-layout",ne),customElements.define("panel-head",ae),customElements.define("panel-left",ie),customElements.define("panel-main",le),customElements.define("tui-tab",oe),customElements.define("api-docs",ue),customElements.define("app-head",de),customElements.define("app-left",fe),customElements.define("app-main",pe),customElements.define("ide-app",me),customElements.define("ide-code",he),customElements.define("i18n-translate",ge),N.emitter.emit("mounted",document.body)});var Rr={PanelLayout_9f3ab204ce271feaf6f7:ne,PanelHead_2bf4dff19bc88ba4138b:ae,PanelLeft_f4ab589e043eee17d229:ie,PanelMain_847772763f4518728ede:le,TuiTab_5a341768ef0a010965e3:oe,ApiDocs_40562a7bb56d70d971df:ue,AppHead_939ecb5f22962d8c2924:de,AppLeft_a7102198c3628da88b4f:fe,AppMain_bbd0517424ebab9de270:pe,IdeApp_381239c61b65b86a1c20:me,IdeCode_5294df1c620ef5ddbd2f:he,I18nTranslate_0014b007fc91289b2776:ge},qr="3550a936d66e61695120";return Qt(Hr);})();
 /*! Bundled license information:
 
 prismjs/prism.js:
diff --git a/docs/build/client/38ccffadc3c6e8b93d28.css b/docs/build/client/38ccffadc3c6e8b93d28.css
index e69de29..3c18ce6 100644
--- a/docs/build/client/38ccffadc3c6e8b93d28.css
+++ b/docs/build/client/38ccffadc3c6e8b93d28.css
@@ -0,0 +1,191 @@
+html, body {
+  height: 100%;
+  margin: 0;
+  padding: 0;
+  width: 100%;
+}
+
+h1, h2, h3, h4, h5, h6, p {
+  margin: 0;
+  padding: 0;
+}
+
+a {
+  text-decoration: none;
+}
+  html-head:not(:defined) { opacity: 0; }
+html-header:not(:defined) { opacity: 0; }
+html-aside:not(:defined) { opacity: 0; }
+panel-layout:not(:defined) { opacity: 0; }
+panel-head:not(:defined) { opacity: 0; }
+panel-left:not(:defined) { opacity: 0; }
+panel-main:not(:defined) { opacity: 0; }
+api-docs:not(:defined) { opacity: 0; }
+api-ui:not(:defined) { opacity: 0; }
+ide-code:not(:defined) { opacity: 0; }
+i18n-translate:not(:defined) { opacity: 0; }
+  :root {
+  --black: #000000;
+  --white: #FFFFFF;
+  --info: #1474FC;
+  --error: #DC3545;
+  --warning: #FF7B07;
+  --success: #28A745;
+  --muted: #999999;
+}
+
+.light {
+  --bg-0: #EFEFEF;
+  --bg-1: #CFCFCF;
+  --bg-2: #AFAFAF;
+  --bg-3: #8F8F8F;
+  --bg-4: #6F6F6F;
+  --bd-0: #EFEFEF;
+  --bd-1: #CFCFCF;
+  --bd-2: #AFAFAF;
+  --bd-3: #8F8F8F;
+  --bd-4: #6F6F6F;
+  --bg-inverse: #242424;
+  --tx-0: #000000;
+  --tx-1: #242424;
+  --tx-inverse: #CFCFCF;
+}
+
+.dark {
+  --bg-0: #121212;
+  --bg-1: #222222;
+  --bg-2: #323232;
+  --bg-3: #424242;
+  --bg-4: #525252;
+  --bd-0: #121212;
+  --bd-1: #222222;
+  --bd-2: #323232;
+  --bd-3: #424242;
+  --bd-4: #525252;
+  --bg-inverse: #DBDBDB;
+  --tx-0: #FFFFFF;
+  --tx-1: #CFCFCF;
+  --tx-inverse: #222222;
+}
+  html-head { display: block; }
+html-header { display: block; }
+html-aside { display: block; }
+panel-layout { display: block; }
+panel-head { display: block; }
+panel-left { display: block; }
+panel-main { display: block; }
+api-docs { display: block; }
+api-ui { display: block; }
+api-ide-code { display: block; }
+ide-code { display: block; }
+i18n-translate { display: block; }
+  .arial { font-family: Arial, sans-serif; }
+.none { display: none; }
+.block { display: block; }
+.flex { display: flex; }
+.inline { display: inline; }
+.relative { position: relative; }
+.absolute { position: absolute; }
+.static { position: static; }
+.bottom-0 { bottom: 0px; }
+.bottom-60 { bottom: 60px; }
+.left-0 { left: 0px; }
+.left-226 { left: 226px; }
+.left-0 { left: 0px; }
+.left-226 { left: 226px; }
+.left--226 { left: -226px; }
+.right-0 { right: 0px; }
+.right-200 { right: 200px; }
+.right-0 { right: 0px; }
+.right-200 { right: 200px; }
+.top-0 { top: 0px; }
+.top-60 { top: 60px; }
+.flex-grow { flex-grow: 1; }
+.flex-center-y { align-items: center; }
+.scroll-auto { overflow: auto; }
+.scroll-hidden { overflow: hidden; }
+.scroll-x-hidden { overflow-x: hidden; }
+.scroll-y-auto { overflow-y: auto; }
+.h-full { height: 100%; }
+.h-26 { height: 26px; }
+.h-7289 { height: 7289px; }
+.h-905496362982981723 { height: 905496362982981723px; }
+.h-60 { height: 60px; }
+.h-24 { height: 24px; }
+.h-36 { height: 36px; }
+.h-calc-full-60 { height: calc(100% - 60px); }
+.vh { height: 100vh; }
+.w-full { width: 100%; }
+.w-226 { width: 226px; }
+.w-0 { width: 0px; }
+.bg-t-1 { background-color: var(--bg-1) !important; }
+.bg-t-2 { background-color: var(--bg-2) !important; }
+.bg-t-0 { background-color: var(--bg-0) !important; }
+.bg-h-cb3837 { background-color: #cb3837; }
+.bg-h-7289da { background-color: #7289da; }
+.tx-5 { font-size: 5px; }
+.tx-14 { font-size: 14px; }
+.tx-16 { font-size: 16px; }
+.tx-30 { font-size: 30px; }
+.tx-lg { font-size: 16px; }
+.tx-5xl { font-size: 26px; }
+.tx-center { text-align: center; }
+.tx-left { text-align: left; }
+.tx-right { text-align: right; }
+.tx-bold { font-weight: bold; }
+.tx-uppercase { text-transform: uppercase; }
+.tx-nowrap { white-space: nowrap; }
+.tx-top { vertical-align: top; }
+.tx-lh-24 { line-height: 24px; }
+.tx-lh-36 { line-height: 36px; }
+.tx-primary { color: var(--primary) !important; }
+.tx-secondary { color: var(--secondary) !important; }
+.tx-white { color: var(--white) !important; }
+.tx-muted { color: var(--muted) !important; }
+.tx-t-1 { color: var(--tx-1) !important; }
+.bd-solid { border-style: solid; }
+.bd-collapse { border-collapse: collapse; }
+.bd-t-2 { border-color: var(--bd-2) !important; }
+.bdb-0 { border-bottom-width: 0px; }
+.bdt-1 { border-top-width: 1px; }
+.bdx-0 { border-left-width: 0px; border-right-width: 0px; }
+.curved { border-radius: 4px; }
+.pill { border-radius: 10000px; }
+.m-0 { margin: 0px; }
+.m-0 { margin: 0px; }
+.m-60 { margin: 60px; }
+.mb-0 { margin-bottom: 0px; }
+.mb-100 { margin-bottom: 100px; }
+.mb-20 { margin-bottom: 20px; }
+.ml-10 { margin-left: 10px; }
+.ml-5 { margin-left: 5px; }
+.mr-10 { margin-right: 10px; }
+.mt-0 { margin-top: 0px; }
+.mt-20 { margin-top: 20px; }
+.my-40 { margin-top: 40px; margin-bottom: 40px; }
+.p-5 { padding: 5px; }
+.p-0 { padding: 0px; }
+.p-60 { padding: 60px; }
+.p-10 { padding: 10px; }
+.pb-10 { padding-bottom: 10px; }
+.pl-10 { padding-left: 10px; }
+.pr-10 { padding-right: 10px; }
+.pr-5 { padding-right: 5px; }
+.pt-20 { padding-top: 20px; }
+.px-20 { padding-left: 20px; padding-right: 20px; }
+.py-15 { padding-top: 15px; padding-bottom: 15px; }
+.py-5 { padding-top: 5px; padding-bottom: 5px; }
+.py-10 { padding-top: 10px; padding-bottom: 10px; }
+.py-20 { padding-top: 20px; padding-bottom: 20px; }
+.py-40 { padding-top: 40px; padding-bottom: 40px; }
+.cursor-pointer { cursor: pointer; }
+.transition-500 { transition: 500ms; }
+.shadow-0-0-10-0-0-0-5 { box-shadow: 0px 0px 10px rgb(0, 0, 0, 0.5); }
+@media (max-width: 767px) {
+  .md-inline-block { display: inline-block; }
+  .md-left-0 { left: 0px; }
+  .md-left-226 { left: 226px; }
+  .md-left--226 { left: -226px; }
+  .md-right-0 { right: 0px; }
+  .md-right-200 { right: 200px; }
+}
\ No newline at end of file
diff --git a/docs/build/client/38ccffadc3c6e8b93d28.html b/docs/build/client/38ccffadc3c6e8b93d28.html
index b9e13c9..95f7c96 100644
--- a/docs/build/client/38ccffadc3c6e8b93d28.html
+++ b/docs/build/client/38ccffadc3c6e8b93d28.html
@@ -18,100 +18,157 @@
   
   
   
-  
+  
   
   
   
   
 
-  
-    

-  
-  
-    Temple Logo
-  
-  
Temple

-  
+      
+        
+          

+            Compiler API
+          

+
+          
+            The developer interface for the Temple compiler is designed 
+            to be expressive and easily access the Temple library in most 
+            scenarios. To create a new temple compiler you can follow the 
+            code below.
+          
+          
+            import temple from '@ossph/temple';
+            const compiler = temple();
+           
+            
+            The temple() 
+            function itself takes in the following options, all of 
+            which are optional.
+          
 
-        
-          The developer interface for the Temple compiler is designed 
-          to be expressive and easily access the Temple library in most 
-          scenarios. To create a new temple compiler you can follow the 
-          code below.
-        
-        
-          import temple from '@ossph/temple';
-          const compiler = temple();
-         
-          
-          The temple() 
-          function itself takes in the following options, all of 
-          which are optional.
-        
+          
+          
+            Calling temple() as in 
+            compiler = temple({/*options*/}) 
+            returns the Temple compiler which contains the following object.
+          
+          
 
-        
-        
-          Calling temple() as in 
-          compiler = temple({/*options*/}) 
-          returns the Temple compiler which contains the following object.
-        
-        
-        
-        
-      
-      

-    
+          
+          

+        
+      
+    
   
 
\ No newline at end of file
diff --git a/docs/build/client/38ccffadc3c6e8b93d28.js b/docs/build/client/38ccffadc3c6e8b93d28.js
index bc8a5f1..2a88180 100644
--- a/docs/build/client/38ccffadc3c6e8b93d28.js
+++ b/docs/build/client/38ccffadc3c6e8b93d28.js
@@ -1,21 +1,28 @@
-var TempleAPI=(()=>{var vt=Object.create;var me=Object.defineProperty;var Tt=Object.getOwnPropertyDescriptor;var _t=Object.getOwnPropertyNames;var wt=Object.getPrototypeOf,At=Object.prototype.hasOwnProperty;var C=(t,e)=>()=>(e||t((e={exports:{}}).exports,e),e.exports),Et=(t,e)=>{for(var r in e)me(t,r,{get:e[r],enumerable:!0})},Ue=(t,e,r,l)=>{if(e&&typeof e=="object"||typeof e=="function")for(let n of _t(e))!At.call(t,n)&&n!==r&&me(t,n,{get:()=>e[n],enumerable:!(l=Tt(e,n))||l.enumerable});return t};var I=(t,e,r)=>(r=t!=null?vt(wt(t)):{},Ue(e||!t||!t.__esModule?me(r,"default",{value:t,enumerable:!0}):r,t)),Ft=t=>Ue(me({},"__esModule",{value:!0}),t);var De=C(Se=>{"use strict";Object.defineProperty(Se,"__esModule",{value:!0});var Re=class extends Error{static for(e,...r){return r.forEach(function(l){e=e.replace("%s",l)}),new this(e)}static forErrorsFound(e){let r=new this("Invalid Parameters");return r.errors=e,r}static require(e,r,...l){if(!e){for(let n of l)r=r.replace("%s",n);throw new this(r)}}constructor(e,r=500){super(),this.errors={},this.start=0,this.end=0,this.message=e,this.name=this.constructor.name,this.code=r}withCode(e){return this.code=e,this}withPosition(e,r){return this.start=e,this.end=r,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};Se.default=Re});var K=C(V=>{"use strict";Object.defineProperty(V,"__esModule",{value:!0});V.TempleEmitter=void 0;var fe=class extends EventTarget{emit(e,r){return this.dispatchEvent(new CustomEvent(e,{detail:r})),this}on(e,r){if(e==="ready"&&document.readyState!=="loading"){let l=new CustomEvent("ready");return setTimeout(()=>r(l),1),this}return this.addEventListener(e,r),this}once(e,r){let l=n=>{this.unbind(e,l),r(n)};return this.on(e,l),this}unbind(e,r){return this.removeEventListener(e,r),this}};V.TempleEmitter=fe;var We=new fe;document.onreadystatechange=()=>{document.readyState!=="loading"&&We.emit("ready")};V.default=We});var je=C(Q=>{"use strict";var Rt=Q&&Q.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Q,"__esModule",{value:!0});var Ce=Rt(K()),Pe=class{get attributes(){return Object.assign({},this._attributes)}get element(){return this._element}constructor(e,r){this._element=e,this._attributes=r}hasAttribute(e){return e in this._attributes}getAttribute(e){return this._attributes[e]}removeAttribute(e,r=!1){let l=this.getAttribute(e);return typeof l>"u"?this:(delete this._attributes[e],this._element.removeAttribute(e),r||Ce.default.emit("attribute-remove",{element:this,key:e,previous:l}),this)}setAttribute(e,r,l=!1){if(typeof r>"u")return this.removeAttribute(e,l);let n=this.getAttribute(e);return n===r?this:(this._attributes[e]=r,typeof r=="string"&&this._element.setAttribute(e,r),l||(typeof n>"u"?Ce.default.emit("attribute-create",{element:this,key:e,value:r}):Ce.default.emit("attribute-update",{element:this,key:e,value:r,previous:n})),this)}setAttributes(e,r=!1){for(let[n,g]of Object.entries(e))this.setAttribute(n,g,r);let l=Object.keys(e);for(let n of Object.keys(this._attributes))l.includes(n)||this.removeAttribute(n,r);return this}};Q.default=Pe});var he=C(ee=>{"use strict";var St=ee&&ee.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ee,"__esModule",{value:!0});var Dt=St(je()),ge=class{static get elements(){return this._elements}static createComponent(e,r,l,n=[]){let g=document.createElement("template");g.innerHTML=`<${e}>`;let u=g.content.querySelector(`${e}`);Object.setPrototypeOf(u,r.prototype),u.constructor=r.constructor,u.constructor.component=r.component;for(let[k,x]of Object.entries(l))typeof x=="string"?u.setAttribute(k,x):x===!0&&u.setAttribute(k,k);return u._TempleAttributes=l,u.props=l,n.forEach(k=>u.appendChild(k)),u.register(),customElements.get(e)||u.connectedCallback(),this.register(u,l)}static createElement(e,r,l=[]){let n=document.createElement(e);for(let[g,h]of Object.entries(r))typeof h=="string"?n.setAttribute(g,h):h===!0&&n.setAttribute(g,g);return l.filter(g=>typeof g<"u").forEach(g=>n.appendChild(g)),this.register(n,r)}static createText(e,r=!1){return document.createTextNode(e)}static filter(e){let r=[];return this._elements.forEach((l,n)=>{e(l,n)&&r.push(l)}),r}static get(e){return this._elements.get(e)||null}static has(e){return this._elements.has(e)}static map(e){let r=[];return this._elements.forEach((l,n)=>{r.push(e(l,n))}),r}static register(e,r){if(this.has(e))return this.get(e);let l=new Dt.default(e,r||{});return this._elements.set(e,l),l}};ge._elements=new Map;ee.default=ge});var B=C(te=>{"use strict";Object.defineProperty(te,"__esModule",{value:!0});te.TempleDataMap=void 0;var ye=class{constructor(){window.__APP_DATA__||(window.__APP_DATA__={})}clear(){return window.__APP_DATA__={},this}delete(e){return this.has(e)?(delete window.__APP_DATA__[e],!0):!1}entries(){return Object.entries(window.__APP_DATA__)}has(e){return e in window.__APP_DATA__}get(e){return window.__APP_DATA__[e]}keys(){return Object.keys(window.__APP_DATA__)}set(e,r){return window.__APP_DATA__[e]=r,this}values(){return Object.values(window.__APP_DATA__)}};te.TempleDataMap=ye;var Ct=new ye;te.default=Ct});var Xe=C(ne=>{"use strict";var Le=ne&&ne.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ne,"__esModule",{value:!0});var re=Le(he()),be=Le(K()),Ze=Le(B()),Me=class t extends HTMLElement{constructor(){super(...arguments),this._initiated=!1,this._template=null,this._attributes={},this._props={},this._children=void 0,this._rendering=!1}static register(){customElements.define(this.component[0],this)}get attr(){return this._attributes}get element(){return re.default.has(this)?re.default.get(this):re.default.register(this,this._TempleAttributes||{})}get metadata(){let[e,r]=this.constructor.component;return{tagname:e,classname:r}}get originalChildren(){return this._children}get initiated(){return this._initiated}get props(){return this._props}set props(e){this._props=Object.assign({},e),this._attributes=Object.fromEntries(Object.entries(e).filter(r=>typeof r[1]=="string"||r[1]===!0))}adoptedCallback(){this.render()}attributeChangedCallback(e,r,l){this.props=Object.assign(Object.assign({},this.props),{[e]:l}),this.render()}connectedCallback(){this.wait()}disconnectedCallback(){}getParentComponent(){let e=this.parentElement;for(;e;){if(e instanceof t)return e;e=e.parentElement}return null}register(){re.default.register(this,this._props)}render(){let e=this.getParentComponent();if(e&&!e.initiated)return;if(this._rendering)return;this._rendering=!0,Ze.default.set("current",this);let r=this.styles();this._template?be.default.emit("unmounted",this):this._template=this.template();let l=this._template().filter(Boolean);if(r.length===0)this.textContent="",l.forEach(n=>this.appendChild(n));else{this.shadowRoot||this.attachShadow({mode:"open"});let n=this.shadowRoot;this.textContent="",n.textContent="";let g=document.createElement("style");g.innerText=r,n.appendChild(g),l.forEach(h=>{var u;return(u=this.shadowRoot)===null||u===void 0?void 0:u.appendChild(h)})}return Ze.default.delete("current"),this._initiated=!0,be.default.emit("mounted",this),this._rendering=!1,this.shadowRoot?this.shadowRoot.innerHTML:this.innerHTML}wait(){if(document.readyState!=="loading")this._update();else{let e=()=>{this._update(),be.default.unbind("ready",e)};be.default.on("ready",e)}}_toNodeList(e){return e instanceof Node?[e]:Array.isArray(e)&&e.every(r=>r instanceof Node)?e:[re.default.createText(String(e))]}_update(){typeof this._children>"u"&&(this._children=Array.from(this.childNodes||[]));let e=this.element;e&&(this.props=Object.assign({},e.attributes),this.render()),this._initiated||this.render()}};ne.default=Me});var Ye=C(ie=>{"use strict";var Pt=ie&&ie.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ie,"__esModule",{value:!0});var jt=Pt(B());function Mt(t){let e=jt.default.get("env")||{};return t?e[t]||null:e}ie.default=Mt});var Ie=C(se=>{"use strict";var Lt=se&&se.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(se,"__esModule",{value:!0});se.default=It;var Ve=Lt(B());function It(t=null){return t||(t=Ve.default.get("current")||null),t?t==="document"?Ve.default.get("props")||{}:t.props:{}}});var Ke=C(ae=>{"use strict";var Ot=ae&&ae.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ae,"__esModule",{value:!0});ae.default=Nt;var $t=Ot(Ie());function Nt(t=null){return(0,$t.default)(t).class}});var et=C(G=>{"use strict";var Bt=G&&G.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(G,"__esModule",{value:!0});G.innerHTML=qt;G.default=Qe;var Ht=Bt(B());function qt(t=null){let e=Qe(t),r=document.createElement("template");return r.append(...e),r.innerHTML}function Qe(t=null){return t||(t=Ht.default.get("current")||null),t?t.originalChildren||[]:[]}});var nt=C(H=>{"use strict";var rt=H&&H.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(H,"__esModule",{value:!0});H.SignalRegistry=void 0;H.default=Jt;var tt=rt(De()),zt=rt(B()),U=class t{static observe(e,r){let l={getter:()=>n.raw,setter:h=>h},n={raw:r,getter(h){return l.getter=h,n},setter(h){return l.setter=h,n}};Object.defineProperty(n,"value",{get(){return l.getter()},set(h){let u=l.setter(h),k=t.serialize(u)!==t.serialize(n.raw);n.raw=u,k&&e.render()}});let g=this._observers.get(e);return g?(g.observed++,g.values.push(n)):this._observers.set(e,{observed:1,values:[n]}),n}static observer(e){return this._observers.get(e)||null}static serialize(e){return JSON.stringify(e)}};H.SignalRegistry=U;U._observers=new Map;function Jt(t,e=null){if(e||(e=zt.default.get("current")||null),!e)throw tt.default.for("Signals can only be created within a Temple component");if(!e.initiated)return U.observe(e,t);let r=U.observer(e);if(!r)throw tt.default.for("State mismatch");return r.values[r.observed++%r.values.length]}});var ot=C(ke=>{"use strict";var st=ke&&ke.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ke,"__esModule",{value:!0});var it=st(he()),at=st(K()),lt=(t,e)=>Array.from(t.querySelectorAll("*")).filter(r=>{let l=it.default.get(r);return l&&l.hasAttribute(e)}).map(r=>it.default.get(r));function Oe(t,e){at.default.on("mounted",r=>{if(!r.detail)return;let l=r.detail;lt(l.shadowRoot||l,t).forEach(e)})}function Gt(t,e){at.default.on("unmounted",r=>{if(!r.detail)return;let l=r.detail;lt(l.shadowRoot||l,t).forEach(e)})}Oe("mount",t=>{let e=t.getAttribute("mount");if(typeof e=="function"){let r=new CustomEvent("mount",{detail:{node:t,target:t.element}});e(r)}});Gt("unmount",t=>{let e=t.getAttribute("unmount");if(typeof e=="function"){let r=new CustomEvent("unmount",{detail:{node:t,target:t.element}});e(r)}});Oe("if",t=>{let e=t.getAttribute("if");(e===!1||e==="false"||typeof e=="function"&&!e())&&t.element.remove()});["click","dblclick","mousedown","mouseup","mousemove","mouseover","mouseout","wheel","keydown","keypress","keyup","blur","change","contextmenu","focus","input","submit","invalid","reset","search","select","copy","cut","paste","drag","dragstart","dragend","dragover","dragenter","dragleave","drop","scroll","durationchange","ended","error","loadeddata","loadedmetadata","loadstart","pause","play","playing","progress","ratechange","seeked","seeking","stalled","suspend","timeupdate","volumechange","waiting","animationstart","animationend","animationiteration","transitionend","toggle"].forEach(t=>Oe(t,e=>{let r=e.getAttribute(t);typeof r=="function"&&(e.element.removeEventListener(t,r),e.element.addEventListener(t,r))}))});var $e=C(y=>{"use strict";var Ut=y&&y.__createBinding||(Object.create?function(t,e,r,l){l===void 0&&(l=r);var n=Object.getOwnPropertyDescriptor(e,r);(!n||("get"in n?!e.__esModule:n.writable||n.configurable))&&(n={enumerable:!0,get:function(){return e[r]}}),Object.defineProperty(t,l,n)}:function(t,e,r,l){l===void 0&&(l=r),t[l]=e[r]}),Wt=y&&y.__setModuleDefault||(Object.create?function(t,e){Object.defineProperty(t,"default",{enumerable:!0,value:e})}:function(t,e){t.default=e}),xe=y&&y.__importStar||function(t){if(t&&t.__esModule)return t;var e={};if(t!=null)for(var r in t)r!=="default"&&Object.prototype.hasOwnProperty.call(t,r)&&Ut(e,t,r);return Wt(e,t),e},q=y&&y.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(y,"__esModule",{value:!0});y.SignalRegistry=y.TempleException=y.TempleEmitter=y.TempleElement=y.TempleRegistry=y.TempleComponent=y.TempleDataMap=y.emitter=y.signal=y.innerHTML=y.children=y.classnames=y.props=y.env=y.data=void 0;var Zt=q(De());y.TempleException=Zt.default;var Xt=q(Xe());y.TempleComponent=Xt.default;var Yt=q(he());y.TempleRegistry=Yt.default;var Vt=q(je());y.TempleElement=Vt.default;var pt=xe(K());y.emitter=pt.default;Object.defineProperty(y,"TempleEmitter",{enumerable:!0,get:function(){return pt.TempleEmitter}});var ct=xe(B());y.data=ct.default;Object.defineProperty(y,"TempleDataMap",{enumerable:!0,get:function(){return ct.TempleDataMap}});var Kt=q(Ye());y.env=Kt.default;var Qt=q(Ie());y.props=Qt.default;var er=q(Ke());y.classnames=er.default;var dt=xe(et());y.children=dt.default;Object.defineProperty(y,"innerHTML",{enumerable:!0,get:function(){return dt.innerHTML}});var ut=xe(nt());y.signal=ut.default;Object.defineProperty(y,"SignalRegistry",{enumerable:!0,get:function(){return ut.SignalRegistry}});ot()});var z=C((xr,mt)=>{mt.exports={...$e()}});var ft=C((Tr,Te)=>{var tr=typeof window<"u"?window:typeof WorkerGlobalScope<"u"&&self instanceof WorkerGlobalScope?self:{};var d=function(t){var e=/(?:^|\s)lang(?:uage)?-([\w-]+)(?=\s|$)/i,r=0,l={},n={manual:t.Prism&&t.Prism.manual,disableWorkerMessageHandler:t.Prism&&t.Prism.disableWorkerMessageHandler,util:{encode:function a(s){return s instanceof g?new g(s.type,a(s.content),s.alias):Array.isArray(s)?s.map(a):s.replace(/&/g,"&").replace(/"u")return null;if("currentScript"in document)return document.currentScript;try{throw new Error}catch(p){var a=(/at [^(\r\n]*\((.*):[^:]+:[^:]+\)$/i.exec(p.stack)||[])[1];if(a){var s=document.getElementsByTagName("script");for(var o in s)if(s[o].src==a)return s[o]}return null}},isActive:function(a,s,o){for(var p="no-"+s;a;){var c=a.classList;if(c.contains(s))return!0;if(c.contains(p))return!1;a=a.parentElement}return!!o}},languages:{plain:l,plaintext:l,text:l,txt:l,extend:function(a,s){var o=n.util.clone(n.languages[a]);for(var p in s)o[p]=s[p];return o},insertBefore:function(a,s,o,p){p=p||n.languages;var c=p[a],f={};for(var b in c)if(c.hasOwnProperty(b)){if(b==s)for(var m in o)o.hasOwnProperty(m)&&(f[m]=o[m]);o.hasOwnProperty(b)||(f[b]=c[b])}var w=p[a];return p[a]=f,n.languages.DFS(n.languages,function(S,O){O===w&&S!=a&&(this[S]=f)}),f},DFS:function a(s,o,p,c){c=c||{};var f=n.util.objId;for(var b in s)if(s.hasOwnProperty(b)){o.call(s,b,s[b],p||b);var m=s[b],w=n.util.type(m);w==="Object"&&!c[f(m)]?(c[f(m)]=!0,a(m,o,null,c)):w==="Array"&&!c[f(m)]&&(c[f(m)]=!0,a(m,o,b,c))}}},plugins:{},highlightAll:function(a,s){n.highlightAllUnder(document,a,s)},highlightAllUnder:function(a,s,o){var p={callback:o,container:a,selector:'code[class*="language-"], [class*="language-"] code, code[class*="lang-"], [class*="lang-"] code'};n.hooks.run("before-highlightall",p),p.elements=Array.prototype.slice.apply(p.container.querySelectorAll(p.selector)),n.hooks.run("before-all-elements-highlight",p);for(var c=0,f;f=p.elements[c++];)n.highlightElement(f,s===!0,p.callback)},highlightElement:function(a,s,o){var p=n.util.getLanguage(a),c=n.languages[p];n.util.setLanguage(a,p);var f=a.parentElement;f&&f.nodeName.toLowerCase()==="pre"&&n.util.setLanguage(f,p);var b=a.textContent,m={element:a,language:p,grammar:c,code:b};function w(O){m.highlightedCode=O,n.hooks.run("before-insert",m),m.element.innerHTML=m.highlightedCode,n.hooks.run("after-highlight",m),n.hooks.run("complete",m),o&&o.call(m.element)}if(n.hooks.run("before-sanity-check",m),f=m.element.parentElement,f&&f.nodeName.toLowerCase()==="pre"&&!f.hasAttribute("tabindex")&&f.setAttribute("tabindex","0"),!m.code){n.hooks.run("complete",m),o&&o.call(m.element);return}if(n.hooks.run("before-highlight",m),!m.grammar){w(n.util.encode(m.code));return}if(s&&t.Worker){var S=new Worker(n.filename);S.onmessage=function(O){w(O.data)},S.postMessage(JSON.stringify({language:m.language,code:m.code,immediateClose:!0}))}else w(n.highlight(m.code,m.grammar,m.language))},highlight:function(a,s,o){var p={code:a,grammar:s,language:o};if(n.hooks.run("before-tokenize",p),!p.grammar)throw new Error('The language "'+p.language+'" has no grammar.');return p.tokens=n.tokenize(p.code,p.grammar),n.hooks.run("after-tokenize",p),g.stringify(n.util.encode(p.tokens),p.language)},tokenize:function(a,s){var o=s.rest;if(o){for(var p in o)s[p]=o[p];delete s.rest}var c=new k;return x(c,c.head,a),u(a,c,s,c.head,0),F(c)},hooks:{all:{},add:function(a,s){var o=n.hooks.all;o[a]=o[a]||[],o[a].push(s)},run:function(a,s){var o=n.hooks.all[a];if(!(!o||!o.length))for(var p=0,c;c=o[p++];)c(s)}},Token:g};t.Prism=n;function g(a,s,o,p){this.type=a,this.content=s,this.alias=o,this.length=(p||"").length|0}g.stringify=function a(s,o){if(typeof s=="string")return s;if(Array.isArray(s)){var p="";return s.forEach(function(w){p+=a(w,o)}),p}var c={type:s.type,content:a(s.content,o),tag:"span",classes:["token",s.type],attributes:{},language:o},f=s.alias;f&&(Array.isArray(f)?Array.prototype.push.apply(c.classes,f):c.classes.push(f)),n.hooks.run("wrap",c);var b="";for(var m in c.attributes)b+=" "+m+'="'+(c.attributes[m]||"").replace(/"/g,""")+'"';return"<"+c.tag+' class="'+c.classes.join(" ")+'"'+b+">"+c.content+""};function h(a,s,o,p){a.lastIndex=s;var c=a.exec(o);if(c&&p&&c[1]){var f=c[1].length;c.index+=f,c[0]=c[0].slice(f)}return c}function u(a,s,o,p,c,f){for(var b in o)if(!(!o.hasOwnProperty(b)||!o[b])){var m=o[b];m=Array.isArray(m)?m:[m];for(var w=0;w=f.reach);L+=D.value.length,D=D.next){var J=D.value;if(s.length>a.length)return;if(!(J instanceof g)){var pe=1,M;if(ze){if(M=h(Je,L,a,qe),!M||M.index>=a.length)break;var ce=M.index,kt=M.index+M[0].length,$=L;for($+=D.value.length;ce>=$;)D=D.next,$+=D.value.length;if($-=D.value.length,L=$,D.value instanceof g)continue;for(var Y=D;Y!==s.tail&&($f.reach&&(f.reach=Ee);var ue=D.prev;Ae&&(ue=x(s,ue,Ae),L+=Ae.length),_(s,ue,pe);var xt=new g(b,O?n.tokenize(de,O):de,yt,de);if(D=x(s,ue,xt),Ge&&x(s,D,Ge),pe>1){var Fe={cause:b+","+w,reach:Ee};u(a,s,o,D.prev,L,Fe),f&&Fe.reach>f.reach&&(f.reach=Fe.reach)}}}}}}function k(){var a={value:null,prev:null,next:null},s={value:null,prev:a,next:null};a.next=s,this.head=a,this.tail=s,this.length=0}function x(a,s,o){var p=s.next,c={value:o,prev:s,next:p};return s.next=c,p.prev=c,a.length++,c}function _(a,s,o){for(var p=s.next,c=0;c/,greedy:!0},prolog:{pattern:/<\?[\s\S]+?\?>/,greedy:!0},doctype:{pattern:/"'[\]]|"[^"]*"|'[^']*')+(?:\[(?:[^<"'\]]|"[^"]*"|'[^']*'|<(?!!--)|)*\]\s*)?>/i,greedy:!0,inside:{"internal-subset":{pattern:/(^[^\[]*\[)[\s\S]+(?=\]>$)/,lookbehind:!0,greedy:!0,inside:null},string:{pattern:/"[^"]*"|'[^']*'/,greedy:!0},punctuation:/^$|[[\]]/,"doctype-tag":/^DOCTYPE/i,name:/[^\s<>'"]+/}},cdata:{pattern://i,greedy:!0},tag:{pattern:/<\/?(?!\d)[^\s>\/=$<%]+(?:\s(?:\s*[^\s>\/=]+(?:\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))|(?=[\s/>])))+)?\s*\/?>/,greedy:!0,inside:{tag:{pattern:/^<\/?[^\s>\/]+/,inside:{punctuation:/^<\/?/,namespace:/^[^\s>\/:]+:/}},"special-attr":[],"attr-value":{pattern:/=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+)/,inside:{punctuation:[{pattern:/^=/,alias:"attr-equals"},{pattern:/^(\s*)["']|["']$/,lookbehind:!0}]}},punctuation:/\/?>/,"attr-name":{pattern:/[^\s>\/]+/,inside:{namespace:/^[^\s>\/:]+:/}}}},entity:[{pattern:/&[\da-z]{1,8};/i,alias:"named-entity"},/&#x?[\da-f]{1,8};/i]};d.languages.markup.tag.inside["attr-value"].inside.entity=d.languages.markup.entity;d.languages.markup.doctype.inside["internal-subset"].inside=d.languages.markup;d.hooks.add("wrap",function(t){t.type==="entity"&&(t.attributes.title=t.content.replace(/&/,"&"))});Object.defineProperty(d.languages.markup.tag,"addInlined",{value:function(e,r){var l={};l["language-"+r]={pattern:/(^$)/i,lookbehind:!0,inside:d.languages[r]},l.cdata=/^$/i;var n={"included-cdata":{pattern://i,inside:l}};n["language-"+r]={pattern:/[\s\S]+/,inside:d.languages[r]};var g={};g[e]={pattern:RegExp(/(<__[^>]*>)(?:))*\]\]>|(?!)/.source.replace(/__/g,function(){return e}),"i"),lookbehind:!0,greedy:!0,inside:n},d.languages.insertBefore("markup","cdata",g)}});Object.defineProperty(d.languages.markup.tag,"addAttribute",{value:function(t,e){d.languages.markup.tag.inside["special-attr"].push({pattern:RegExp(/(^|["'\s])/.source+"(?:"+t+")"+/\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))/.source,"i"),lookbehind:!0,inside:{"attr-name":/^[^\s=]+/,"attr-value":{pattern:/=[\s\S]+/,inside:{value:{pattern:/(^=\s*(["']|(?!["'])))\S[\s\S]*(?=\2$)/,lookbehind:!0,alias:[e,"language-"+e],inside:d.languages[e]},punctuation:[{pattern:/^=/,alias:"attr-equals"},/"|'/]}}}})}});d.languages.html=d.languages.markup;d.languages.mathml=d.languages.markup;d.languages.svg=d.languages.markup;d.languages.xml=d.languages.extend("markup",{});d.languages.ssml=d.languages.xml;d.languages.atom=d.languages.xml;d.languages.rss=d.languages.xml;(function(t){var e=/(?:"(?:\\(?:\r\n|[\s\S])|[^"\\\r\n])*"|'(?:\\(?:\r\n|[\s\S])|[^'\\\r\n])*')/;t.languages.css={comment:/\/\*[\s\S]*?\*\//,atrule:{pattern:RegExp("@[\\w-](?:"+/[^;{\s"']|\s+(?!\s)/.source+"|"+e.source+")*?"+/(?:;|(?=\s*\{))/.source),inside:{rule:/^@[\w-]+/,"selector-function-argument":{pattern:/(\bselector\s*\(\s*(?![\s)]))(?:[^()\s]|\s+(?![\s)])|\((?:[^()]|\([^()]*\))*\))+(?=\s*\))/,lookbehind:!0,alias:"selector"},keyword:{pattern:/(^|[^\w-])(?:and|not|only|or)(?![\w-])/,lookbehind:!0}}},url:{pattern:RegExp("\\burl\\((?:"+e.source+"|"+/(?:[^\\\r\n()"']|\\[\s\S])*/.source+")\\)","i"),greedy:!0,inside:{function:/^url/i,punctuation:/^\(|\)$/,string:{pattern:RegExp("^"+e.source+"$"),alias:"url"}}},selector:{pattern:RegExp(`(^|[{}\\s])[^{}\\s](?:[^{};"'\\s]|\\s+(?![\\s{])|`+e.source+")*(?=\\s*\\{)"),lookbehind:!0},string:{pattern:e,greedy:!0},property:{pattern:/(^|[^-\w\xA0-\uFFFF])(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*(?=\s*:)/i,lookbehind:!0},important:/!important\b/i,function:{pattern:/(^|[^-a-z0-9])[-a-z0-9]+(?=\()/i,lookbehind:!0},punctuation:/[(){};:,]/},t.languages.css.atrule.inside.rest=t.languages.css;var r=t.languages.markup;r&&(r.tag.addInlined("style","css"),r.tag.addAttribute("style","css"))})(d);d.languages.clike={comment:[{pattern:/(^|[^\\])\/\*[\s\S]*?(?:\*\/|$)/,lookbehind:!0,greedy:!0},{pattern:/(^|[^\\:])\/\/.*/,lookbehind:!0,greedy:!0}],string:{pattern:/(["'])(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/,greedy:!0},"class-name":{pattern:/(\b(?:class|extends|implements|instanceof|interface|new|trait)\s+|\bcatch\s+\()[\w.\\]+/i,lookbehind:!0,inside:{punctuation:/[.\\]/}},keyword:/\b(?:break|catch|continue|do|else|finally|for|function|if|in|instanceof|new|null|return|throw|try|while)\b/,boolean:/\b(?:false|true)\b/,function:/\b\w+(?=\()/,number:/\b0x[\da-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:e[+-]?\d+)?/i,operator:/[<>]=?|[!=]=?=?|--?|\+\+?|&&?|\|\|?|[?*/~^%]/,punctuation:/[{}[\];(),.:]/};d.languages.javascript=d.languages.extend("clike",{"class-name":[d.languages.clike["class-name"],{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$A-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\.(?:constructor|prototype))/,lookbehind:!0}],keyword:[{pattern:/((?:^|\})\s*)catch\b/,lookbehind:!0},{pattern:/(^|[^.]|\.\.\.\s*)\b(?:as|assert(?=\s*\{)|async(?=\s*(?:function\b|\(|[$\w\xA0-\uFFFF]|$))|await|break|case|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally(?=\s*(?:\{|$))|for|from(?=\s*(?:['"]|$))|function|(?:get|set)(?=\s*(?:[#\[$\w\xA0-\uFFFF]|$))|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)\b/,lookbehind:!0}],function:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*(?:\.\s*(?:apply|bind|call)\s*)?\()/,number:{pattern:RegExp(/(^|[^\w$])/.source+"(?:"+(/NaN|Infinity/.source+"|"+/0[bB][01]+(?:_[01]+)*n?/.source+"|"+/0[oO][0-7]+(?:_[0-7]+)*n?/.source+"|"+/0[xX][\dA-Fa-f]+(?:_[\dA-Fa-f]+)*n?/.source+"|"+/\d+(?:_\d+)*n/.source+"|"+/(?:\d+(?:_\d+)*(?:\.(?:\d+(?:_\d+)*)?)?|\.\d+(?:_\d+)*)(?:[Ee][+-]?\d+(?:_\d+)*)?/.source)+")"+/(?![\w$])/.source),lookbehind:!0},operator:/--|\+\+|\*\*=?|=>|&&=?|\|\|=?|[!=]==|<<=?|>>>?=?|[-+*/%&|^!=<>]=?|\.{3}|\?\?=?|\?\.?|[~:]/});d.languages.javascript["class-name"][0].pattern=/(\b(?:class|extends|implements|instanceof|interface|new)\s+)[\w.\\]+/;d.languages.insertBefore("javascript","keyword",{regex:{pattern:RegExp(/((?:^|[^$\w\xA0-\uFFFF."'\])\s]|\b(?:return|yield))\s*)/.source+/\//.source+"(?:"+/(?:\[(?:[^\]\\\r\n]|\\.)*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}/.source+"|"+/(?:\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.)*\])*\])*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}v[dgimyus]{0,7}/.source+")"+/(?=(?:\s|\/\*(?:[^*]|\*(?!\/))*\*\/)*(?:$|[\r\n,.;:})\]]|\/\/))/.source),lookbehind:!0,greedy:!0,inside:{"regex-source":{pattern:/^(\/)[\s\S]+(?=\/[a-z]*$)/,lookbehind:!0,alias:"language-regex",inside:d.languages.regex},"regex-delimiter":/^\/|\/$/,"regex-flags":/^[a-z]+$/}},"function-variable":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*[=:]\s*(?:async\s*)?(?:\bfunction\b|(?:\((?:[^()]|\([^()]*\))*\)|(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)\s*=>))/,alias:"function"},parameter:[{pattern:/(function(?:\s+(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)?\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\))/,lookbehind:!0,inside:d.languages.javascript},{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$a-z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*=>)/i,lookbehind:!0,inside:d.languages.javascript},{pattern:/(\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*=>)/,lookbehind:!0,inside:d.languages.javascript},{pattern:/((?:\b|\s|^)(?!(?:as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)(?![$\w\xA0-\uFFFF]))(?:(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*)\(\s*|\]\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*\{)/,lookbehind:!0,inside:d.languages.javascript}],constant:/\b[A-Z](?:[A-Z_]|\dx?)*\b/});d.languages.insertBefore("javascript","string",{hashbang:{pattern:/^#!.*/,greedy:!0,alias:"comment"},"template-string":{pattern:/`(?:\\[\s\S]|\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}|(?!\$\{)[^\\`])*`/,greedy:!0,inside:{"template-punctuation":{pattern:/^`|`$/,alias:"string"},interpolation:{pattern:/((?:^|[^\\])(?:\\{2})*)\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}/,lookbehind:!0,inside:{"interpolation-punctuation":{pattern:/^\$\{|\}$/,alias:"punctuation"},rest:d.languages.javascript}},string:/[\s\S]+/}},"string-property":{pattern:/((?:^|[,{])[ \t]*)(["'])(?:\\(?:\r\n|[\s\S])|(?!\2)[^\\\r\n])*\2(?=\s*:)/m,lookbehind:!0,greedy:!0,alias:"property"}});d.languages.insertBefore("javascript","operator",{"literal-property":{pattern:/((?:^|[,{])[ \t]*)(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*:)/m,lookbehind:!0,alias:"property"}});d.languages.markup&&(d.languages.markup.tag.addInlined("script","javascript"),d.languages.markup.tag.addAttribute(/on(?:abort|blur|change|click|composition(?:end|start|update)|dblclick|error|focus(?:in|out)?|key(?:down|up)|load|mouse(?:down|enter|leave|move|out|over|up)|reset|resize|scroll|select|slotchange|submit|unload|wheel)/.source,"javascript"));d.languages.js=d.languages.javascript;(function(){if(typeof d>"u"||typeof document>"u")return;Element.prototype.matches||(Element.prototype.matches=Element.prototype.msMatchesSelector||Element.prototype.webkitMatchesSelector);var t="Loading\u2026",e=function(A,v){return"\u2716 Error "+A+" while fetching file: "+v},r="\u2716 Error: File does not exist or is empty",l={js:"javascript",py:"python",rb:"ruby",ps1:"powershell",psm1:"powershell",sh:"bash",bat:"batch",h:"c",tex:"latex"},n="data-src-status",g="loading",h="loaded",u="failed",k="pre[data-src]:not(["+n+'="'+h+'"]):not(['+n+'="'+g+'"])';function x(A,v,E){var a=new XMLHttpRequest;a.open("GET",A,!0),a.onreadystatechange=function(){a.readyState==4&&(a.status<400&&a.responseText?v(a.responseText):a.status>=400?E(e(a.status,a.statusText)):E(r))},a.send(null)}function _(A){var v=/^\s*(\d+)\s*(?:(,)\s*(?:(\d+)\s*)?)?$/.exec(A||"");if(v){var E=Number(v[1]),a=v[2],s=v[3];return a?s?[E,Number(s)]:[E,void 0]:[E,E]}}d.hooks.add("before-highlightall",function(A){A.selector+=", "+k}),d.hooks.add("before-sanity-check",function(A){var v=A.element;if(v.matches(k)){A.code="",v.setAttribute(n,g);var E=v.appendChild(document.createElement("CODE"));E.textContent=t;var a=v.getAttribute("data-src"),s=A.language;if(s==="none"){var o=(/\.(\w+)$/.exec(a)||[,"none"])[1];s=l[o]||o}d.util.setLanguage(E,s),d.util.setLanguage(v,s);var p=d.plugins.autoloader;p&&p.loadLanguages(s),x(a,function(c){v.setAttribute(n,h);var f=_(v.getAttribute("data-range"));if(f){var b=c.split(/\r\n?|\n/g),m=f[0],w=f[1]==null?b.length:f[1];m<0&&(m+=b.length),m=Math.max(0,Math.min(m-1,b.length)),w<0&&(w+=b.length),w=Math.max(0,Math.min(w,b.length)),c=b.slice(m,w).join(`
-`),v.hasAttribute("data-start")||v.setAttribute("data-start",String(m+1))}E.textContent=c,d.highlightElement(E)},function(c){v.setAttribute(n,u),E.textContent=c})}}),d.plugins.fileHighlight={highlight:function(v){for(var E=(v||document).querySelectorAll(k),a=0,s;s=E[a++];)d.highlightElement(s)}};var F=!1;d.fileHighlight=function(){F||(console.warn("Prism.fileHighlight is deprecated. Use `Prism.plugins.fileHighlight.highlight` instead."),F=!0),d.plugins.fileHighlight.highlight.apply(this,arguments)}})()});var _e=C((_r,gt)=>{gt.exports={...$e()}});var sr={};Et(sr,{BUILD_ID:()=>ir,TempleComponent:()=>R.TempleComponent,TempleElement:()=>R.TempleElement,TempleEmitter:()=>R.TempleEmitter,TempleException:()=>R.TempleException,TempleRegistry:()=>R.TempleRegistry,children:()=>R.children,components:()=>nr,data:()=>R.data,emitter:()=>R.emitter,props:()=>R.props,signal:()=>R.signal});var j=I(z());var ve=I(z()),W=class extends ve.TempleComponent{static component=["main","Main_fd7f1af6410c5b5c8e1f"];styles(){return""}template(){let e=this.props,r=()=>this.originalChildren;return()=>[ve.TempleRegistry.createElement("main",{},[...this._toNodeList(r())]).element]}};var T=I(z()),Ne=I(ft()),ht=I(_e()),N=class extends T.TempleComponent{static component=["code","Code_6f36bc13bb6a166c7abc"];styles(){return`:host {
+var TempleAPI=(()=>{var Bt=Object.create;var De=Object.defineProperty;var Ht=Object.getOwnPropertyDescriptor;var qt=Object.getOwnPropertyNames;var zt=Object.getPrototypeOf,Jt=Object.prototype.hasOwnProperty;var P=(t,e)=>()=>(e||t((e={exports:{}}).exports,e),e.exports),Gt=(t,e)=>{for(var r in e)De(t,r,{get:e[r],enumerable:!0})},ut=(t,e,r,a)=>{if(e&&typeof e=="object"||typeof e=="function")for(let n of qt(e))!Jt.call(t,n)&&n!==r&&De(t,n,{get:()=>e[n],enumerable:!(a=Ht(e,n))||a.enumerable});return t};var S=(t,e,r)=>(r=t!=null?Bt(zt(t)):{},ut(e||!t||!t.__esModule?De(r,"default",{value:t,enumerable:!0}):r,t)),Wt=t=>ut(De({},"__esModule",{value:!0}),t);var ue=P(Xe=>{"use strict";Object.defineProperty(Xe,"__esModule",{value:!0});var Ze=class extends Error{static for(e,...r){return r.forEach(function(a){e=e.replace("%s",a)}),new this(e)}static forErrorsFound(e){let r=new this("Invalid Parameters");return r.errors=e,r}static require(e,r,...a){if(!e){for(let n of a)r=r.replace("%s",n);throw new this(r)}}constructor(e,r=500){super(),this.errors={},this.start=0,this.end=0,this.message=e,this.name=this.constructor.name,this.code=r}withCode(e){return this.code=e,this}withPosition(e,r){return this.start=e,this.end=r,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};Xe.default=Ze});var Pe=P(j=>{"use strict";var Ut=j&&j.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(j,"__esModule",{value:!0});j.match=j.TempleEmitter=j.events=void 0;j.bindAttribute=J;j.unbindAttribute=ft;var mt=Ut(je());j.events=["click","dblclick","mousedown","mouseup","mousemove","mouseover","mouseout","wheel","keydown","keypress","keyup","blur","change","contextmenu","focus","input","submit","invalid","reset","search","select","copy","cut","paste","drag","dragstart","dragend","dragover","dragenter","dragleave","drop","scroll","durationchange","ended","error","loadeddata","loadedmetadata","loadstart","pause","play","playing","progress","ratechange","seeked","seeking","stalled","suspend","timeupdate","volumechange","waiting","animationstart","animationend","animationiteration","transitionend","toggle"];var Le=class extends EventTarget{emit(e,r){return this.dispatchEvent(new CustomEvent(e,{detail:r})),this}on(e,r){if(e==="ready"&&document.readyState!=="loading"){let a=new CustomEvent("ready");return setTimeout(()=>r(a),1),this}return this.addEventListener(e,r),this}once(e,r){let a=n=>{this.unbind(e,a),r(n)};return this.on(e,a),this}unbind(e,r){return this.removeEventListener(e,r),this}};j.TempleEmitter=Le;var Zt=(t,e)=>Array.from(t.querySelectorAll("*")).filter(r=>{let a=mt.default.get(r),n=a&&a.hasAttribute(e)&&!a.hasEvent(e);return n&&a.addEvent(e),n}).map(r=>mt.default.get(r));j.match=Zt;function J(t,e){Ce.on("mounted",r=>{if(!r.detail)return;let a=r.detail;(0,j.match)(a.shadowRoot||a,t).forEach(e)})}function ft(t,e){Ce.on("unmounted",r=>{if(!r.detail)return;let a=r.detail;(0,j.match)(a.shadowRoot||a,t).forEach(e)})}var Ce=new Le;j.default=(document.onreadystatechange=()=>{document.readyState!=="loading"&&Ce.emit("ready")},J("mount",t=>{let e=t.getAttribute("mount");if(typeof e=="function"){let r=new CustomEvent("mount",{detail:{node:t,target:t.element}});e(r)}}),ft("unmount",t=>{let e=t.getAttribute("unmount");if(typeof e=="function"){let r=new CustomEvent("unmount",{detail:{node:t,target:t.element}});e(r)}}),J("connect",t=>{let e=t.getAttribute("connect");if(typeof e=="function"){let r=new CustomEvent("connect",{detail:{node:t,target:t.element}});e(r)}}),J("disconnect",t=>{let e=t.getAttribute("disconnect");if(typeof e=="function"){let r=new CustomEvent("disconnect",{detail:{node:t,target:t.element}});e(r)}}),J("adopt",t=>{let e=t.getAttribute("adopt");if(typeof e=="function"){let r=new CustomEvent("adopt",{detail:{node:t,target:t.element}});e(r)}}),J("if",t=>{let e=t.getAttribute("if");(e===!1||e==="false"||typeof e=="function"&&!e())&&t.element.remove()}),j.events.forEach(t=>J(t,e=>{let r=e.getAttribute(t);typeof r=="function"&&(e.element.removeEventListener(t,r),e.element.addEventListener(t,r))})),Ce)});var Ke=P(me=>{"use strict";var Xt=me&&me.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(me,"__esModule",{value:!0});var Ye=Xt(Pe()),Ve=class{get attributes(){return Object.assign({},this._attributes)}get element(){return this._element}get events(){return this._events}constructor(e,r){this._events=new Set,this._element=e,this._attributes=r}addEvent(e){return this._events.add(e),this}getAttribute(e){return this._attributes[e]}hasAttribute(e){return e in this._attributes}hasEvent(e){return this._events.has(e)}removeAttribute(e,r=!1){let a=this.getAttribute(e);return typeof a>"u"?this:(delete this._attributes[e],this._element.removeAttribute(e),r||Ye.default.emit("attribute-remove",{element:this,key:e,previous:a}),this)}setAttribute(e,r,a=!1){if(typeof r>"u")return this.removeAttribute(e,a);let n=this.getAttribute(e);return n===r?this:(this._attributes[e]=r,typeof r=="string"&&this._element.setAttribute(e,r),a||(typeof n>"u"?Ye.default.emit("attribute-create",{element:this,key:e,value:r}):Ye.default.emit("attribute-update",{element:this,key:e,value:r,previous:n})),this)}setAttributes(e,r=!1){for(let[n,u]of Object.entries(e))this.setAttribute(n,u,r);let a=Object.keys(e);for(let n of Object.keys(this._attributes))a.includes(n)||this.removeAttribute(n,r);return this}};me.default=Ve});var je=P(fe=>{"use strict";var Yt=fe&&fe.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(fe,"__esModule",{value:!0});var Vt=Yt(Ke()),ht=document.createElement("textarea"),Kt=t=>(ht.innerHTML=t,ht.value),Me=class{static get elements(){return this._elements}static createComponent(e,r,a,n=[]){let u=document.createElement("template");u.innerHTML=`<${e}>`;let d=u.content.querySelector(`${e}`);return Object.setPrototypeOf(d,r.prototype),d.constructor=r.constructor,d.constructor.component=r.component,d.register(a,n),d.element}static createElement(e,r,a=[]){let n=document.createElement(e);for(let[u,b]of Object.entries(r))typeof b=="string"?n.setAttribute(u,b):b===!0&&n.setAttribute(u,u);return a.filter(u=>typeof u<"u").forEach(u=>n.appendChild(u)),this.register(n,r)}static createText(e,r=!0){return document.createTextNode(Kt(e))}static filter(e){let r=[];return this._elements.forEach((a,n)=>{e(a,n)&&r.push(a)}),r}static get(e){return this._elements.get(e)||null}static has(e){return this._elements.has(e)}static map(e){let r=[];return this._elements.forEach((a,n)=>{r.push(e(a,n))}),r}static register(e,r){if(this.has(e))return this.get(e);let a=new Vt.default(e,r||{});return this._elements.set(e,a),a}};Me._elements=new Map;fe.default=Me});var Q=P(he=>{"use strict";Object.defineProperty(he,"__esModule",{value:!0});he.TempleDataMap=void 0;var Ne=class{constructor(){window.__APP_DATA__||(window.__APP_DATA__={})}clear(){return window.__APP_DATA__={},this}delete(e){return this.has(e)?(delete window.__APP_DATA__[e],!0):!1}entries(){return Object.entries(window.__APP_DATA__)}has(e){return e in window.__APP_DATA__}get(e){return window.__APP_DATA__[e]}keys(){return Object.keys(window.__APP_DATA__)}set(e,r){return window.__APP_DATA__[e]=r,this}values(){return Object.values(window.__APP_DATA__)}};he.TempleDataMap=Ne;var Qt=new Ne;he.default=Qt});var yt=P(ge=>{"use strict";var Oe=ge&&ge.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ge,"__esModule",{value:!0});var gt=Oe(ue()),G=Oe(je()),W=Oe(Pe()),Ie=Oe(Q()),Qe=class t extends HTMLElement{static register(){customElements.define(this.component[0],this)}get attr(){return Object.fromEntries(Array.from(this.attributes).map(e=>[e.name,e.value]))}get element(){if(!G.default.has(this))throw gt.default.for("Component not mapped.");return G.default.get(this)}get metadata(){let[e,r]=this.constructor.component;return{tagname:e,classname:r}}get originalChildren(){return this._children}get initiated(){return this._initiated}get props(){return this.getAttributes()}get virtual(){return this._virtual}set props(e){this.setAttributes(e)}constructor(){if(super(),this._initiated=!1,this._template=null,this._children=void 0,this._rendering=!1,this._observer=null,this._virtual=!1,!G.default.has(this))throw gt.default.for("Component not mapped.")}adoptedCallback(){this.render(),W.default.emit("adopt",this)}connectedCallback(){this.wait(),W.default.emit("connect",this)}disconnectedCallback(){W.default.emit("disconnect",this)}getAttribute(e){return this.element.getAttribute(e)}getAttributes(){return Object.assign({},this.element.attributes)}getParentComponent(){let e=this.parentElement;for(;e;){if(e instanceof t)return e;e=e.parentElement}return null}hasAttribute(e){return this.element.hasAttribute(e)}register(e={},r=[]){G.default.has(this)?G.default.get(this).setAttributes(e):G.default.register(this,e);for(let[a,n]of Object.entries(e))typeof n=="string"?super.setAttribute(a,n):n===!0&&super.setAttribute(a,a);this._children=r,this._virtual=!0,this.connectedCallback()}removeAttribute(e){this.hasAttribute(e)&&this.element.removeAttribute(e),super.hasAttribute(e)&&super.removeAttribute(e)}render(){let e=this.getParentComponent();if(e&&!e.initiated)return;if(this._rendering)return;this._rendering=!0;let r=Ie.default.get("current");Ie.default.set("current",this);let a=this.styles();this._template?W.default.emit("unmounted",this):this._template=this.template();let n=this._template().filter(Boolean);if(a.length===0)this.textContent="",n.forEach(u=>this.appendChild(u));else{this.shadowRoot||this.attachShadow({mode:"open"});let u=this.shadowRoot;this.textContent="",u.textContent="";let b=document.createElement("style");b.innerText=a,u.appendChild(b),n.forEach(d=>{var k;return(k=this.shadowRoot)===null||k===void 0?void 0:k.appendChild(d)})}return r?Ie.default.set("current",r):Ie.default.delete("current"),this._initiated=!0,this._rendering=!1,W.default.emit("mounted",this),this.shadowRoot?this.shadowRoot.innerHTML:this.innerHTML}setAttribute(e,r){this.element.setAttribute(e,r),(typeof r=="string"||r===!0)&&super.setAttribute(e,r)}setAttributes(e){this.element.setAttributes(e)}wait(){if(document.readyState!=="loading")this._update();else{let e=()=>{this._update(),W.default.unbind("ready",e)};W.default.on("ready",e)}}_toNodeList(e){return e instanceof Node?[e]:Array.isArray(e)&&e.every(r=>r instanceof Node)?e:[G.default.createText(String(e))]}_update(){typeof this._children>"u"&&(this._children=Array.from(this.childNodes||[])),this._initiated||this.render()}};ge.default=Qe});var ee=P(ye=>{"use strict";var bt=ye&&ye.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ye,"__esModule",{value:!0});ye.default=rr;var er=bt(ue()),tr=bt(Q());function rr(t=null,e=!1){if(!t&&(t=tr.default.get("current"),!t)){if(!e)throw er.default.for("Not called within a Temple component");return null}return t}});var xt=P(be=>{"use strict";var nr=be&&be.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(be,"__esModule",{value:!0});var sr=nr(Q());function ir(t){let e=sr.default.get("env")||{};return t?e[t]||null:e}be.default=ir});var et=P(xe=>{"use strict";var kt=xe&&xe.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(xe,"__esModule",{value:!0});xe.default=or;var ar=kt(ee()),lr=kt(Q());function or(t=null){let e=(0,ar.default)(t,!0);return typeof e=="string"?lr.default.get("props")||{}:e?e.props:{}}});var Tt=P(te=>{"use strict";var vt=te&&te.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(te,"__esModule",{value:!0});te.classlist=dr;te.default=ur;var pr=vt(ee()),cr=vt(et());function dr(t=null){var e;if(t==="body")return document.body.classList;if(t==="head")return document.head.classList;if(t==="document")return(e=document.body.parentElement)===null||e===void 0?void 0:e.classList;let r=(0,pr.default)(t);return r?.classList}function ur(t=null){return(0,cr.default)(t).class}});var _t=P(U=>{"use strict";var mr=U&&U.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(U,"__esModule",{value:!0});U.innerHTML=hr;U.innerText=gr;U.default=tt;var fr=mr(ee());function hr(t=null){let e=tt(t),r=document.createElement("template");return r.append(...e.map(a=>a.cloneNode(!0))),r.innerHTML}function gr(t=null){let e=tt(t),r=document.createElement("template");return r.append(...e.map(a=>a.cloneNode(!0))),r.innerText}function tt(t=null){let e=(0,fr.default)(t,!0);return typeof e!="string"&&e?e.originalChildren||[]:[]}});var At=P(Z=>{"use strict";var wt=Z&&Z.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Z,"__esModule",{value:!0});Z.SignalRegistry=void 0;Z.default=xr;var yr=wt(ee()),br=wt(ue()),re=class t{static observe(e,r){let a={getter:()=>u.raw,setter:d=>d},n=new Set,u={raw:r,change(d){n.add(d)},getter(d){return a.getter=d,u},setter(d){return a.setter=d,u}};Object.defineProperty(u,"value",{get(){return a.getter()},set(d){let k=a.setter(d),x=t.serialize(k)!==t.serialize(u.raw);u.raw=k,x&&(n.forEach(f=>f(k)),e.render())}});let b=this._observers.get(e);return b?(b.observed++,b.values.push(u)):this._observers.set(e,{observed:1,values:[u]}),u}static observer(e){return this._observers.get(e)||null}static serialize(e){return JSON.stringify(e)}};Z.SignalRegistry=re;re._observers=new Map;function xr(t,e=null){let r=(0,yr.default)(e);if(!r.initiated)return re.observe(r,t);let a=re.observer(r);if(!a)throw br.default.for("Signal state mismatch");return a.values[a.observed++%a.values.length]}});var nt=P(y=>{"use strict";var kr=y&&y.__createBinding||(Object.create?function(t,e,r,a){a===void 0&&(a=r);var n=Object.getOwnPropertyDescriptor(e,r);(!n||("get"in n?!e.__esModule:n.writable||n.configurable))&&(n={enumerable:!0,get:function(){return e[r]}}),Object.defineProperty(t,a,n)}:function(t,e,r,a){a===void 0&&(a=r),t[a]=e[r]}),vr=y&&y.__setModuleDefault||(Object.create?function(t,e){Object.defineProperty(t,"default",{enumerable:!0,value:e})}:function(t,e){t.default=e}),ke=y&&y.__importStar||function(t){if(t&&t.__esModule)return t;var e={};if(t!=null)for(var r in t)r!=="default"&&Object.prototype.hasOwnProperty.call(t,r)&&kr(e,t,r);return vr(e,t),e},X=y&&y.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(y,"__esModule",{value:!0});y.SignalRegistry=y.TempleException=y.TempleEmitter=y.TempleElement=y.TempleRegistry=y.TempleComponent=y.TempleDataMap=y.emitter=y.signal=y.innerHTML=y.innerText=y.children=y.classnames=y.classlist=y.props=y.env=y.data=y.component=void 0;var Tr=X(ue());y.TempleException=Tr.default;var _r=X(yt());y.TempleComponent=_r.default;var wr=X(je());y.TempleRegistry=wr.default;var Ar=X(Ke());y.TempleElement=Ar.default;var Et=ke(Pe());y.emitter=Et.default;Object.defineProperty(y,"TempleEmitter",{enumerable:!0,get:function(){return Et.TempleEmitter}});var Er=X(ee());y.component=Er.default;var Rt=ke(Q());y.data=Rt.default;Object.defineProperty(y,"TempleDataMap",{enumerable:!0,get:function(){return Rt.TempleDataMap}});var Rr=X(xt());y.env=Rr.default;var Fr=X(et());y.props=Fr.default;var Ft=ke(Tt());y.classnames=Ft.default;Object.defineProperty(y,"classlist",{enumerable:!0,get:function(){return Ft.classlist}});var rt=ke(_t());y.children=rt.default;Object.defineProperty(y,"innerHTML",{enumerable:!0,get:function(){return rt.innerHTML}});Object.defineProperty(y,"innerText",{enumerable:!0,get:function(){return rt.innerText}});var St=ke(At());y.signal=St.default;Object.defineProperty(y,"SignalRegistry",{enumerable:!0,get:function(){return St.SignalRegistry}})});var I=P((Xr,Dt)=>{Dt.exports={...nt()}});var H=P((Yr,Lt)=>{Lt.exports={...nt()}});var st=P((rn,ze)=>{var Sr=typeof window<"u"?window:typeof WorkerGlobalScope<"u"&&self instanceof WorkerGlobalScope?self:{};var m=function(t){var e=/(?:^|\s)lang(?:uage)?-([\w-]+)(?=\s|$)/i,r=0,a={},n={manual:t.Prism&&t.Prism.manual,disableWorkerMessageHandler:t.Prism&&t.Prism.disableWorkerMessageHandler,util:{encode:function l(i){return i instanceof u?new u(i.type,l(i.content),i.alias):Array.isArray(i)?i.map(l):i.replace(/&/g,"&").replace(/"u")return null;if("currentScript"in document)return document.currentScript;try{throw new Error}catch(p){var l=(/at [^(\r\n]*\((.*):[^:]+:[^:]+\)$/i.exec(p.stack)||[])[1];if(l){var i=document.getElementsByTagName("script");for(var o in i)if(i[o].src==l)return i[o]}return null}},isActive:function(l,i,o){for(var p="no-"+i;l;){var c=l.classList;if(c.contains(i))return!0;if(c.contains(p))return!1;l=l.parentElement}return!!o}},languages:{plain:a,plaintext:a,text:a,txt:a,extend:function(l,i){var o=n.util.clone(n.languages[l]);for(var p in i)o[p]=i[p];return o},insertBefore:function(l,i,o,p){p=p||n.languages;var c=p[l],g={};for(var v in c)if(c.hasOwnProperty(v)){if(v==i)for(var h in o)o.hasOwnProperty(h)&&(g[h]=o[h]);o.hasOwnProperty(v)||(g[v]=c[v])}var F=p[l];return p[l]=g,n.languages.DFS(n.languages,function(L,q){q===F&&L!=l&&(this[L]=g)}),g},DFS:function l(i,o,p,c){c=c||{};var g=n.util.objId;for(var v in i)if(i.hasOwnProperty(v)){o.call(i,v,i[v],p||v);var h=i[v],F=n.util.type(h);F==="Object"&&!c[g(h)]?(c[g(h)]=!0,l(h,o,null,c)):F==="Array"&&!c[g(h)]&&(c[g(h)]=!0,l(h,o,v,c))}}},plugins:{},highlightAll:function(l,i){n.highlightAllUnder(document,l,i)},highlightAllUnder:function(l,i,o){var p={callback:o,container:l,selector:'code[class*="language-"], [class*="language-"] code, code[class*="lang-"], [class*="lang-"] code'};n.hooks.run("before-highlightall",p),p.elements=Array.prototype.slice.apply(p.container.querySelectorAll(p.selector)),n.hooks.run("before-all-elements-highlight",p);for(var c=0,g;g=p.elements[c++];)n.highlightElement(g,i===!0,p.callback)},highlightElement:function(l,i,o){var p=n.util.getLanguage(l),c=n.languages[p];n.util.setLanguage(l,p);var g=l.parentElement;g&&g.nodeName.toLowerCase()==="pre"&&n.util.setLanguage(g,p);var v=l.textContent,h={element:l,language:p,grammar:c,code:v};function F(q){h.highlightedCode=q,n.hooks.run("before-insert",h),h.element.innerHTML=h.highlightedCode,n.hooks.run("after-highlight",h),n.hooks.run("complete",h),o&&o.call(h.element)}if(n.hooks.run("before-sanity-check",h),g=h.element.parentElement,g&&g.nodeName.toLowerCase()==="pre"&&!g.hasAttribute("tabindex")&&g.setAttribute("tabindex","0"),!h.code){n.hooks.run("complete",h),o&&o.call(h.element);return}if(n.hooks.run("before-highlight",h),!h.grammar){F(n.util.encode(h.code));return}if(i&&t.Worker){var L=new Worker(n.filename);L.onmessage=function(q){F(q.data)},L.postMessage(JSON.stringify({language:h.language,code:h.code,immediateClose:!0}))}else F(n.highlight(h.code,h.grammar,h.language))},highlight:function(l,i,o){var p={code:l,grammar:i,language:o};if(n.hooks.run("before-tokenize",p),!p.grammar)throw new Error('The language "'+p.language+'" has no grammar.');return p.tokens=n.tokenize(p.code,p.grammar),n.hooks.run("after-tokenize",p),u.stringify(n.util.encode(p.tokens),p.language)},tokenize:function(l,i){var o=i.rest;if(o){for(var p in o)i[p]=o[p];delete i.rest}var c=new k;return x(c,c.head,l),d(l,c,i,c.head,0),A(c)},hooks:{all:{},add:function(l,i){var o=n.hooks.all;o[l]=o[l]||[],o[l].push(i)},run:function(l,i){var o=n.hooks.all[l];if(!(!o||!o.length))for(var p=0,c;c=o[p++];)c(i)}},Token:u};t.Prism=n;function u(l,i,o,p){this.type=l,this.content=i,this.alias=o,this.length=(p||"").length|0}u.stringify=function l(i,o){if(typeof i=="string")return i;if(Array.isArray(i)){var p="";return i.forEach(function(F){p+=l(F,o)}),p}var c={type:i.type,content:l(i.content,o),tag:"span",classes:["token",i.type],attributes:{},language:o},g=i.alias;g&&(Array.isArray(g)?Array.prototype.push.apply(c.classes,g):c.classes.push(g)),n.hooks.run("wrap",c);var v="";for(var h in c.attributes)v+=" "+h+'="'+(c.attributes[h]||"").replace(/"/g,""")+'"';return"<"+c.tag+' class="'+c.classes.join(" ")+'"'+v+">"+c.content+""};function b(l,i,o,p){l.lastIndex=i;var c=l.exec(o);if(c&&p&&c[1]){var g=c[1].length;c.index+=g,c[0]=c[0].slice(g)}return c}function d(l,i,o,p,c,g){for(var v in o)if(!(!o.hasOwnProperty(v)||!o[v])){var h=o[v];h=Array.isArray(h)?h:[h];for(var F=0;F=g.reach);B+=C.value.length,C=C.next){var K=C.value;if(i.length>l.length)return;if(!(K instanceof u)){var Ee=1,$;if(pt){if($=b(ct,B,l,ot),!$||$.index>=l.length)break;var Re=$.index,Ot=$.index+$[0].length,z=B;for(z+=C.value.length;Re>=z;)C=C.next,z+=C.value.length;if(z-=C.value.length,B=z,C.value instanceof u)continue;for(var de=C;de!==i.tail&&(zg.reach&&(g.reach=We);var Se=C.prev;Ge&&(Se=x(i,Se,Ge),B+=Ge.length),f(i,Se,Ee);var $t=new u(v,q?n.tokenize(Fe,q):Fe,Nt,Fe);if(C=x(i,Se,$t),dt&&x(i,C,dt),Ee>1){var Ue={cause:v+","+F,reach:We};d(l,i,o,C.prev,B,Ue),g&&Ue.reach>g.reach&&(g.reach=Ue.reach)}}}}}}function k(){var l={value:null,prev:null,next:null},i={value:null,prev:l,next:null};l.next=i,this.head=l,this.tail=i,this.length=0}function x(l,i,o){var p=i.next,c={value:o,prev:i,next:p};return i.next=c,p.prev=c,l.length++,c}function f(l,i,o){for(var p=i.next,c=0;c/,greedy:!0},prolog:{pattern:/<\?[\s\S]+?\?>/,greedy:!0},doctype:{pattern:/"'[\]]|"[^"]*"|'[^']*')+(?:\[(?:[^<"'\]]|"[^"]*"|'[^']*'|<(?!!--)|)*\]\s*)?>/i,greedy:!0,inside:{"internal-subset":{pattern:/(^[^\[]*\[)[\s\S]+(?=\]>$)/,lookbehind:!0,greedy:!0,inside:null},string:{pattern:/"[^"]*"|'[^']*'/,greedy:!0},punctuation:/^$|[[\]]/,"doctype-tag":/^DOCTYPE/i,name:/[^\s<>'"]+/}},cdata:{pattern://i,greedy:!0},tag:{pattern:/<\/?(?!\d)[^\s>\/=$<%]+(?:\s(?:\s*[^\s>\/=]+(?:\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))|(?=[\s/>])))+)?\s*\/?>/,greedy:!0,inside:{tag:{pattern:/^<\/?[^\s>\/]+/,inside:{punctuation:/^<\/?/,namespace:/^[^\s>\/:]+:/}},"special-attr":[],"attr-value":{pattern:/=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+)/,inside:{punctuation:[{pattern:/^=/,alias:"attr-equals"},{pattern:/^(\s*)["']|["']$/,lookbehind:!0}]}},punctuation:/\/?>/,"attr-name":{pattern:/[^\s>\/]+/,inside:{namespace:/^[^\s>\/:]+:/}}}},entity:[{pattern:/&[\da-z]{1,8};/i,alias:"named-entity"},/&#x?[\da-f]{1,8};/i]};m.languages.markup.tag.inside["attr-value"].inside.entity=m.languages.markup.entity;m.languages.markup.doctype.inside["internal-subset"].inside=m.languages.markup;m.hooks.add("wrap",function(t){t.type==="entity"&&(t.attributes.title=t.content.replace(/&/,"&"))});Object.defineProperty(m.languages.markup.tag,"addInlined",{value:function(e,r){var a={};a["language-"+r]={pattern:/(^$)/i,lookbehind:!0,inside:m.languages[r]},a.cdata=/^$/i;var n={"included-cdata":{pattern://i,inside:a}};n["language-"+r]={pattern:/[\s\S]+/,inside:m.languages[r]};var u={};u[e]={pattern:RegExp(/(<__[^>]*>)(?:))*\]\]>|(?!)/.source.replace(/__/g,function(){return e}),"i"),lookbehind:!0,greedy:!0,inside:n},m.languages.insertBefore("markup","cdata",u)}});Object.defineProperty(m.languages.markup.tag,"addAttribute",{value:function(t,e){m.languages.markup.tag.inside["special-attr"].push({pattern:RegExp(/(^|["'\s])/.source+"(?:"+t+")"+/\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))/.source,"i"),lookbehind:!0,inside:{"attr-name":/^[^\s=]+/,"attr-value":{pattern:/=[\s\S]+/,inside:{value:{pattern:/(^=\s*(["']|(?!["'])))\S[\s\S]*(?=\2$)/,lookbehind:!0,alias:[e,"language-"+e],inside:m.languages[e]},punctuation:[{pattern:/^=/,alias:"attr-equals"},/"|'/]}}}})}});m.languages.html=m.languages.markup;m.languages.mathml=m.languages.markup;m.languages.svg=m.languages.markup;m.languages.xml=m.languages.extend("markup",{});m.languages.ssml=m.languages.xml;m.languages.atom=m.languages.xml;m.languages.rss=m.languages.xml;(function(t){var e=/(?:"(?:\\(?:\r\n|[\s\S])|[^"\\\r\n])*"|'(?:\\(?:\r\n|[\s\S])|[^'\\\r\n])*')/;t.languages.css={comment:/\/\*[\s\S]*?\*\//,atrule:{pattern:RegExp("@[\\w-](?:"+/[^;{\s"']|\s+(?!\s)/.source+"|"+e.source+")*?"+/(?:;|(?=\s*\{))/.source),inside:{rule:/^@[\w-]+/,"selector-function-argument":{pattern:/(\bselector\s*\(\s*(?![\s)]))(?:[^()\s]|\s+(?![\s)])|\((?:[^()]|\([^()]*\))*\))+(?=\s*\))/,lookbehind:!0,alias:"selector"},keyword:{pattern:/(^|[^\w-])(?:and|not|only|or)(?![\w-])/,lookbehind:!0}}},url:{pattern:RegExp("\\burl\\((?:"+e.source+"|"+/(?:[^\\\r\n()"']|\\[\s\S])*/.source+")\\)","i"),greedy:!0,inside:{function:/^url/i,punctuation:/^\(|\)$/,string:{pattern:RegExp("^"+e.source+"$"),alias:"url"}}},selector:{pattern:RegExp(`(^|[{}\\s])[^{}\\s](?:[^{};"'\\s]|\\s+(?![\\s{])|`+e.source+")*(?=\\s*\\{)"),lookbehind:!0},string:{pattern:e,greedy:!0},property:{pattern:/(^|[^-\w\xA0-\uFFFF])(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*(?=\s*:)/i,lookbehind:!0},important:/!important\b/i,function:{pattern:/(^|[^-a-z0-9])[-a-z0-9]+(?=\()/i,lookbehind:!0},punctuation:/[(){};:,]/},t.languages.css.atrule.inside.rest=t.languages.css;var r=t.languages.markup;r&&(r.tag.addInlined("style","css"),r.tag.addAttribute("style","css"))})(m);m.languages.clike={comment:[{pattern:/(^|[^\\])\/\*[\s\S]*?(?:\*\/|$)/,lookbehind:!0,greedy:!0},{pattern:/(^|[^\\:])\/\/.*/,lookbehind:!0,greedy:!0}],string:{pattern:/(["'])(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/,greedy:!0},"class-name":{pattern:/(\b(?:class|extends|implements|instanceof|interface|new|trait)\s+|\bcatch\s+\()[\w.\\]+/i,lookbehind:!0,inside:{punctuation:/[.\\]/}},keyword:/\b(?:break|catch|continue|do|else|finally|for|function|if|in|instanceof|new|null|return|throw|try|while)\b/,boolean:/\b(?:false|true)\b/,function:/\b\w+(?=\()/,number:/\b0x[\da-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:e[+-]?\d+)?/i,operator:/[<>]=?|[!=]=?=?|--?|\+\+?|&&?|\|\|?|[?*/~^%]/,punctuation:/[{}[\];(),.:]/};m.languages.javascript=m.languages.extend("clike",{"class-name":[m.languages.clike["class-name"],{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$A-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\.(?:constructor|prototype))/,lookbehind:!0}],keyword:[{pattern:/((?:^|\})\s*)catch\b/,lookbehind:!0},{pattern:/(^|[^.]|\.\.\.\s*)\b(?:as|assert(?=\s*\{)|async(?=\s*(?:function\b|\(|[$\w\xA0-\uFFFF]|$))|await|break|case|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally(?=\s*(?:\{|$))|for|from(?=\s*(?:['"]|$))|function|(?:get|set)(?=\s*(?:[#\[$\w\xA0-\uFFFF]|$))|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)\b/,lookbehind:!0}],function:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*(?:\.\s*(?:apply|bind|call)\s*)?\()/,number:{pattern:RegExp(/(^|[^\w$])/.source+"(?:"+(/NaN|Infinity/.source+"|"+/0[bB][01]+(?:_[01]+)*n?/.source+"|"+/0[oO][0-7]+(?:_[0-7]+)*n?/.source+"|"+/0[xX][\dA-Fa-f]+(?:_[\dA-Fa-f]+)*n?/.source+"|"+/\d+(?:_\d+)*n/.source+"|"+/(?:\d+(?:_\d+)*(?:\.(?:\d+(?:_\d+)*)?)?|\.\d+(?:_\d+)*)(?:[Ee][+-]?\d+(?:_\d+)*)?/.source)+")"+/(?![\w$])/.source),lookbehind:!0},operator:/--|\+\+|\*\*=?|=>|&&=?|\|\|=?|[!=]==|<<=?|>>>?=?|[-+*/%&|^!=<>]=?|\.{3}|\?\?=?|\?\.?|[~:]/});m.languages.javascript["class-name"][0].pattern=/(\b(?:class|extends|implements|instanceof|interface|new)\s+)[\w.\\]+/;m.languages.insertBefore("javascript","keyword",{regex:{pattern:RegExp(/((?:^|[^$\w\xA0-\uFFFF."'\])\s]|\b(?:return|yield))\s*)/.source+/\//.source+"(?:"+/(?:\[(?:[^\]\\\r\n]|\\.)*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}/.source+"|"+/(?:\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.)*\])*\])*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}v[dgimyus]{0,7}/.source+")"+/(?=(?:\s|\/\*(?:[^*]|\*(?!\/))*\*\/)*(?:$|[\r\n,.;:})\]]|\/\/))/.source),lookbehind:!0,greedy:!0,inside:{"regex-source":{pattern:/^(\/)[\s\S]+(?=\/[a-z]*$)/,lookbehind:!0,alias:"language-regex",inside:m.languages.regex},"regex-delimiter":/^\/|\/$/,"regex-flags":/^[a-z]+$/}},"function-variable":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*[=:]\s*(?:async\s*)?(?:\bfunction\b|(?:\((?:[^()]|\([^()]*\))*\)|(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)\s*=>))/,alias:"function"},parameter:[{pattern:/(function(?:\s+(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)?\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\))/,lookbehind:!0,inside:m.languages.javascript},{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$a-z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*=>)/i,lookbehind:!0,inside:m.languages.javascript},{pattern:/(\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*=>)/,lookbehind:!0,inside:m.languages.javascript},{pattern:/((?:\b|\s|^)(?!(?:as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)(?![$\w\xA0-\uFFFF]))(?:(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*)\(\s*|\]\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*\{)/,lookbehind:!0,inside:m.languages.javascript}],constant:/\b[A-Z](?:[A-Z_]|\dx?)*\b/});m.languages.insertBefore("javascript","string",{hashbang:{pattern:/^#!.*/,greedy:!0,alias:"comment"},"template-string":{pattern:/`(?:\\[\s\S]|\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}|(?!\$\{)[^\\`])*`/,greedy:!0,inside:{"template-punctuation":{pattern:/^`|`$/,alias:"string"},interpolation:{pattern:/((?:^|[^\\])(?:\\{2})*)\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}/,lookbehind:!0,inside:{"interpolation-punctuation":{pattern:/^\$\{|\}$/,alias:"punctuation"},rest:m.languages.javascript}},string:/[\s\S]+/}},"string-property":{pattern:/((?:^|[,{])[ \t]*)(["'])(?:\\(?:\r\n|[\s\S])|(?!\2)[^\\\r\n])*\2(?=\s*:)/m,lookbehind:!0,greedy:!0,alias:"property"}});m.languages.insertBefore("javascript","operator",{"literal-property":{pattern:/((?:^|[,{])[ \t]*)(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*:)/m,lookbehind:!0,alias:"property"}});m.languages.markup&&(m.languages.markup.tag.addInlined("script","javascript"),m.languages.markup.tag.addAttribute(/on(?:abort|blur|change|click|composition(?:end|start|update)|dblclick|error|focus(?:in|out)?|key(?:down|up)|load|mouse(?:down|enter|leave|move|out|over|up)|reset|resize|scroll|select|slotchange|submit|unload|wheel)/.source,"javascript"));m.languages.js=m.languages.javascript;(function(){if(typeof m>"u"||typeof document>"u")return;Element.prototype.matches||(Element.prototype.matches=Element.prototype.msMatchesSelector||Element.prototype.webkitMatchesSelector);var t="Loading\u2026",e=function(E,T){return"\u2716 Error "+E+" while fetching file: "+T},r="\u2716 Error: File does not exist or is empty",a={js:"javascript",py:"python",rb:"ruby",ps1:"powershell",psm1:"powershell",sh:"bash",bat:"batch",h:"c",tex:"latex"},n="data-src-status",u="loading",b="loaded",d="failed",k="pre[data-src]:not(["+n+'="'+b+'"]):not(['+n+'="'+u+'"])';function x(E,T,R){var l=new XMLHttpRequest;l.open("GET",E,!0),l.onreadystatechange=function(){l.readyState==4&&(l.status<400&&l.responseText?T(l.responseText):l.status>=400?R(e(l.status,l.statusText)):R(r))},l.send(null)}function f(E){var T=/^\s*(\d+)\s*(?:(,)\s*(?:(\d+)\s*)?)?$/.exec(E||"");if(T){var R=Number(T[1]),l=T[2],i=T[3];return l?i?[R,Number(i)]:[R,void 0]:[R,R]}}m.hooks.add("before-highlightall",function(E){E.selector+=", "+k}),m.hooks.add("before-sanity-check",function(E){var T=E.element;if(T.matches(k)){E.code="",T.setAttribute(n,u);var R=T.appendChild(document.createElement("CODE"));R.textContent=t;var l=T.getAttribute("data-src"),i=E.language;if(i==="none"){var o=(/\.(\w+)$/.exec(l)||[,"none"])[1];i=a[o]||o}m.util.setLanguage(R,i),m.util.setLanguage(T,i);var p=m.plugins.autoloader;p&&p.loadLanguages(i),x(l,function(c){T.setAttribute(n,b);var g=f(T.getAttribute("data-range"));if(g){var v=c.split(/\r\n?|\n/g),h=g[0],F=g[1]==null?v.length:g[1];h<0&&(h+=v.length),h=Math.max(0,Math.min(h-1,v.length)),F<0&&(F+=v.length),F=Math.max(0,Math.min(F,v.length)),c=v.slice(h,F).join(`
+`),T.hasAttribute("data-start")||T.setAttribute("data-start",String(h+1))}R.textContent=c,m.highlightElement(R)},function(c){T.setAttribute(n,d),R.textContent=c})}}),m.plugins.fileHighlight={highlight:function(T){for(var R=(T||document).querySelectorAll(k),l=0,i;i=R[l++];)m.highlightElement(i)}};var A=!1;m.fileHighlight=function(){A||(console.warn("Prism.fileHighlight is deprecated. Use `Prism.plugins.fileHighlight.highlight` instead."),A=!0),m.plugins.fileHighlight.highlight.apply(this,arguments)}})()});var jr={};Gt(jr,{BUILD_ID:()=>Pr,TempleComponent:()=>D.TempleComponent,TempleElement:()=>D.TempleElement,TempleEmitter:()=>D.TempleEmitter,TempleException:()=>D.TempleException,TempleRegistry:()=>D.TempleRegistry,children:()=>D.children,components:()=>Cr,data:()=>D.data,emitter:()=>D.emitter,props:()=>D.props,signal:()=>D.signal});var N=S(I());var Ct=S(I()),O=S(H()),ne=class extends Ct.TempleComponent{static component=["layout","Layout_9f3ab204ce271feaf6f7"];styles(){return""}template(){(0,O.classlist)().add("relative","w-full","vh","scroll-hidden");let e=(0,O.children)(),r=e.find(f=>f.nodeName.endsWith("PANEL-MAIN")),a=e.find(f=>f.nodeName.endsWith("PANEL-HEAD")),n=e.find(f=>f.nodeName.endsWith("PANEL-FOOT")),u=e.find(f=>f.nodeName.endsWith("PANEL-LEFT")),b=e.find(f=>f.nodeName.endsWith("PANEL-RIGHT")),d={head:!!a,foot:!!n,left:!!u,right:!!b},k=new Set,x={left:!1,right:!1,change:f=>k.add(f)};return r&&O.TempleRegistry.get(r).setAttribute("show",x).setAttribute("layout",d),a&&O.TempleRegistry.get(a).setAttribute("show",x).setAttribute("layout",d),n&&O.TempleRegistry.get(n).setAttribute("show",x).setAttribute("layout",d),u&&O.TempleRegistry.get(u).setAttribute("show",x).setAttribute("layout",d),b&&O.TempleRegistry.get(b).setAttribute("show",x).setAttribute("layout",d),this.toggle=f=>{x[f]=!x[f],k.forEach(A=>A())},()=>[O.TempleRegistry.createText(`
+`,!1),...this._toNodeList(e)]}};var ve=S(I()),$e=S(H()),se=class extends ve.TempleComponent{static component=["head","Head_2bf4dff19bc88ba4138b"];styles(){return""}template(){let{layout:e,show:r}=this.element.attributes,a=(0,$e.classlist)(),n=u=>{this.classList.add("absolute","top-0","right-0","h-60","transition-500"),e?.left?(this.classList.remove("left-0"),this.classList.add("left-226")):this.classList.add("left-0"),r.left?(this.classList.remove("md-left-0"),this.classList.add("md-left-226")):(this.classList.remove("md-left-226"),this.classList.add("md-left-0"))};return r.change(n),n(),()=>[ve.TempleRegistry.createText(`
+`,!1),ve.TempleRegistry.createElement("header",{class:"block w-full h-full relative"},[...this._toNodeList((0,$e.children)())]).element]}};var Te=S(I()),Be=S(H()),ie=class extends Te.TempleComponent{static component=["left","Left_f4ab589e043eee17d229"];styles(){return""}template(){let{layout:e,show:r}=this.element.attributes,a=(0,Be.classlist)(),n=u=>{this.classList.add("w-226","absolute","bottom-0","left-0","top-0","transition-500"),r.left?(this.classList.remove("md-left--226"),this.classList.add("md-left-0")):this.classList.add("md-left--226")};return r.change(n),n(),()=>[Te.TempleRegistry.createText(`
+`,!1),Te.TempleRegistry.createElement("aside",{class:"block w-full h-full relative"},[...this._toNodeList((0,Be.children)())]).element]}};var _e=S(I()),He=S(H()),ae=class extends _e.TempleComponent{static component=["main","Main_847772763f4518728ede"];styles(){return""}template(){let{layout:e,show:r}=this.element.attributes,a=(0,He.classlist)(),n=u=>{this.classList.add("absolute","transition-500"),e?.head?(this.classList.remove("top-0"),this.classList.add("top-60")):this.classList.add("top-0"),e?.foot?(this.classList.remove("bottom-0"),this.classList.add("bottom-60")):this.classList.add("bottom-0"),e?.left?(this.classList.remove("left-0"),this.classList.add("left-226")):this.classList.add("left-0"),e?.right?(this.classList.remove("right-0"),this.classList.add("right-200")):this.classList.add("right-0"),r.left?(this.classList.remove("md-left-0"),this.classList.add("md-left-226")):(this.classList.remove("md-left-226"),this.classList.add("md-left-0")),r.right?(this.classList.remove("md-right-0"),this.classList.add("md-right-200")):(this.classList.remove("md-right-200"),this.classList.add("md-right-0"))};return r.change(n),n(),()=>[_e.TempleRegistry.createText(`
+`,!1),_e.TempleRegistry.createElement("main",{class:"block w-full h-full relative"},[...this._toNodeList((0,He.children)())]).element]}};var we=S(I()),qe=S(H()),le=class extends we.TempleComponent{static component=["docs","Docs_40562a7bb56d70d971df"];styles(){return""}template(){return(0,qe.classlist)().add("block","w-full","h-full","scroll-y-auto","scroll-x-hidden"),()=>[we.TempleRegistry.createText(`
+`,!1),we.TempleRegistry.createElement("article",{class:"block p-10 tx-t-1"},[...this._toNodeList((0,qe.children)())]).element]}};var s=S(I());var _=S(I()),it=S(st()),Pt=S(H()),Y=class extends _.TempleComponent{static component=["code","Code_6f36bc13bb6a166c7abc"];styles(){return`:host {
     display: block;
     font-size: 14px;
     line-height: 20px;
   }
   :host([inline]) {
-    display: inline;
+    display: inline !important;
   }
   :host([inline]),
   :host([inline]) > pre,
   :host([inline]) > pre > code {
-    display: inline;
+    display: inline !important;
   }
   .snippet {
     background-color: #000000;
     color: #ABB2BF;
+    height: 100%;
     margin: 0;
+    overflow: auto;
     padding: 0;
   }
 
@@ -73,23 +80,30 @@ var TempleAPI=(()=>{var vt=Object.create;var me=Object.defineProperty;var Tt=Obj
 
   .terminal {
     background-color: #000000;
+    font-family: 'Courier New', Courier, monospace;
     font-size: 15px;
+    height: 100%;
+    overflow: auto;
     padding: 10px;
   }
   .terminal span {
     color: #00FF00;
-  }`}template(){let e=this.props,{lang:r="markup",numbers:l=!1,inline:n=!1,trim:g=!1,ltrim:h=!1,rtrim:u=!1,detab:k=0}=e,x=(0,ht.children)(),_=x[0]?.textContent||"";k&&(_=_.replace(new RegExp(`\\n {${k}}`,"g"),`
-`)),g?_=_.trim():h?_=_.replace(/^\s+/,""):u&&(_=_.replace(/\s+$/,""));let F=A=>{if(!_)return;let v=Ne.default.highlight(_,Ne.default.languages[r],r);if(A.detail.target.innerHTML=v,l){let E=v.match(/\n(?!$)/g),a=E?E.length+1:1,s=new Array(a+1).join(""),o=document.createElement("span");o.setAttribute("aria-hidden","true"),o.className="line-numbers-rows",o.innerHTML=s,A.detail.target.appendChild(o)}};return()=>[T.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism.min.css"}).element,T.TempleRegistry.createText(`
-`,!1),T.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism-tomorrow.min.css"}).element,T.TempleRegistry.createText(`
-`,!1),...r==="bash"?[T.TempleRegistry.createText(`
-  `,!1),T.TempleRegistry.createElement("div",{class:"terminal"},[T.TempleRegistry.createElement("span",{},[T.TempleRegistry.createText("$",!1)]).element,T.TempleRegistry.createText(" ",!1),...this._toNodeList(x)]).element,T.TempleRegistry.createText(`
-`,!1)]:_?[,T.TempleRegistry.createText(`
-  `,!1),...l?[T.TempleRegistry.createText(`
-    `,!1),T.TempleRegistry.createElement("pre",{class:"snippet line-numbers"},[T.TempleRegistry.createElement("code",{mount:F},[]).element]).element,T.TempleRegistry.createText(`
-  `,!1)]:[,T.TempleRegistry.createText(`
-    `,!1),T.TempleRegistry.createElement("pre",{class:"snippet pad"},[T.TempleRegistry.createElement("code",{mount:F},[]).element]).element,T.TempleRegistry.createText(`
-  `,!1)],T.TempleRegistry.createText(`
-`,!1)]:[]]}};var i=I(z());var oe=I(_e());var le={Asset:{type:{kind:"property",list:!1,type:["text/html","text/javascript","text/css","text/plain"],description:"The MIME type of the build file asset"},content:{kind:"property",list:!1,type:"string",description:"The source code of the build file asset."}},Path:{path:{kind:"property",list:!1,type:"string",description:"The file path",example:"'/path/to/file'"},type:{kind:"property",list:!1,type:"string",description:"The type of path.",example:"'file'"}},Config:{brand:{kind:"property",list:!1,type:"string",description:"The brand prefixed before the component tag name.",example:"'temple'"},cwd:{kind:"property",list:!1,type:"string",description:"The project's current working directory (cwd).",example:"'/path/to/project'"},fs:{kind:"property",list:!1,type:"FileSystem",description:"The file system being used to read/write files.",example:`import fs from 'fs';
+  }`}template(){let e=this.props,{lang:r="markup",numbers:a=!1,inline:n=!1,trim:u=!1,ltrim:b=!1,rtrim:d=!1,detab:k=0}=e,x=(0,Pt.children)(),f=x[0]?.textContent||"";k&&(f=f.replace(new RegExp(`\\n {${k}}`,"g"),`
+`)),u?f=f.trim():b?f=f.replace(/^\s+/,""):d&&(f=f.replace(/\s+$/,""));let A=E=>{if(!f)return;let T=it.default.highlight(f,it.default.languages[r],r);if(E.detail.target.innerHTML=T,a){let R=T.match(/\n(?!$)/g),l=R?R.length+1:1,i=new Array(l+1).join(""),o=document.createElement("span");o.setAttribute("aria-hidden","true"),o.className="line-numbers-rows",o.innerHTML=i,E.detail.target.appendChild(o)}};return()=>[_.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism.min.css"}).element,_.TempleRegistry.createText(`
+`,!1),_.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism-tomorrow.min.css"}).element,_.TempleRegistry.createText(`
+`,!1),...r==="bash"?[_.TempleRegistry.createText(`
+  `,!1),_.TempleRegistry.createElement("div",{class:"terminal"},[_.TempleRegistry.createElement("span",{},[_.TempleRegistry.createText("$",!1)]).element,_.TempleRegistry.createText(" ",!1),...this._toNodeList(x)]).element,_.TempleRegistry.createText(`
+`,!1)]:f?[,_.TempleRegistry.createText(`
+  `,!1),...a?[_.TempleRegistry.createText(`
+    `,!1),_.TempleRegistry.createElement("pre",{class:"snippet line-numbers"},[_.TempleRegistry.createElement("code",{mount:A},[]).element]).element,_.TempleRegistry.createText(`
+  `,!1)]:[,_.TempleRegistry.createText(`
+    `,!1),_.TempleRegistry.createElement("pre",{class:"snippet pad"},[_.TempleRegistry.createElement("code",{mount:A},[]).element]).element,_.TempleRegistry.createText(`
+  `,!1)],_.TempleRegistry.createText(`
+`,!1)]:[,_.TempleRegistry.createText(`
+  `,!1),_.TempleRegistry.createElement("span",{},[_.TempleRegistry.createText("????",!1)]).element,_.TempleRegistry.createText(`
+`,!1)],_.TempleRegistry.createText(`
+
+`,!1)]}};var V=S(H());var Ae={Asset:{type:{kind:"property",list:!1,type:["text/html","text/javascript","text/css","text/plain"],description:"The MIME type of the build file asset"},content:{kind:"property",list:!1,type:"string",description:"The source code of the build file asset."}},Path:{path:{kind:"property",list:!1,type:"string",description:"The file path",example:"'/path/to/file'"},type:{kind:"property",list:!1,type:"string",description:"The type of path.",example:"'file'"}},Config:{brand:{kind:"property",list:!1,type:"string",description:"The brand prefixed before the component tag name.",example:"'temple'"},cwd:{kind:"property",list:!1,type:"string",description:"The project's current working directory (cwd).",example:"'/path/to/project'"},fs:{kind:"property",list:!1,type:"FileSystem",description:"The file system being used to read/write files.",example:`import fs from 'fs';
 
 fs`},emitter:{kind:"property",list:!1,type:"EventEmitter",description:"The NodeJS EventEmitter instance being used.",example:`import EventEmitter from 'events';
 
@@ -171,229 +185,207 @@ const compiler = temple({ emitter });'`},"minify?":{kind:"property",list:!1,type
   { href: '/' }
 ); ]`},TempleEmitter:{kind:"property",list:!1,type:"TempleEmitter",description:"The Temple emitter class used to create custom events.",example:"new TempleAPI.TempleEmitter();"},TempleException:{kind:"property",list:!1,type:"TempleException",description:"The Temple exception class used to create custom errors.",example:"throw TempleAPI.TempleException.for('error message');"},TempleRegistry:{kind:"property",list:!1,type:"TempleRegistry",description:"The Temple registry class used to store custom elements.",example:"new TempleAPI.TempleRegistry.createElement('a', { href: '/' });"},children:{kind:"function",args:[{kind:"property",list:!1,name:"component",type:"TempleComponent"}],returns:{kind:"property",list:!0,type:"Node"},description:"Returns an array of child nodes.",example:"TempleAPI.children(component); //--> [ Element, Text, Element, ... ]"},components:{kind:"property",list:!1,type:"Record",description:"Returns an object of Temple components classes used in the DOM.",example:"new TempleAPI.components['fancy-button']; //--> TempleComponent"},data:{kind:"property",list:!1,type:"TempleDataMap",description:"The Temple data map used to bring server side data to the client.",example:"TempleAPI.data.get('props');"},emitter:{kind:"property",list:!1,type:"TempleEmitter",description:"The Temple emitter class used to create custom events.",example:"TempleAPI.emitter.on('click', () => {});"},props:{kind:"function",args:[{kind:"property",list:!1,name:"component",type:"TempleComponent"}],returns:{kind:"property",list:!0,type:"Hash"},description:"Returns an object of component attributes",example:"TempleAPI.props(component); //--> { foo: 'bar', count: 4 }"},signal:{kind:"function",args:[{kind:"property",list:!1,name:"component",type:"TempleComponent"}],returns:{kind:"property",list:!1,type:"Signal"},description:"Returns a signal object used to re-render components whenever its value changes",example:"const count = TempleAPI.signal(1, component)"}},"Render Methods":{asset:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"assetFile",type:"string"}],returns:{kind:"property",list:!1,type:"Asset"},description:"Returns a compiled build asset, given an asset file name.",example:"await compiler.asset('abc123.css'); //--> { type: 'text/css', content: '...' }"},client:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"sourceFile",type:"string"}],returns:{kind:"property",list:!1,type:"string"},description:"Returns a compiled client script, given the the template source file.",example:"await compiler.client('./docs/api.dtml'); //client script"},markup:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"sourceFile",type:"string"}],returns:{kind:"property",list:!1,type:"string"},description:"Returns a compiled markup, given the the template source file.",example:"await compiler.markup('./docs/api.dtml'); //--> ..."},render:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"sourceFile",type:"string"},{kind:"property",list:!1,name:"props",type:"Hash"}],returns:{kind:"property",list:!1,type:"string"},description:"Returns the final HTML markup, given the the template source file.",example:`await compiler.render('./docs/api.dtml', {
   title: 'API Documentation'
-});`},server:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"sourceFile",type:"string"}],returns:{kind:"property",list:!1,type:"string"},description:"Returns compiled server code, given the the template source file.",example:"await compiler.server('./docs/api.dtml'); // server script"},styles:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"sourceFile",type:"string"}],returns:{kind:"property",list:!1,type:"string"},description:"Returns compiled css styles, given the the template source file.",example:"await compiler.styles('./docs/api.dtml'); //css styles"}}};var Z=class extends i.TempleComponent{static component=["ui","Ui_dcdb1ec28ab9a6dac63a"];styles(){return`:host {
-    border-radius: 5px;
-    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
+});`},server:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"sourceFile",type:"string"}],returns:{kind:"property",list:!1,type:"string"},description:"Returns compiled server code, given the the template source file.",example:"await compiler.server('./docs/api.dtml'); // server script"},styles:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"sourceFile",type:"string"}],returns:{kind:"property",list:!1,type:"string"},description:"Returns compiled css styles, given the the template source file.",example:"await compiler.styles('./docs/api.dtml'); //css styles"}},DeveloperOptions:{"cwd?":{kind:"property",list:!1,type:"string",description:"The current working directory",example:"const { refresh, router } = dev({ cwd: process.cwd() })"},"emitter?":{kind:"property",list:!1,type:"EventEmitter",description:"The NodeJS EventEmitter instance being used.",example:`import emitter from 'events';
+
+const { refresh, router } = dev({ emitter });'`},"include?":{kind:"property",list:!0,type:"string",description:"An array of extension names to watch for",example:"const { refresh, router } = dev({ include: [ '.js', '.ts', '.tml', '.dtml' ] });'"},"ignore?":{kind:"property",list:!0,type:"(string|RegExp)",description:"An array of extension names to ignore",example:"const { refresh, router } = dev({ ignore: [ '*.test.*' ] });'"},"route?":{kind:"property",list:!1,type:"string",description:"The route path to use for the client watcher",example:"const { refresh, router } = dev({ route: '/__temple_dev__' })"},"tsconfig?":{kind:"property",list:!1,type:"string",description:"The path to the tsconfig.json file",example:"const { refresh, router } = dev({ tsconfig: '/path/to/tsconfig.json' })"},"extname?":{kind:"property",list:!1,type:"string",description:"the component file extension",example:"const { refresh, router } = dev({ extname: '.tml' })"}},RefreshServer:{cwd:{kind:"property",list:!1,type:"string",description:"The current working directory",example:"refresh.cwd"},emitter:{kind:"property",list:!1,type:"EventEmitter",description:"The NodeJS EventEmitter instance being used.",example:`refresh.emitter.on('render', e => {
+  console.log(e.params);
+});`},sync:{kind:"function",args:[{kind:"property",name:"builder",list:!1,type:"DocumentBuilder"}],returns:{kind:"property",list:!1,type:"void"},description:"Registers a document builder to a client watcher list",example:`refresh.emitter.on('render', e => {
+  console.log(e.params);
+});`},close:{kind:"function",args:[],returns:{kind:"property",list:!1,type:"RefreshServer"},description:"Closes the server and stops the watchers.",example:"refresh.close();"},refresh:{kind:"function",args:[{kind:"property",list:!1,name:"filePath",type:"string"}],returns:{kind:"property",list:!1,type:"Promise"},description:"Whenever a file is changed this will be called to instruct each client watcher how to update their document.",example:"await refresh.refresh('/some/file.tml');"},wait:{kind:"function",args:[{kind:"property",list:!1,name:"req",type:"Request"},{kind:"property",list:!1,name:"res",type:"Response"}],returns:{kind:"property",list:!1,type:"RefreshServer"},description:"Opens a connection to the server via SSE and waits for changes.",example:"refresh.wait(req, res);"},watch:{kind:"function",args:[],returns:{kind:"property",list:!1,type:"RefreshServer"},description:"Starts the server that watches for file changes.",example:"refresh.watch();"}},"Developer Tools":{refresh:{kind:"property",list:!1,type:"RefreshServer",description:"The refresh server instance used to update clients.",example:`const { refresh } = dev();
+refresh.sync(builder);`},router:{kind:"property",list:!1,type:"Function",description:"HTTP middleware to handle developer tool routes like '/dev.js' and '/__temple_dev__'.",example:`const { router } = dev();
+app.use(router);`}},"Express Developer Tools":{refresh:{kind:"property",list:!1,type:"RefreshServer",description:"The refresh server instance used to update clients.",example:`const { refresh } = dev();
+refresh.sync(builder);`},router:{kind:"property",list:!1,type:"Function",description:"Express middleware to handle developer tool routes like '/dev.js' and '/__temple_dev__'.",example:`const { router } = dev();
+app.use(router);`},view:{kind:"property",list:!1,type:"Function",description:"Middleware used to setup an express view engine.",example:`const { view } = dev();
+app.engine('dtml', view(compiler));`}}};var oe=class extends s.TempleComponent{static component=["ui","Ui_0ec6f6ca4b362d125365"];styles(){return""}template(){(0,V.classlist)().add("block","my-40","scroll-hidden","curved","shadow-0-0-10-0-0-0-5");let{start:e="TempleCompiler"}=(0,V.props)(),r=(0,V.signal)([e]),a=(0,V.signal)(e),n=b=>{let d=b.target.getAttribute("data-type");r.value=[...r.value,d],a.value=d},u=()=>{r.value=r.value.slice(0,r.value.length-1),a.value=r.value[r.value.length-1]};return()=>[s.TempleRegistry.createText(`
+`,!1),s.TempleRegistry.createElement("h3",{class:"tx-secondary bg-t-2 tx-16 m-0 p-10"},[s.TempleRegistry.createText(`
+  `,!1),...r.value.length>1?[s.TempleRegistry.createText(`
+    `,!1),s.TempleRegistry.createElement("a",{class:"tx-t-1 cursor-pointer",click:u},[s.TempleRegistry.createText(`
+      `,!1),s.TempleRegistry.createElement("i",{class:"fas fa-arrow-left"},[]).element,s.TempleRegistry.createText(`
+    `,!1)]).element,s.TempleRegistry.createText(`
+  `,!1)]:[],s.TempleRegistry.createText(`
+  API: `,!1),...this._toNodeList(a.value),s.TempleRegistry.createText(`
+`,!1)]).element,s.TempleRegistry.createText(`
+`,!1),s.TempleRegistry.createElement("div",{class:"bg-t-0 p-10"},[s.TempleRegistry.createText(`
+  `,!1),s.TempleRegistry.createElement("div",{class:"relative mb-20 scroll-auto"},[s.TempleRegistry.createText(`
+    `,!1),s.TempleRegistry.createElement("table",{class:"w-full bd-collapse"},[s.TempleRegistry.createText(`
+      `,!1),s.TempleRegistry.createElement("thead",{},[s.TempleRegistry.createText(`
+        `,!1),s.TempleRegistry.createElement("th",{class:"p-10 tx-left tx-uppercase"},[s.TempleRegistry.createText("Property",!1)]).element,s.TempleRegistry.createText(`
+        `,!1),...a.value.includes("Emitter")?[]:[s.TempleRegistry.createText(`
+          `,!1),s.TempleRegistry.createElement("th",{class:"p-10 tx-left tx-uppercase"},[s.TempleRegistry.createText("Returns",!1)]).element,s.TempleRegistry.createText(`
+        `,!1)],s.TempleRegistry.createText(`
+        `,!1),s.TempleRegistry.createElement("th",{class:"p-10 tx-left tx-uppercase"},[s.TempleRegistry.createText("Description",!1)]).element,s.TempleRegistry.createText(`
+      `,!1)]).element,s.TempleRegistry.createText(`
+      `,!1),s.TempleRegistry.createElement("tbody",{},[s.TempleRegistry.createText(`
+        `,!1),...Object.entries(Ae[a.value]).map(([b,d])=>[s.TempleRegistry.createText(`
+          `,!1),s.TempleRegistry.createElement("tr",{},[s.TempleRegistry.createText(`
+            `,!1),...d.kind==="property"?[s.TempleRegistry.createText(`
+              `,!1),s.TempleRegistry.createElement("td",{class:"tx-primary tx-top tx-nowrap bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10"},[s.TempleRegistry.createText(`
+                `,!1),...this._toNodeList(b),s.TempleRegistry.createText(`
+              `,!1)]).element,s.TempleRegistry.createText(`
+              `,!1),...Ae[d.type]?[s.TempleRegistry.createText(`
+                `,!1),s.TempleRegistry.createElement("td",{class:"tx-top tx-nowrap bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10"},[s.TempleRegistry.createText(`
+                  `,!1),s.TempleRegistry.createElement("a",{"data-type":d.type,click:n},[s.TempleRegistry.createText(`
+                    `,!1),...this._toNodeList(d.type),s.TempleRegistry.createText(`
+                  `,!1)]).element,...this._toNodeList(d.list?"[]":""),s.TempleRegistry.createText(`
+                `,!1)]).element,s.TempleRegistry.createText(`
+              `,!1)]:[,s.TempleRegistry.createText(`
+                `,!1),s.TempleRegistry.createElement("td",{class:"tx-top tx-nowrap bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10"},[s.TempleRegistry.createText(`
+                  `,!1),...this._toNodeList(d.type),...this._toNodeList(d.list?"[]":""),s.TempleRegistry.createText(`
+                `,!1)]).element,s.TempleRegistry.createText(`
+              `,!1)],s.TempleRegistry.createText(`
+            `,!1)]:d.kind==="function"?[,s.TempleRegistry.createText(`
+              `,!1),s.TempleRegistry.createElement("td",{class:"tx-primary tx-top bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10",nowrap:!0},[s.TempleRegistry.createText(`
+                `,!1),...this._toNodeList(b),s.TempleRegistry.createText(`(
+                  `,!1),...Object.entries(d.args).map(([k,x])=>[s.TempleRegistry.createText(`
+                    `,!1),...k>0?[s.TempleRegistry.createText(", ",!1)]:[],s.TempleRegistry.createText(`
+                    `,!1),...this._toNodeList(x.name),s.TempleRegistry.createText(`: 
+                    `,!1),...Ae[x.type]?[s.TempleRegistry.createText(`
+                      `,!1),s.TempleRegistry.createElement("a",{"data-type":x.type,click:n},[s.TempleRegistry.createText(`
+                        `,!1),...this._toNodeList(x.type),s.TempleRegistry.createText(`
+                      `,!1)]).element,...this._toNodeList(x.list?"[]":""),s.TempleRegistry.createText(`
+                    `,!1)]:[,s.TempleRegistry.createText(`
+                      `,!1),...this._toNodeList(x.type),...this._toNodeList(x.list?"[]":""),s.TempleRegistry.createText(`
+                    `,!1)],s.TempleRegistry.createText(`
+                  `,!1)]).flat(),s.TempleRegistry.createText(`
+                )
+              `,!1)]).element,s.TempleRegistry.createText(`
+              `,!1),...Ae[d.returns.type]?[s.TempleRegistry.createText(`
+                `,!1),s.TempleRegistry.createElement("td",{class:"tx-top tx-nowrap bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10"},[s.TempleRegistry.createText(`
+                  `,!1),s.TempleRegistry.createElement("a",{"data-type":d.returns.type,click:n},[s.TempleRegistry.createText(`
+                    `,!1),...this._toNodeList(d.returns.type),s.TempleRegistry.createText(`
+                  `,!1)]).element,...this._toNodeList(d.returns.list?"[]":""),s.TempleRegistry.createText(`
+                `,!1)]).element,s.TempleRegistry.createText(`
+              `,!1)]:[,s.TempleRegistry.createText(`
+                `,!1),s.TempleRegistry.createElement("td",{class:"tx-top tx-nowrap bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10"},[s.TempleRegistry.createText(`
+                  `,!1),...this._toNodeList(d.returns.type),...this._toNodeList(d.returns.list?"[]":""),s.TempleRegistry.createText(`
+                `,!1)]).element,s.TempleRegistry.createText(`
+              `,!1)],s.TempleRegistry.createText(`
+            `,!1)]:d.kind==="event"?[,s.TempleRegistry.createText(`
+              `,!1),s.TempleRegistry.createElement("td",{class:"tx-primary tx-top bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10",nowrap:!0},[s.TempleRegistry.createText(`
+                `,!1),...this._toNodeList(`on('${b}', (event: Event) => void)`),s.TempleRegistry.createText(`
+              `,!1)]).element,s.TempleRegistry.createText(`
+            `,!1)]:[],s.TempleRegistry.createText(`
+            `,!1),s.TempleRegistry.createElement("td",{class:"tx-top tx-lh-24 bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10"},[s.TempleRegistry.createText(`
+              `,!1),...d.description?[s.TempleRegistry.createText(`
+                `,!1),s.TempleRegistry.createElement("p",{class:"pb-10"},[...this._toNodeList(d.description)]).element,s.TempleRegistry.createText(`
+                `,!1),...d.example?[s.TempleRegistry.createText(`
+                  `,!1),s.TempleRegistry.createElement("h5",{},[s.TempleRegistry.createText("Example",!1)]).element,s.TempleRegistry.createText(`
+                  `,!1),s.TempleRegistry.createComponent("api-ide-code",Y,{lang:"js"},[...this._toNodeList(d.example)]).element,s.TempleRegistry.createText(` 
+                `,!1)]:[],s.TempleRegistry.createText(`
+              `,!1)]:[],s.TempleRegistry.createText(`
+            `,!1)]).element,s.TempleRegistry.createText(`
+          `,!1)]).element,s.TempleRegistry.createText(`
+        `,!1)]).flat(),s.TempleRegistry.createText(`
+      `,!1)]).element,s.TempleRegistry.createText(`
+    `,!1)]).element,s.TempleRegistry.createText(`
+  `,!1)]).element,s.TempleRegistry.createText(`
+`,!1)]).element]}};var w=S(I()),at=S(st()),jt=S(H()),pe=class extends w.TempleComponent{static component=["code","Code_5294df1c620ef5ddbd2f"];styles(){return`:host {
     display: block;
-    margin: 40px 0;
-    overflow: hidden;
-  }
-  a {
-    color: #007BFF;
-    cursor: pointer;
-  }
-  th {
-    padding: 10px;
-    text-align: left;
-    text-transform: uppercase;
-  }
-  td {
-    border-color: #666666;
-    border-top-style: solid;
-    border-top-width: 1px;
-    padding: 10px;
+    font-size: 14px;
+    line-height: 20px;
   }
-  .tbl-container {
-    position: relative;
-    margin-bottom: 20px;
-    overflow: auto;
+  :host([inline]) {
+    display: inline !important;
   }
-  .tbl {
-    border-collapse: collapse;
-    display: table;
-    width: 100%;
+  :host([inline]),
+  :host([inline]) > pre,
+  :host([inline]) > pre > code {
+    display: inline !important;
   }
-
-  .tbl-scroll {
-    overflow: auto;
-    flex-grow: 1;
+  .snippet {
+    background-color: #000000;
+    color: #ABB2BF;
     height: 100%;
-    width: 100%;
-  }
-
-  .tbl-valign="top" nowrap {
-    white-space: valign="top" nowrap;
+    margin: 0;
+    padding: 0;
   }
 
-  .tbl-z0 {
-    z-index: 0;
-  }
-  .tbl-z1 {
-    z-index: 1;
-  }
-  .tbl-z2 {
-    z-index: 2;
-  }
-  .tbl-z3 {
-    z-index: 3;
+  .line-numbers {
+    position: relative;
+    padding-left: 3.8em;
+    counter-reset: linenumber;
   }
-  .tbl-z4 {
-    z-index: 4;
+  :host([inline]) .line-numbers {
+    position: static;
+    padding-left: 0;
   }
 
-  .tbl-sticky {
-    position: sticky;
-  }
-  .tbl-sticky-b {
-    bottom: 0;
-  }
-  .tbl-sticky-l {
-    left: 0;
+  .line-numbers > code {
+    position: relative;
+    white-space: inherit;
   }
-  .tbl-sticky-t {
+
+  .line-numbers .line-numbers-rows {
+    position: absolute;
+    pointer-events: none;
     top: 0;
-  }
-  .tbl-sticky-r {
-    right: 0;
-  }
+    font-size: 100%;
+    left: -3.8em;
+    width: 3em; /* works for line-numbers below 1000 lines */
+    letter-spacing: -1px;
+    border-right: 1px solid #999;
 
-  .tbl-col {
-    border-color: black;
-    border-style: solid;
-    border-top-width: 1px;
-    padding-bottom: 16px;
-    padding-left: 12px;
-    padding-right: 12px;
-    padding-top: 16px;
-  }
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
 
-  .tbl-foot {
-    border-color: black;
-    border-style: solid;
-    border-top-width: 1px;
-    padding-bottom: 16px;
-    padding-left: 12px;
-    padding-right: 12px;
-    padding-top: 16px;
   }
 
-  .tbl-row {
-    padding-bottom: 16px;
-    padding-left: 12px;
-    padding-right: 12px;
-    padding-top: 16px;
+  :host([inline]) .line-numbers .line-numbers-rows {
+    display: none;
   }
 
-  .tbl-head {
-    border-color: black;
-    border-style: solid;
-    border-top-width: 1px;
-    padding-bottom: 16px;
-    padding-left: 12px;
-    padding-right: 12px;
-    padding-top: 16px;
+  .line-numbers-rows > span {
+    display: block;
+    counter-increment: linenumber;
   }
 
-  tr td:first-child {
-    color: #E49F1A;
+  .line-numbers-rows > span:before {
+    content: counter(linenumber);
+    color: #999;
+    display: block;
+    padding-right: 0.8em;
+    text-align: right;
+  }
+  .pad {
+    padding: 5px;
   }
 
-  h3 {
-    color: #DA532C;
-    background: #1A1A1A;
-    border-bottom: 1px solid #29252A;
-    font-size: 16px;
-    margin: 0;
+  .terminal {
+    background-color: #000000;
+    font-family: 'Courier New', Courier, monospace;
+    font-size: 15px;
+    height: 100%;
     padding: 10px;
   }
-  h5 {
-    font-weight: normal;
-    margin: 15px 0 5px;
-    text-transform: uppercase;
-  }
-  td p {
-    margin: 0 0 10px;
-  }
-  .container {
-    background-color: #020202;
-    padding: 10px;
-  }`}template(){let{start:e="TempleCompiler"}=(0,oe.props)(),r=(0,oe.signal)([e]),l=(0,oe.signal)(e),n=h=>{let u=h.target.getAttribute("data-type");r.value=[...r.value,u],l.value=u},g=()=>{r.value=r.value.slice(0,r.value.length-1),l.value=r.value[r.value.length-1]};return()=>[i.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/fontawesome/all.css"}).element,i.TempleRegistry.createText(`
-`,!1),i.TempleRegistry.createElement("div",{},[i.TempleRegistry.createText(`
-  `,!1),i.TempleRegistry.createElement("h3",{},[i.TempleRegistry.createText(`
-    `,!1),...r.value.length>1?[i.TempleRegistry.createText(`
-      `,!1),i.TempleRegistry.createElement("a",{click:g},[i.TempleRegistry.createText(`
-        `,!1),i.TempleRegistry.createElement("i",{class:"fas fa-arrow-left"},[]).element,i.TempleRegistry.createText(`
-      `,!1)]).element,i.TempleRegistry.createText(`
-    `,!1)]:[],i.TempleRegistry.createText(`
-    API: `,!1),...this._toNodeList(l.value),i.TempleRegistry.createText(`
-  `,!1)]).element,i.TempleRegistry.createText(`
-  `,!1),i.TempleRegistry.createElement("div",{class:"container"},[i.TempleRegistry.createText(`
-    `,!1),i.TempleRegistry.createElement("div",{class:"tbl-container"},[i.TempleRegistry.createText(`
-      `,!1),i.TempleRegistry.createElement("table",{class:"tbl"},[i.TempleRegistry.createText(`
-        `,!1),i.TempleRegistry.createElement("thead",{},[i.TempleRegistry.createText(`
-          `,!1),i.TempleRegistry.createElement("th",{},[i.TempleRegistry.createText("Property",!1)]).element,i.TempleRegistry.createText(`
-          `,!1),...l.value.includes("Emitter")?[]:[i.TempleRegistry.createText(`
-            `,!1),i.TempleRegistry.createElement("th",{},[i.TempleRegistry.createText("Returns",!1)]).element,i.TempleRegistry.createText(`
-          `,!1)],i.TempleRegistry.createText(`
-          `,!1),i.TempleRegistry.createElement("th",{},[i.TempleRegistry.createText("Description",!1)]).element,i.TempleRegistry.createText(`
-        `,!1)]).element,i.TempleRegistry.createText(`
-        `,!1),i.TempleRegistry.createElement("tbody",{},[i.TempleRegistry.createText(`
-          `,!1),...Object.entries(le[l.value]).map(([h,u])=>[i.TempleRegistry.createText(`
-            `,!1),i.TempleRegistry.createElement("tr",{},[i.TempleRegistry.createText(`
-              `,!1),...u.kind==="property"?[i.TempleRegistry.createText(`
-                `,!1),i.TempleRegistry.createElement("td",{valign:"top",nowrap:!0},[...this._toNodeList(h)]).element,i.TempleRegistry.createText(`
-                `,!1),...le[u.type]?[i.TempleRegistry.createText(`
-                  `,!1),i.TempleRegistry.createElement("td",{valign:"top",nowrap:!0},[i.TempleRegistry.createText(`
-                    `,!1),i.TempleRegistry.createElement("a",{"data-type":u.type,click:n},[i.TempleRegistry.createText(`
-                      `,!1),...this._toNodeList(u.type),i.TempleRegistry.createText(`
-                    `,!1)]).element,...this._toNodeList(u.list?"[]":""),i.TempleRegistry.createText(`
-                  `,!1)]).element,i.TempleRegistry.createText(`
-                `,!1)]:[,i.TempleRegistry.createText(`
-                  `,!1),i.TempleRegistry.createElement("td",{valign:"top",nowrap:!0},[...this._toNodeList(u.type),...this._toNodeList(u.list?"[]":"")]).element,i.TempleRegistry.createText(`
-                `,!1)],i.TempleRegistry.createText(`
-              `,!1)]:u.kind==="function"?[,i.TempleRegistry.createText(`
-                `,!1),i.TempleRegistry.createElement("td",{valign:"top",nowrap:!0},[i.TempleRegistry.createText(`
-                  `,!1),...this._toNodeList(h),i.TempleRegistry.createText(`(
-                    `,!1),...Object.entries(u.args).map(([k,x])=>[i.TempleRegistry.createText(`
-                      `,!1),...k>0?[i.TempleRegistry.createText(", ",!1)]:[],i.TempleRegistry.createText(`
-                      `,!1),...this._toNodeList(x.name),i.TempleRegistry.createText(`: 
-                      `,!1),...le[x.type]?[i.TempleRegistry.createText(`
-                        `,!1),i.TempleRegistry.createElement("a",{"data-type":x.type,click:n},[i.TempleRegistry.createText(`
-                          `,!1),...this._toNodeList(x.type),i.TempleRegistry.createText(`
-                        `,!1)]).element,...this._toNodeList(x.list?"[]":""),i.TempleRegistry.createText(`
-                      `,!1)]:[,i.TempleRegistry.createText(`
-                        `,!1),...this._toNodeList(x.type),...this._toNodeList(x.list?"[]":""),i.TempleRegistry.createText(`
-                      `,!1)],i.TempleRegistry.createText(`
-                    `,!1)]).flat(),i.TempleRegistry.createText(`
-                  )
-                `,!1)]).element,i.TempleRegistry.createText(`
-                `,!1),...le[u.returns.type]?[i.TempleRegistry.createText(`
-                  `,!1),i.TempleRegistry.createElement("td",{valign:"top",nowrap:!0},[i.TempleRegistry.createText(`
-                    `,!1),i.TempleRegistry.createElement("a",{"data-type":u.returns.type,click:n},[i.TempleRegistry.createText(`
-                      `,!1),...this._toNodeList(u.returns.type),i.TempleRegistry.createText(`
-                    `,!1)]).element,...this._toNodeList(u.returns.list?"[]":""),i.TempleRegistry.createText(`
-                  `,!1)]).element,i.TempleRegistry.createText(`
-                `,!1)]:[,i.TempleRegistry.createText(`
-                  `,!1),i.TempleRegistry.createElement("td",{valign:"top",nowrap:!0},[...this._toNodeList(u.returns.type),...this._toNodeList(u.returns.list?"[]":"")]).element,i.TempleRegistry.createText(`
-                `,!1)],i.TempleRegistry.createText(`
-              `,!1)]:u.kind==="event"?[,i.TempleRegistry.createText(`
-                `,!1),i.TempleRegistry.createElement("td",{valign:"top",nowrap:!0},[...this._toNodeList(`on('${h}', (event: Event) => void)`)]).element,i.TempleRegistry.createText(`
-              `,!1)]:[],i.TempleRegistry.createText(`
-              `,!1),i.TempleRegistry.createElement("td",{},[i.TempleRegistry.createText(`
-                `,!1),...u.description?[i.TempleRegistry.createText(`
-                  `,!1),i.TempleRegistry.createElement("p",{},[...this._toNodeList(u.description)]).element,i.TempleRegistry.createText(`
-                  `,!1),...u.example?[i.TempleRegistry.createText(`
-                    `,!1),i.TempleRegistry.createElement("h5",{},[i.TempleRegistry.createText("Example",!1)]).element,i.TempleRegistry.createText(`
-                    `,!1),i.TempleRegistry.createComponent("ide-code",N,{lang:"js"},[...this._toNodeList(u.example)]).element,i.TempleRegistry.createText(` 
-                  `,!1)]:[],i.TempleRegistry.createText(`
-                `,!1)]:[],i.TempleRegistry.createText(`
-              `,!1)]).element,i.TempleRegistry.createText(`
-            `,!1)]).element,i.TempleRegistry.createText(`
-          `,!1)]).flat(),i.TempleRegistry.createText(`
-        `,!1)]).element,i.TempleRegistry.createText(`
-      `,!1)]).element,i.TempleRegistry.createText(`
-    `,!1)]).element,i.TempleRegistry.createText(`
-  `,!1)]).element,i.TempleRegistry.createText(`
-`,!1)]).element]}};var P=I(z());var Be=function(t,...e){let r=He(t);for(let l=0;l[P.TempleRegistry.createText(`
-    `,!1),...r?[P.TempleRegistry.createText(`
-      `,!1),P.TempleRegistry.createElement("p",{},[...this._toNodeList(_)]).element,P.TempleRegistry.createText(`
-    `,!1)]:l?[,P.TempleRegistry.createText(`
-      `,!1),P.TempleRegistry.createElement("li",{},[...this._toNodeList(_)]).element,P.TempleRegistry.createText(`
-    `,!1)]:n?[,P.TempleRegistry.createText(`
-      `,!1),P.TempleRegistry.createElement("div",{},[...this._toNodeList(_)]).element,P.TempleRegistry.createText(`
-    `,!1)]:[,P.TempleRegistry.createText(`
-      `,!1),...this._toNodeList(_),P.TempleRegistry.createText(`
-    `,!1)]]}};var R=I(z());j.emitter.once("ready",()=>{let t=document.querySelector("script[data-app]");if(!t)throw j.TempleException.for("APP_DATA not found");try{let h=atob(t.getAttribute("data-app"));window.__APP_DATA__=JSON.parse(h),Object.entries(window.__APP_DATA__).forEach(([u,k])=>{j.data.set(u,k)})}catch{throw j.TempleException.for("APP_DATA is not a valid JSON")}j.data.set("current","document");let e="/docs/compiler-api.html",r=Be("Compiler API - Temple reactive web component template engine."),l=Be("Compiler documentation for Temple."),n=h=>{document.body.classList.toggle("panel-left-open")};j.data.delete("current");let g={0:{class:"head panel-head"},1:{class:"menu fas fa-fw fa-bars",click:n},2:{href:"/temple"},3:{src:"/temple/temple-icon.png",alt:"Temple Logo"},5:{class:"tx-white",href:"/temple"},7:{class:"tx-white",href:"/temple/docs/index.html"},8:{class:"github",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},9:{class:"fab fa-github"},10:{class:"npm",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},11:{class:"fab fa-npm text-white"},12:{class:"discord",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},13:{class:"fab fa-discord text-white"},14:{class:"left panel-left"},16:{href:"/temple"},17:{src:"/temple/temple-icon.png",alt:"Temple Logo"},19:{class:"tx-white",href:"/temple"},20:{class:"toggle fas fa-fw fa-chevron-left",click:n},23:{href:"/temple/docs/index.html"},24:{href:"/temple/docs/getting-started.html"},26:{href:"/temple/docs/markup-syntax.html"},27:{href:"/temple/docs/state-management.html"},28:{href:"/temple/docs/component-strategy.html"},29:{href:"/temple/docs/compiler-api.html"},30:{href:"/temple/docs/client-api.html"},32:{href:"/temple/docs/template-engine.html"},33:{href:"/temple/docs/single-page.html"},34:{href:"/temple/docs/static-site.html"},35:{href:"/temple/docs/component-publisher.html"},36:{href:"/temple/docs/developer-tools.html"},37:{class:"panel-main"},38:{class:"docs container"},40:{p:!0,trim:!0},41:{lang:"js",trim:!0,detab:10},42:{p:!0,trim:!0},43:{lang:"js",inline:!0},44:{start:"TempleOptions"},45:{p:!0,trim:!0},46:{lang:"js",inline:!0},47:{lang:"js",inline:!0},49:{class:"pager"},50:{class:"prev",href:"/temple/docs/component-strategy.html"},51:{class:"fas fa-fw fa-chevron-left"},52:{class:"next",href:"/temple/docs/client-api.html"},53:{class:"fas fa-fw fa-chevron-right"},54:{class:"foot"}};for(let h of document.body.querySelectorAll("*")){let u=Object.fromEntries(Array.from(h.attributes).map(x=>[x.nodeName,x.nodeValue.length>0?x.nodeValue:!0])),k=String(j.TempleRegistry.elements.size);g[k]&&(Object.assign(u,g[k]),h.TempleAttributes=g[k]),j.TempleRegistry.register(h,u)}customElements.define("panel-main",W),customElements.define("ide-code",N),customElements.define("api-ui",Z),customElements.define("i18n-translate",X),j.emitter.emit("mounted",document.body)});var nr={PanelMain_fd7f1af6410c5b5c8e1f:W,IdeCode_6f36bc13bb6a166c7abc:N,ApiUi_dcdb1ec28ab9a6dac63a:Z,I18nTranslate_7d25e372f5ffb5e39dad:X},ir="38ccffadc3c6e8b93d28";return Ft(sr);})();
+  .terminal span {
+    color: #00FF00;
+  }`}template(){let e=this.props,{lang:r="markup",numbers:a=!1,inline:n=!1,trim:u=!1,ltrim:b=!1,rtrim:d=!1,detab:k=0}=e,x=(0,jt.children)(),f=x[0]?.textContent||"";k&&(f=f.replace(new RegExp(`\\n {${k}}`,"g"),`
+`)),u?f=f.trim():b?f=f.replace(/^\s+/,""):d&&(f=f.replace(/\s+$/,""));let A=E=>{if(!f)return;let T=at.default.highlight(f,at.default.languages[r],r);if(E.detail.target.innerHTML=T,a){let R=T.match(/\n(?!$)/g),l=R?R.length+1:1,i=new Array(l+1).join(""),o=document.createElement("span");o.setAttribute("aria-hidden","true"),o.className="line-numbers-rows",o.innerHTML=i,E.detail.target.appendChild(o)}};return()=>[w.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism.min.css"}).element,w.TempleRegistry.createText(`
+`,!1),w.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism-tomorrow.min.css"}).element,w.TempleRegistry.createText(`
+`,!1),...r==="bash"?[w.TempleRegistry.createText(`
+  `,!1),w.TempleRegistry.createElement("div",{class:"terminal"},[w.TempleRegistry.createElement("span",{},[w.TempleRegistry.createText("$",!1)]).element,w.TempleRegistry.createText(" ",!1),...this._toNodeList(x)]).element,w.TempleRegistry.createText(`
+`,!1)]:f?[,w.TempleRegistry.createText(`
+  `,!1),...a?[w.TempleRegistry.createText(`
+    `,!1),w.TempleRegistry.createElement("pre",{class:"snippet line-numbers"},[w.TempleRegistry.createElement("code",{mount:A},[]).element]).element,w.TempleRegistry.createText(`
+  `,!1)]:[,w.TempleRegistry.createText(`
+    `,!1),w.TempleRegistry.createElement("pre",{class:"snippet pad"},[w.TempleRegistry.createElement("code",{mount:A},[]).element]).element,w.TempleRegistry.createText(`
+  `,!1)],w.TempleRegistry.createText(`
+`,!1)]:[,w.TempleRegistry.createText(`
+  `,!1),w.TempleRegistry.createElement("span",{},[w.TempleRegistry.createText("????",!1)]).element,w.TempleRegistry.createText(`
+`,!1)],w.TempleRegistry.createText(`
+
+`,!1)]}};var M=S(I());var Mt=function(t){return t};var Je=S(H()),ce=class extends M.TempleComponent{static component=["translate","Translate_0014b007fc91289b2776"];styles(){return""}template(){let{trim:e=!1,p:r=!1,li:a=!1,div:n=!1}=(0,Je.props)(),u=(0,Je.children)(),b=[],d=[];for(let A of u)typeof A=="string"?b.push(A):A instanceof Node&&A.textContent?b.push(A.textContent):(b.push("%s"),d.push(A));let k=b.join("");e&&(k=k.replace(/\s+/," ").trim());let x=Mt(k).split("%s"),f=[];for(let A=0;A[M.TempleRegistry.createText(`
+    `,!1),...r?[M.TempleRegistry.createText(`
+      `,!1),M.TempleRegistry.createElement("p",{},[...this._toNodeList(f)]).element,M.TempleRegistry.createText(`
+    `,!1)]:a?[,M.TempleRegistry.createText(`
+      `,!1),M.TempleRegistry.createElement("li",{},[...this._toNodeList(f)]).element,M.TempleRegistry.createText(`
+    `,!1)]:n?[,M.TempleRegistry.createText(`
+      `,!1),M.TempleRegistry.createElement("div",{},[...this._toNodeList(f)]).element,M.TempleRegistry.createText(`
+    `,!1)]:[,M.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(f),M.TempleRegistry.createText(`
+    `,!1)]]}};var lt=function(t,...e){let r=Lr(t);for(let a=0;a{let t=document.querySelector("script[data-app]");if(!t)throw N.TempleException.for("APP_DATA not found");try{let b=atob(t.getAttribute("data-app"));window.__APP_DATA__=JSON.parse(b),Object.entries(window.__APP_DATA__).forEach(([d,k])=>{N.data.set(d,k)})}catch{throw N.TempleException.for("APP_DATA is not a valid JSON")}N.data.set("current","document");let e="/docs/compiler-api.html",r=lt("Compiler API - Temple reactive web component template engine."),a=lt("Compiler documentation for Temple."),n=()=>{document.getElementsByTagName("panel-layout")[0].toggle("left")};N.data.delete("current");let u={2:{class:"flex flex-center-y px-20 py-15 m-0 bg-t-1"},3:{class:"fas fa-fw fa-bars cursor-pointer py-5 pr-10 none md-inline-block tx-t-1",click:n},4:{class:"flex-grow"},5:{class:"flex flex-center-y"},6:{class:"tx-white",href:"/temple/docs/index.html"},7:{class:"tx-t-1 tx-5xl ml-10",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},8:{class:"fab fa-github"},9:{class:"bg-h-cb3837 pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},10:{class:"fab fa-npm text-white"},11:{class:"bg-h-7289da pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},12:{class:"fab fa-discord text-white"},14:{class:"flex flex-center-y bg-t-2 py-15 pr-5 pl-10"},15:{href:"/temple"},16:{class:"h-26 mr-10",src:"/temple/temple-icon.png",alt:"Temple Logo"},17:{class:"flex-grow m-0 tx-uppercase"},18:{class:"tx-white",href:"/temple"},19:{class:"fas fa-fw fa-chevron-left cursor-pointer none md-inline-block",click:n},20:{class:"bg-t-1 scroll-auto h-calc-full-60"},21:{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-0 pt-20 pb-10 pl-10 tx-uppercase"},22:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/index.html"},23:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/getting-started.html"},24:{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},25:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/markup-syntax.html"},26:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/state-management.html"},27:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-strategy.html"},28:{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/compiler-api.html"},29:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/client-api.html"},30:{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},31:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/template-engine.html"},32:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/single-page.html"},33:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/static-site.html"},34:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-publisher.html"},35:{class:"block tx-t-1 py-10 pl-10 mb-100",href:"/temple/docs/developer-tools.html"},38:{class:"tx-primary tx-uppercase tx-30 py-20"},39:{p:!0,trim:!0,class:"tx-lh-36 py-20"},40:{lang:"js",trim:!0,detab:10},41:{p:!0,trim:!0,class:"tx-lh-36 py-20"},42:{lang:"js",inline:!0},43:{start:"TempleOptions"},44:{p:!0,trim:!0,class:"tx-lh-36 py-20"},45:{lang:"js",inline:!0},46:{lang:"js",inline:!0},48:{class:"flex"},49:{class:"tx-primary py-40",href:"/temple/docs/component-strategy.html"},50:{class:"fas fa-fw fa-chevron-left tx-t-1"},51:{class:"flex-grow tx-right tx-primary py-40",href:"/temple/docs/client-api.html"},52:{class:"fas fa-fw fa-chevron-right tx-t-1"},53:{class:"foot"}};for(let b of document.body.querySelectorAll("*")){let d=Object.fromEntries(Array.from(b.attributes).map(x=>[x.nodeName,x.nodeValue.length>0?x.nodeValue:!0])),k=String(N.TempleRegistry.elements.size);u[k]&&(Object.assign(d,u[k]),b.TempleAttributes=u[k]),N.TempleRegistry.register(b,d)}customElements.define("panel-layout",ne),customElements.define("panel-head",se),customElements.define("panel-left",ie),customElements.define("panel-main",ae),customElements.define("api-docs",le),customElements.define("api-ui",oe),customElements.define("ide-code",pe),customElements.define("i18n-translate",ce),N.emitter.emit("mounted",document.body)});var Cr={PanelLayout_9f3ab204ce271feaf6f7:ne,PanelHead_2bf4dff19bc88ba4138b:se,PanelLeft_f4ab589e043eee17d229:ie,PanelMain_847772763f4518728ede:ae,ApiDocs_40562a7bb56d70d971df:le,ApiUi_0ec6f6ca4b362d125365:oe,ApiIdeCode_6f36bc13bb6a166c7abc:Y,IdeCode_5294df1c620ef5ddbd2f:pe,I18nTranslate_0014b007fc91289b2776:ce},Pr="38ccffadc3c6e8b93d28";return Wt(jr);})();
 /*! Bundled license information:
 
 prismjs/prism.js:
diff --git a/docs/build/client/3e6a90cc5da3e950a902.css b/docs/build/client/3e6a90cc5da3e950a902.css
index e69de29..ee31a38 100644
--- a/docs/build/client/3e6a90cc5da3e950a902.css
+++ b/docs/build/client/3e6a90cc5da3e950a902.css
@@ -0,0 +1,200 @@
+html, body {
+  height: 100%;
+  margin: 0;
+  padding: 0;
+  width: 100%;
+}
+
+h1, h2, h3, h4, h5, h6, p {
+  margin: 0;
+  padding: 0;
+}
+
+a {
+  text-decoration: none;
+}
+  html-head:not(:defined) { opacity: 0; }
+html-header:not(:defined) { opacity: 0; }
+html-aside:not(:defined) { opacity: 0; }
+panel-layout:not(:defined) { opacity: 0; }
+panel-head:not(:defined) { opacity: 0; }
+panel-left:not(:defined) { opacity: 0; }
+panel-main:not(:defined) { opacity: 0; }
+api-docs:not(:defined) { opacity: 0; }
+ide-app:not(:defined) { opacity: 0; }
+ide-code:not(:defined) { opacity: 0; }
+ide-preview:not(:defined) { opacity: 0; }
+i18n-translate:not(:defined) { opacity: 0; }
+  :root {
+  --black: #000000;
+  --white: #FFFFFF;
+  --info: #1474FC;
+  --error: #DC3545;
+  --warning: #FF7B07;
+  --success: #28A745;
+  --muted: #999999;
+}
+
+.light {
+  --bg-0: #EFEFEF;
+  --bg-1: #CFCFCF;
+  --bg-2: #AFAFAF;
+  --bg-3: #8F8F8F;
+  --bg-4: #6F6F6F;
+  --bd-0: #EFEFEF;
+  --bd-1: #CFCFCF;
+  --bd-2: #AFAFAF;
+  --bd-3: #8F8F8F;
+  --bd-4: #6F6F6F;
+  --bg-inverse: #242424;
+  --tx-0: #000000;
+  --tx-1: #242424;
+  --tx-inverse: #CFCFCF;
+}
+
+.dark {
+  --bg-0: #121212;
+  --bg-1: #222222;
+  --bg-2: #323232;
+  --bg-3: #424242;
+  --bg-4: #525252;
+  --bd-0: #121212;
+  --bd-1: #222222;
+  --bd-2: #323232;
+  --bd-3: #424242;
+  --bd-4: #525252;
+  --bg-inverse: #DBDBDB;
+  --tx-0: #FFFFFF;
+  --tx-1: #CFCFCF;
+  --tx-inverse: #222222;
+}
+  html-head { display: block; }
+html-header { display: block; }
+html-aside { display: block; }
+panel-layout { display: block; }
+panel-head { display: block; }
+panel-left { display: block; }
+panel-main { display: block; }
+api-docs { display: block; }
+ide-app { display: block; }
+ide-code { display: block; }
+ide-preview { display: block; }
+i18n-translate { display: block; }
+  .arial { font-family: Arial, sans-serif; }
+.none { display: none; }
+.block { display: block; }
+.flex { display: flex; }
+.inline { display: inline; }
+.relative { position: relative; }
+.absolute { position: absolute; }
+.static { position: static; }
+.bottom-0 { bottom: 0px; }
+.bottom-60 { bottom: 60px; }
+.left-0 { left: 0px; }
+.left-226 { left: 226px; }
+.left-0 { left: 0px; }
+.left-226 { left: 226px; }
+.left--226 { left: -226px; }
+.right-0 { right: 0px; }
+.right-200 { right: 200px; }
+.right-0 { right: 0px; }
+.right-200 { right: 200px; }
+.top-0 { top: 0px; }
+.top-60 { top: 60px; }
+.flex-grow { flex-grow: 1; }
+.flex-center { align-items: center; justify-content: center; }
+.flex-center-y { align-items: center; }
+.basis-half { flex-basis: 50%; }
+.gap-10 { gap: 10px; }
+.scroll { overflow: scroll; }
+.scroll-auto { overflow: auto; }
+.scroll-hidden { overflow: hidden; }
+.scroll-x-hidden { overflow-x: hidden; }
+.scroll-y-auto { overflow-y: auto; }
+.h-full { height: 100%; }
+.h-26 { height: 26px; }
+.h-7289 { height: 7289px; }
+.h-905496362982981723 { height: 905496362982981723px; }
+.h-60 { height: 60px; }
+.h-999999 { height: 999999px; }
+.h-10 { height: 10px; }
+.h-36 { height: 36px; }
+.h-140 { height: 140px; }
+.h-calc-full-60 { height: calc(100% - 60px); }
+.vh { height: 100vh; }
+.w-full { width: 100%; }
+.w-226 { width: 226px; }
+.w-0 { width: 0px; }
+.w-10 { width: 10px; }
+.bg-black { background-color: var(--black) !important; }
+.bg-white { background-color: var(--white) !important; }
+.bg-t-1 { background-color: var(--bg-1) !important; }
+.bg-t-2 { background-color: var(--bg-2) !important; }
+.bg-t-0 { background-color: var(--bg-0) !important; }
+.bg-h-cb3837 { background-color: #cb3837; }
+.bg-h-7289da { background-color: #7289da; }
+.bg-h-999999 { background-color: #999999; }
+.tx-5 { font-size: 5px; }
+.tx-14 { font-size: 14px; }
+.tx-16 { font-size: 16px; }
+.tx-30 { font-size: 30px; }
+.tx-lg { font-size: 16px; }
+.tx-5xl { font-size: 26px; }
+.tx-center { text-align: center; }
+.tx-right { text-align: right; }
+.tx-bold { font-weight: bold; }
+.tx-uppercase { text-transform: uppercase; }
+.tx-lh-36 { line-height: 36px; }
+.tx-primary { color: var(--primary) !important; }
+.tx-black { color: var(--black) !important; }
+.tx-white { color: var(--white) !important; }
+.tx-muted { color: var(--muted) !important; }
+.tx-t-1 { color: var(--tx-1) !important; }
+.bd-solid { border-style: solid; }
+.bd-t-1 { border-color: var(--bd-1) !important; }
+.bdl-1 { border-left-width: 1px; }
+.bdr-0 { border-right-width: 0px; }
+.bdy-0 { border-top-width: 0px; border-bottom-width: 0px; }
+.pill { border-radius: 10000px; }
+.m-0 { margin: 0px; }
+.m-0 { margin: 0px; }
+.m-60 { margin: 60px; }
+.mb-0 { margin-bottom: 0px; }
+.mb-100 { margin-bottom: 100px; }
+.ml-10 { margin-left: 10px; }
+.ml-5 { margin-left: 5px; }
+.mr-10 { margin-right: 10px; }
+.mt-0 { margin-top: 0px; }
+.mt-20 { margin-top: 20px; }
+.p-5 { padding: 5px; }
+.p-0 { padding: 0px; }
+.p-60 { padding: 60px; }
+.p-10 { padding: 10px; }
+.p-10 { padding: 10px; }
+.pb-10 { padding-bottom: 10px; }
+.pl-10 { padding-left: 10px; }
+.pr-10 { padding-right: 10px; }
+.pr-5 { padding-right: 5px; }
+.pt-20 { padding-top: 20px; }
+.px-20 { padding-left: 20px; padding-right: 20px; }
+.py-15 { padding-top: 15px; padding-bottom: 15px; }
+.py-5 { padding-top: 5px; padding-bottom: 5px; }
+.py-10 { padding-top: 10px; padding-bottom: 10px; }
+.py-20 { padding-top: 20px; padding-bottom: 20px; }
+.py-40 { padding-top: 40px; padding-bottom: 40px; }
+.cursor-pointer { cursor: pointer; }
+.transition-500 { transition: 500ms; }
+.shadow-0-0-10-0-0-0-5 { box-shadow: 0px 0px 10px rgb(0, 0, 0, 0.5); }
+@media (max-width: 992px) {
+  .lg-block { display: block; }
+  .lg-h-auto { height: auto; }
+  .lg-bd-0 { border-width: 0px; }
+}
+@media (max-width: 767px) {
+  .md-inline-block { display: inline-block; }
+  .md-left-0 { left: 0px; }
+  .md-left-226 { left: 226px; }
+  .md-left--226 { left: -226px; }
+  .md-right-0 { right: 0px; }
+  .md-right-200 { right: 200px; }
+}
\ No newline at end of file
diff --git a/docs/build/client/3e6a90cc5da3e950a902.html b/docs/build/client/3e6a90cc5da3e950a902.html
index e3e4f6f..9715517 100644
--- a/docs/build/client/3e6a90cc5da3e950a902.html
+++ b/docs/build/client/3e6a90cc5da3e950a902.html
@@ -18,151 +18,208 @@
   
   
   
-  
+  
   
   
   
   
 
-  
-    

-  
-  
-    Temple Logo
-  
-  
Temple

-  
+      
+        
+          

+            Documentation
+          

 
-            
-            
-              import { props } from '@ossph/temple';
-              export default class Hello extends TempleComponent {
-                styles() {
-                  return 'h1 { font-weight: bold; }';
-                }
-                template() {
+          
+            Temple is a template engine with a built-in compiler that 
+            generates HTML markup, web components and support reactivity. 
+          
+          
+            Like React and Svelte, Temple is a modern approach to building
+            front-end code addressing state management and reactivity. 
+            Unlike React and Svelte that focus on keeping the developer 
+            experience mostly on the front-end, Temple focuses on being 
+            a modern templating solution for server side frameworks.
+          
+          
+            Temple can be used as a template engine on the server side, 
+            as a site generator to make static websites and single page 
+            applications, or can be used to publish native HTML5 web 
+            components.
+          
+          
+            Temple sticks closely to the classic web development model of 
+            HTML, CSS, and JS, just adding a few extensions to HTML and 
+            JavaScript. It arguably has fewer concepts and tools to learn 
+            than some of the other framework options.
+          
+          
+            

+              
+                <style>
+                  h1 { font-weight: bold; }
+                </style>
+                <script>
+                  const name = 'world';
+                </script>
+                <h1>Hello {name}!</h1>
+              
+              
+                

+                  
Hello world!

+                

+              
+            

+          
+          
+            At it's core, a temple file is a special template file that 
+            allows HTML, JavaScript, CSS and importing of components and 
+            templates. All of which are transpiled to TypeScript or 
+            JavaScript source code.
+          
+          
+            

+              
+                <style>
+                  h1 { font-weight: bold; }
+                </style>
+                <script>
+                  import { props } from '@ossph/temple';
                   const { name } = props();
-                  return () => [
-                    TempleRegistry.createElement('h1', null, `Hello ${name}`)
-                  ]
+                </script>
+                <h1>Hello {name}!!</h1>
+                
+                
+
+              
+              
+                import { props } from '@ossph/temple';
+                export default class Hello extends TempleComponent {
+                  styles() {
+                    return 'h1 { font-weight: bold; }';
+                  }
+                  template() {
+                    const { name } = props();
+                    return () => [
+                      TempleRegistry.createElement('h1', null, `Hello ${name}`)
+                    ]
+                  }
                 }
-              }
-            
-          

-        
-        
-        
-      
-      

-    
+              
+            
+          
+
+          
+          

+        
+      
+    
   
 
\ No newline at end of file
diff --git a/docs/build/client/3e6a90cc5da3e950a902.js b/docs/build/client/3e6a90cc5da3e950a902.js
index c1613bd..4eb83a9 100644
--- a/docs/build/client/3e6a90cc5da3e950a902.js
+++ b/docs/build/client/3e6a90cc5da3e950a902.js
@@ -1,20 +1,37 @@
-var TempleAPI=(()=>{var xt=Object.create;var ge=Object.defineProperty;var Tt=Object.getOwnPropertyDescriptor;var Et=Object.getOwnPropertyNames;var Ft=Object.getPrototypeOf,kt=Object.prototype.hasOwnProperty;var O=(t,e)=>()=>(e||t((e={exports:{}}).exports,e),e.exports),Pt=(t,e)=>{for(var r in e)ge(t,r,{get:e[r],enumerable:!0})},We=(t,e,r,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let n of Et(e))!kt.call(t,n)&&n!==r&&ge(t,n,{get:()=>e[n],enumerable:!(i=Tt(e,n))||i.enumerable});return t};var D=(t,e,r)=>(r=t!=null?xt(Ft(t)):{},We(e||!t||!t.__esModule?ge(r,"default",{value:t,enumerable:!0}):r,t)),St=t=>We(ge({},"__esModule",{value:!0}),t);var Oe=O(je=>{"use strict";Object.defineProperty(je,"__esModule",{value:!0});var Se=class extends Error{static for(e,...r){return r.forEach(function(i){e=e.replace("%s",i)}),new this(e)}static forErrorsFound(e){let r=new this("Invalid Parameters");return r.errors=e,r}static require(e,r,...i){if(!e){for(let n of i)r=r.replace("%s",n);throw new this(r)}}constructor(e,r=500){super(),this.errors={},this.start=0,this.end=0,this.message=e,this.name=this.constructor.name,this.code=r}withCode(e){return this.code=e,this}withPosition(e,r){return this.start=e,this.end=r,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};je.default=Se});var ee=O(Q=>{"use strict";Object.defineProperty(Q,"__esModule",{value:!0});Q.TempleEmitter=void 0;var he=class extends EventTarget{emit(e,r){return this.dispatchEvent(new CustomEvent(e,{detail:r})),this}on(e,r){if(e==="ready"&&document.readyState!=="loading"){let i=new CustomEvent("ready");return setTimeout(()=>r(i),1),this}return this.addEventListener(e,r),this}once(e,r){let i=n=>{this.unbind(e,i),r(n)};return this.on(e,i),this}unbind(e,r){return this.removeEventListener(e,r),this}};Q.TempleEmitter=he;var Je=new he;document.onreadystatechange=()=>{document.readyState!=="loading"&&Je.emit("ready")};Q.default=Je});var De=O(te=>{"use strict";var jt=te&&te.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(te,"__esModule",{value:!0});var Me=jt(ee()),Ce=class{get attributes(){return Object.assign({},this._attributes)}get element(){return this._element}constructor(e,r){this._element=e,this._attributes=r}hasAttribute(e){return e in this._attributes}getAttribute(e){return this._attributes[e]}removeAttribute(e,r=!1){let i=this.getAttribute(e);return typeof i>"u"?this:(delete this._attributes[e],this._element.removeAttribute(e),r||Me.default.emit("attribute-remove",{element:this,key:e,previous:i}),this)}setAttribute(e,r,i=!1){if(typeof r>"u")return this.removeAttribute(e,i);let n=this.getAttribute(e);return n===r?this:(this._attributes[e]=r,typeof r=="string"&&this._element.setAttribute(e,r),i||(typeof n>"u"?Me.default.emit("attribute-create",{element:this,key:e,value:r}):Me.default.emit("attribute-update",{element:this,key:e,value:r,previous:n})),this)}setAttributes(e,r=!1){for(let[n,p]of Object.entries(e))this.setAttribute(n,p,r);let i=Object.keys(e);for(let n of Object.keys(this._attributes))i.includes(n)||this.removeAttribute(n,r);return this}};te.default=Ce});var be=O(re=>{"use strict";var Ot=re&&re.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(re,"__esModule",{value:!0});var Mt=Ot(De()),me=class{static get elements(){return this._elements}static createComponent(e,r,i,n=[]){let p=document.createElement("template");p.innerHTML=`<${e}>`;let m=p.content.querySelector(`${e}`);Object.setPrototypeOf(m,r.prototype),m.constructor=r.constructor,m.constructor.component=r.component;for(let[v,E]of Object.entries(i))typeof E=="string"?m.setAttribute(v,E):E===!0&&m.setAttribute(v,v);return m._TempleAttributes=i,m.props=i,n.forEach(v=>m.appendChild(v)),m.register(),customElements.get(e)||m.connectedCallback(),this.register(m,i)}static createElement(e,r,i=[]){let n=document.createElement(e);for(let[p,h]of Object.entries(r))typeof h=="string"?n.setAttribute(p,h):h===!0&&n.setAttribute(p,p);return i.filter(p=>typeof p<"u").forEach(p=>n.appendChild(p)),this.register(n,r)}static createText(e,r=!1){return document.createTextNode(e)}static filter(e){let r=[];return this._elements.forEach((i,n)=>{e(i,n)&&r.push(i)}),r}static get(e){return this._elements.get(e)||null}static has(e){return this._elements.has(e)}static map(e){let r=[];return this._elements.forEach((i,n)=>{r.push(e(i,n))}),r}static register(e,r){if(this.has(e))return this.get(e);let i=new Mt.default(e,r||{});return this._elements.set(e,i),i}};me._elements=new Map;re.default=me});var z=O(ne=>{"use strict";Object.defineProperty(ne,"__esModule",{value:!0});ne.TempleDataMap=void 0;var _e=class{constructor(){window.__APP_DATA__||(window.__APP_DATA__={})}clear(){return window.__APP_DATA__={},this}delete(e){return this.has(e)?(delete window.__APP_DATA__[e],!0):!1}entries(){return Object.entries(window.__APP_DATA__)}has(e){return e in window.__APP_DATA__}get(e){return window.__APP_DATA__[e]}keys(){return Object.keys(window.__APP_DATA__)}set(e,r){return window.__APP_DATA__[e]=r,this}values(){return Object.values(window.__APP_DATA__)}};ne.TempleDataMap=_e;var Ct=new _e;ne.default=Ct});var Ye=O(se=>{"use strict";var Le=se&&se.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(se,"__esModule",{value:!0});var ae=Le(be()),ve=Le(ee()),Xe=Le(z()),$e=class t extends HTMLElement{constructor(){super(...arguments),this._initiated=!1,this._template=null,this._attributes={},this._props={},this._children=void 0,this._rendering=!1}static register(){customElements.define(this.component[0],this)}get attr(){return this._attributes}get element(){return ae.default.has(this)?ae.default.get(this):ae.default.register(this,this._TempleAttributes||{})}get metadata(){let[e,r]=this.constructor.component;return{tagname:e,classname:r}}get originalChildren(){return this._children}get initiated(){return this._initiated}get props(){return this._props}set props(e){this._props=Object.assign({},e),this._attributes=Object.fromEntries(Object.entries(e).filter(r=>typeof r[1]=="string"||r[1]===!0))}adoptedCallback(){this.render()}attributeChangedCallback(e,r,i){this.props=Object.assign(Object.assign({},this.props),{[e]:i}),this.render()}connectedCallback(){this.wait()}disconnectedCallback(){}getParentComponent(){let e=this.parentElement;for(;e;){if(e instanceof t)return e;e=e.parentElement}return null}register(){ae.default.register(this,this._props)}render(){let e=this.getParentComponent();if(e&&!e.initiated)return;if(this._rendering)return;this._rendering=!0,Xe.default.set("current",this);let r=this.styles();this._template?ve.default.emit("unmounted",this):this._template=this.template();let i=this._template().filter(Boolean);if(r.length===0)this.textContent="",i.forEach(n=>this.appendChild(n));else{this.shadowRoot||this.attachShadow({mode:"open"});let n=this.shadowRoot;this.textContent="",n.textContent="";let p=document.createElement("style");p.innerText=r,n.appendChild(p),i.forEach(h=>{var m;return(m=this.shadowRoot)===null||m===void 0?void 0:m.appendChild(h)})}return Xe.default.delete("current"),this._initiated=!0,ve.default.emit("mounted",this),this._rendering=!1,this.shadowRoot?this.shadowRoot.innerHTML:this.innerHTML}wait(){if(document.readyState!=="loading")this._update();else{let e=()=>{this._update(),ve.default.unbind("ready",e)};ve.default.on("ready",e)}}_toNodeList(e){return e instanceof Node?[e]:Array.isArray(e)&&e.every(r=>r instanceof Node)?e:[ae.default.createText(String(e))]}_update(){typeof this._children>"u"&&(this._children=Array.from(this.childNodes||[]));let e=this.element;e&&(this.props=Object.assign({},e.attributes),this.render()),this._initiated||this.render()}};se.default=$e});var Ve=O(ie=>{"use strict";var Dt=ie&&ie.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ie,"__esModule",{value:!0});var $t=Dt(z());function Lt(t){let e=$t.default.get("env")||{};return t?e[t]||null:e}ie.default=Lt});var qe=O(le=>{"use strict";var qt=le&&le.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(le,"__esModule",{value:!0});le.default=Rt;var Ke=qt(z());function Rt(t=null){return t||(t=Ke.default.get("current")||null),t?t==="document"?Ke.default.get("props")||{}:t.props:{}}});var Qe=O(oe=>{"use strict";var It=oe&&oe.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(oe,"__esModule",{value:!0});oe.default=Ht;var zt=It(qe());function Ht(t=null){return(0,zt.default)(t).class}});var tt=O(G=>{"use strict";var Nt=G&&G.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(G,"__esModule",{value:!0});G.innerHTML=Gt;G.default=et;var Bt=Nt(z());function Gt(t=null){let e=et(t),r=document.createElement("template");return r.append(...e),r.innerHTML}function et(t=null){return t||(t=Bt.default.get("current")||null),t?t.originalChildren||[]:[]}});var at=O(H=>{"use strict";var nt=H&&H.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(H,"__esModule",{value:!0});H.SignalRegistry=void 0;H.default=Zt;var rt=nt(Oe()),Ut=nt(z()),U=class t{static observe(e,r){let i={getter:()=>n.raw,setter:h=>h},n={raw:r,getter(h){return i.getter=h,n},setter(h){return i.setter=h,n}};Object.defineProperty(n,"value",{get(){return i.getter()},set(h){let m=i.setter(h),v=t.serialize(m)!==t.serialize(n.raw);n.raw=m,v&&e.render()}});let p=this._observers.get(e);return p?(p.observed++,p.values.push(n)):this._observers.set(e,{observed:1,values:[n]}),n}static observer(e){return this._observers.get(e)||null}static serialize(e){return JSON.stringify(e)}};H.SignalRegistry=U;U._observers=new Map;function Zt(t,e=null){if(e||(e=Ut.default.get("current")||null),!e)throw rt.default.for("Signals can only be created within a Temple component");if(!e.initiated)return U.observe(e,t);let r=U.observer(e);if(!r)throw rt.default.for("State mismatch");return r.values[r.observed++%r.values.length]}});var ut=O(ye=>{"use strict";var it=ye&&ye.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ye,"__esModule",{value:!0});var st=it(be()),lt=it(ee()),ot=(t,e)=>Array.from(t.querySelectorAll("*")).filter(r=>{let i=st.default.get(r);return i&&i.hasAttribute(e)}).map(r=>st.default.get(r));function Re(t,e){lt.default.on("mounted",r=>{if(!r.detail)return;let i=r.detail;ot(i.shadowRoot||i,t).forEach(e)})}function Wt(t,e){lt.default.on("unmounted",r=>{if(!r.detail)return;let i=r.detail;ot(i.shadowRoot||i,t).forEach(e)})}Re("mount",t=>{let e=t.getAttribute("mount");if(typeof e=="function"){let r=new CustomEvent("mount",{detail:{node:t,target:t.element}});e(r)}});Wt("unmount",t=>{let e=t.getAttribute("unmount");if(typeof e=="function"){let r=new CustomEvent("unmount",{detail:{node:t,target:t.element}});e(r)}});Re("if",t=>{let e=t.getAttribute("if");(e===!1||e==="false"||typeof e=="function"&&!e())&&t.element.remove()});["click","dblclick","mousedown","mouseup","mousemove","mouseover","mouseout","wheel","keydown","keypress","keyup","blur","change","contextmenu","focus","input","submit","invalid","reset","search","select","copy","cut","paste","drag","dragstart","dragend","dragover","dragenter","dragleave","drop","scroll","durationchange","ended","error","loadeddata","loadedmetadata","loadstart","pause","play","playing","progress","ratechange","seeked","seeking","stalled","suspend","timeupdate","volumechange","waiting","animationstart","animationend","animationiteration","transitionend","toggle"].forEach(t=>Re(t,e=>{let r=e.getAttribute(t);typeof r=="function"&&(e.element.removeEventListener(t,r),e.element.addEventListener(t,r))}))});var Ie=O(g=>{"use strict";var Jt=g&&g.__createBinding||(Object.create?function(t,e,r,i){i===void 0&&(i=r);var n=Object.getOwnPropertyDescriptor(e,r);(!n||("get"in n?!e.__esModule:n.writable||n.configurable))&&(n={enumerable:!0,get:function(){return e[r]}}),Object.defineProperty(t,i,n)}:function(t,e,r,i){i===void 0&&(i=r),t[i]=e[r]}),Xt=g&&g.__setModuleDefault||(Object.create?function(t,e){Object.defineProperty(t,"default",{enumerable:!0,value:e})}:function(t,e){t.default=e}),we=g&&g.__importStar||function(t){if(t&&t.__esModule)return t;var e={};if(t!=null)for(var r in t)r!=="default"&&Object.prototype.hasOwnProperty.call(t,r)&&Jt(e,t,r);return Xt(e,t),e},N=g&&g.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(g,"__esModule",{value:!0});g.SignalRegistry=g.TempleException=g.TempleEmitter=g.TempleElement=g.TempleRegistry=g.TempleComponent=g.TempleDataMap=g.emitter=g.signal=g.innerHTML=g.children=g.classnames=g.props=g.env=g.data=void 0;var Yt=N(Oe());g.TempleException=Yt.default;var Vt=N(Ye());g.TempleComponent=Vt.default;var Kt=N(be());g.TempleRegistry=Kt.default;var Qt=N(De());g.TempleElement=Qt.default;var ct=we(ee());g.emitter=ct.default;Object.defineProperty(g,"TempleEmitter",{enumerable:!0,get:function(){return ct.TempleEmitter}});var dt=we(z());g.data=dt.default;Object.defineProperty(g,"TempleDataMap",{enumerable:!0,get:function(){return dt.TempleDataMap}});var er=N(Ve());g.env=er.default;var tr=N(qe());g.props=tr.default;var rr=N(Qe());g.classnames=rr.default;var ft=we(tt());g.children=ft.default;Object.defineProperty(g,"innerHTML",{enumerable:!0,get:function(){return ft.innerHTML}});var pt=we(at());g.signal=pt.default;Object.defineProperty(g,"SignalRegistry",{enumerable:!0,get:function(){return pt.SignalRegistry}});ut()});var I=O((wr,gt)=>{gt.exports={...Ie()}});var ht=O((xr,xe)=>{var nr=typeof window<"u"?window:typeof WorkerGlobalScope<"u"&&self instanceof WorkerGlobalScope?self:{};var c=function(t){var e=/(?:^|\s)lang(?:uage)?-([\w-]+)(?=\s|$)/i,r=0,i={},n={manual:t.Prism&&t.Prism.manual,disableWorkerMessageHandler:t.Prism&&t.Prism.disableWorkerMessageHandler,util:{encode:function s(a){return a instanceof p?new p(a.type,s(a.content),a.alias):Array.isArray(a)?a.map(s):a.replace(/&/g,"&").replace(/"u")return null;if("currentScript"in document)return document.currentScript;try{throw new Error}catch(o){var s=(/at [^(\r\n]*\((.*):[^:]+:[^:]+\)$/i.exec(o.stack)||[])[1];if(s){var a=document.getElementsByTagName("script");for(var l in a)if(a[l].src==s)return a[l]}return null}},isActive:function(s,a,l){for(var o="no-"+a;s;){var u=s.classList;if(u.contains(a))return!0;if(u.contains(o))return!1;s=s.parentElement}return!!l}},languages:{plain:i,plaintext:i,text:i,txt:i,extend:function(s,a){var l=n.util.clone(n.languages[s]);for(var o in a)l[o]=a[o];return l},insertBefore:function(s,a,l,o){o=o||n.languages;var u=o[s],f={};for(var b in u)if(u.hasOwnProperty(b)){if(b==a)for(var d in l)l.hasOwnProperty(d)&&(f[d]=l[d]);l.hasOwnProperty(b)||(f[b]=u[b])}var A=o[s];return o[s]=f,n.languages.DFS(n.languages,function(S,q){q===A&&S!=s&&(this[S]=f)}),f},DFS:function s(a,l,o,u){u=u||{};var f=n.util.objId;for(var b in a)if(a.hasOwnProperty(b)){l.call(a,b,a[b],o||b);var d=a[b],A=n.util.type(d);A==="Object"&&!u[f(d)]?(u[f(d)]=!0,s(d,l,null,u)):A==="Array"&&!u[f(d)]&&(u[f(d)]=!0,s(d,l,b,u))}}},plugins:{},highlightAll:function(s,a){n.highlightAllUnder(document,s,a)},highlightAllUnder:function(s,a,l){var o={callback:l,container:s,selector:'code[class*="language-"], [class*="language-"] code, code[class*="lang-"], [class*="lang-"] code'};n.hooks.run("before-highlightall",o),o.elements=Array.prototype.slice.apply(o.container.querySelectorAll(o.selector)),n.hooks.run("before-all-elements-highlight",o);for(var u=0,f;f=o.elements[u++];)n.highlightElement(f,a===!0,o.callback)},highlightElement:function(s,a,l){var o=n.util.getLanguage(s),u=n.languages[o];n.util.setLanguage(s,o);var f=s.parentElement;f&&f.nodeName.toLowerCase()==="pre"&&n.util.setLanguage(f,o);var b=s.textContent,d={element:s,language:o,grammar:u,code:b};function A(q){d.highlightedCode=q,n.hooks.run("before-insert",d),d.element.innerHTML=d.highlightedCode,n.hooks.run("after-highlight",d),n.hooks.run("complete",d),l&&l.call(d.element)}if(n.hooks.run("before-sanity-check",d),f=d.element.parentElement,f&&f.nodeName.toLowerCase()==="pre"&&!f.hasAttribute("tabindex")&&f.setAttribute("tabindex","0"),!d.code){n.hooks.run("complete",d),l&&l.call(d.element);return}if(n.hooks.run("before-highlight",d),!d.grammar){A(n.util.encode(d.code));return}if(a&&t.Worker){var S=new Worker(n.filename);S.onmessage=function(q){A(q.data)},S.postMessage(JSON.stringify({language:d.language,code:d.code,immediateClose:!0}))}else A(n.highlight(d.code,d.grammar,d.language))},highlight:function(s,a,l){var o={code:s,grammar:a,language:l};if(n.hooks.run("before-tokenize",o),!o.grammar)throw new Error('The language "'+o.language+'" has no grammar.');return o.tokens=n.tokenize(o.code,o.grammar),n.hooks.run("after-tokenize",o),p.stringify(n.util.encode(o.tokens),o.language)},tokenize:function(s,a){var l=a.rest;if(l){for(var o in l)a[o]=l[o];delete a.rest}var u=new v;return E(u,u.head,s),m(s,u,a,u.head,0),F(u)},hooks:{all:{},add:function(s,a){var l=n.hooks.all;l[s]=l[s]||[],l[s].push(a)},run:function(s,a){var l=n.hooks.all[s];if(!(!l||!l.length))for(var o=0,u;u=l[o++];)u(a)}},Token:p};t.Prism=n;function p(s,a,l,o){this.type=s,this.content=a,this.alias=l,this.length=(o||"").length|0}p.stringify=function s(a,l){if(typeof a=="string")return a;if(Array.isArray(a)){var o="";return a.forEach(function(A){o+=s(A,l)}),o}var u={type:a.type,content:s(a.content,l),tag:"span",classes:["token",a.type],attributes:{},language:l},f=a.alias;f&&(Array.isArray(f)?Array.prototype.push.apply(u.classes,f):u.classes.push(f)),n.hooks.run("wrap",u);var b="";for(var d in u.attributes)b+=" "+d+'="'+(u.attributes[d]||"").replace(/"/g,""")+'"';return"<"+u.tag+' class="'+u.classes.join(" ")+'"'+b+">"+u.content+""};function h(s,a,l,o){s.lastIndex=a;var u=s.exec(l);if(u&&o&&u[1]){var f=u[1].length;u.index+=f,u[0]=u[0].slice(f)}return u}function m(s,a,l,o,u,f){for(var b in l)if(!(!l.hasOwnProperty(b)||!l[b])){var d=l[b];d=Array.isArray(d)?d:[d];for(var A=0;A=f.reach);L+=j.value.length,j=j.next){var B=j.value;if(a.length>s.length)return;if(!(B instanceof p)){var ce=1,$;if(Ge){if($=h(Ue,L,s,Be),!$||$.index>=s.length)break;var de=$.index,wt=$.index+$[0].length,R=L;for(R+=j.value.length;de>=R;)j=j.next,R+=j.value.length;if(R-=j.value.length,L=R,j.value instanceof p)continue;for(var K=j;K!==a.tail&&(Rf.reach&&(f.reach=ke);var pe=j.prev;Fe&&(pe=E(a,pe,Fe),L+=Fe.length),w(a,pe,ce);var At=new p(b,q?n.tokenize(fe,q):fe,vt,fe);if(j=E(a,pe,At),Ze&&E(a,j,Ze),ce>1){var Pe={cause:b+","+A,reach:ke};m(s,a,l,j.prev,L,Pe),f&&Pe.reach>f.reach&&(f.reach=Pe.reach)}}}}}}function v(){var s={value:null,prev:null,next:null},a={value:null,prev:s,next:null};s.next=a,this.head=s,this.tail=a,this.length=0}function E(s,a,l){var o=a.next,u={value:l,prev:a,next:o};return a.next=u,o.prev=u,s.length++,u}function w(s,a,l){for(var o=a.next,u=0;u/,greedy:!0},prolog:{pattern:/<\?[\s\S]+?\?>/,greedy:!0},doctype:{pattern:/"'[\]]|"[^"]*"|'[^']*')+(?:\[(?:[^<"'\]]|"[^"]*"|'[^']*'|<(?!!--)|)*\]\s*)?>/i,greedy:!0,inside:{"internal-subset":{pattern:/(^[^\[]*\[)[\s\S]+(?=\]>$)/,lookbehind:!0,greedy:!0,inside:null},string:{pattern:/"[^"]*"|'[^']*'/,greedy:!0},punctuation:/^$|[[\]]/,"doctype-tag":/^DOCTYPE/i,name:/[^\s<>'"]+/}},cdata:{pattern://i,greedy:!0},tag:{pattern:/<\/?(?!\d)[^\s>\/=$<%]+(?:\s(?:\s*[^\s>\/=]+(?:\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))|(?=[\s/>])))+)?\s*\/?>/,greedy:!0,inside:{tag:{pattern:/^<\/?[^\s>\/]+/,inside:{punctuation:/^<\/?/,namespace:/^[^\s>\/:]+:/}},"special-attr":[],"attr-value":{pattern:/=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+)/,inside:{punctuation:[{pattern:/^=/,alias:"attr-equals"},{pattern:/^(\s*)["']|["']$/,lookbehind:!0}]}},punctuation:/\/?>/,"attr-name":{pattern:/[^\s>\/]+/,inside:{namespace:/^[^\s>\/:]+:/}}}},entity:[{pattern:/&[\da-z]{1,8};/i,alias:"named-entity"},/&#x?[\da-f]{1,8};/i]};c.languages.markup.tag.inside["attr-value"].inside.entity=c.languages.markup.entity;c.languages.markup.doctype.inside["internal-subset"].inside=c.languages.markup;c.hooks.add("wrap",function(t){t.type==="entity"&&(t.attributes.title=t.content.replace(/&/,"&"))});Object.defineProperty(c.languages.markup.tag,"addInlined",{value:function(e,r){var i={};i["language-"+r]={pattern:/(^$)/i,lookbehind:!0,inside:c.languages[r]},i.cdata=/^$/i;var n={"included-cdata":{pattern://i,inside:i}};n["language-"+r]={pattern:/[\s\S]+/,inside:c.languages[r]};var p={};p[e]={pattern:RegExp(/(<__[^>]*>)(?:))*\]\]>|(?!)/.source.replace(/__/g,function(){return e}),"i"),lookbehind:!0,greedy:!0,inside:n},c.languages.insertBefore("markup","cdata",p)}});Object.defineProperty(c.languages.markup.tag,"addAttribute",{value:function(t,e){c.languages.markup.tag.inside["special-attr"].push({pattern:RegExp(/(^|["'\s])/.source+"(?:"+t+")"+/\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))/.source,"i"),lookbehind:!0,inside:{"attr-name":/^[^\s=]+/,"attr-value":{pattern:/=[\s\S]+/,inside:{value:{pattern:/(^=\s*(["']|(?!["'])))\S[\s\S]*(?=\2$)/,lookbehind:!0,alias:[e,"language-"+e],inside:c.languages[e]},punctuation:[{pattern:/^=/,alias:"attr-equals"},/"|'/]}}}})}});c.languages.html=c.languages.markup;c.languages.mathml=c.languages.markup;c.languages.svg=c.languages.markup;c.languages.xml=c.languages.extend("markup",{});c.languages.ssml=c.languages.xml;c.languages.atom=c.languages.xml;c.languages.rss=c.languages.xml;(function(t){var e=/(?:"(?:\\(?:\r\n|[\s\S])|[^"\\\r\n])*"|'(?:\\(?:\r\n|[\s\S])|[^'\\\r\n])*')/;t.languages.css={comment:/\/\*[\s\S]*?\*\//,atrule:{pattern:RegExp("@[\\w-](?:"+/[^;{\s"']|\s+(?!\s)/.source+"|"+e.source+")*?"+/(?:;|(?=\s*\{))/.source),inside:{rule:/^@[\w-]+/,"selector-function-argument":{pattern:/(\bselector\s*\(\s*(?![\s)]))(?:[^()\s]|\s+(?![\s)])|\((?:[^()]|\([^()]*\))*\))+(?=\s*\))/,lookbehind:!0,alias:"selector"},keyword:{pattern:/(^|[^\w-])(?:and|not|only|or)(?![\w-])/,lookbehind:!0}}},url:{pattern:RegExp("\\burl\\((?:"+e.source+"|"+/(?:[^\\\r\n()"']|\\[\s\S])*/.source+")\\)","i"),greedy:!0,inside:{function:/^url/i,punctuation:/^\(|\)$/,string:{pattern:RegExp("^"+e.source+"$"),alias:"url"}}},selector:{pattern:RegExp(`(^|[{}\\s])[^{}\\s](?:[^{};"'\\s]|\\s+(?![\\s{])|`+e.source+")*(?=\\s*\\{)"),lookbehind:!0},string:{pattern:e,greedy:!0},property:{pattern:/(^|[^-\w\xA0-\uFFFF])(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*(?=\s*:)/i,lookbehind:!0},important:/!important\b/i,function:{pattern:/(^|[^-a-z0-9])[-a-z0-9]+(?=\()/i,lookbehind:!0},punctuation:/[(){};:,]/},t.languages.css.atrule.inside.rest=t.languages.css;var r=t.languages.markup;r&&(r.tag.addInlined("style","css"),r.tag.addAttribute("style","css"))})(c);c.languages.clike={comment:[{pattern:/(^|[^\\])\/\*[\s\S]*?(?:\*\/|$)/,lookbehind:!0,greedy:!0},{pattern:/(^|[^\\:])\/\/.*/,lookbehind:!0,greedy:!0}],string:{pattern:/(["'])(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/,greedy:!0},"class-name":{pattern:/(\b(?:class|extends|implements|instanceof|interface|new|trait)\s+|\bcatch\s+\()[\w.\\]+/i,lookbehind:!0,inside:{punctuation:/[.\\]/}},keyword:/\b(?:break|catch|continue|do|else|finally|for|function|if|in|instanceof|new|null|return|throw|try|while)\b/,boolean:/\b(?:false|true)\b/,function:/\b\w+(?=\()/,number:/\b0x[\da-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:e[+-]?\d+)?/i,operator:/[<>]=?|[!=]=?=?|--?|\+\+?|&&?|\|\|?|[?*/~^%]/,punctuation:/[{}[\];(),.:]/};c.languages.javascript=c.languages.extend("clike",{"class-name":[c.languages.clike["class-name"],{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$A-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\.(?:constructor|prototype))/,lookbehind:!0}],keyword:[{pattern:/((?:^|\})\s*)catch\b/,lookbehind:!0},{pattern:/(^|[^.]|\.\.\.\s*)\b(?:as|assert(?=\s*\{)|async(?=\s*(?:function\b|\(|[$\w\xA0-\uFFFF]|$))|await|break|case|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally(?=\s*(?:\{|$))|for|from(?=\s*(?:['"]|$))|function|(?:get|set)(?=\s*(?:[#\[$\w\xA0-\uFFFF]|$))|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)\b/,lookbehind:!0}],function:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*(?:\.\s*(?:apply|bind|call)\s*)?\()/,number:{pattern:RegExp(/(^|[^\w$])/.source+"(?:"+(/NaN|Infinity/.source+"|"+/0[bB][01]+(?:_[01]+)*n?/.source+"|"+/0[oO][0-7]+(?:_[0-7]+)*n?/.source+"|"+/0[xX][\dA-Fa-f]+(?:_[\dA-Fa-f]+)*n?/.source+"|"+/\d+(?:_\d+)*n/.source+"|"+/(?:\d+(?:_\d+)*(?:\.(?:\d+(?:_\d+)*)?)?|\.\d+(?:_\d+)*)(?:[Ee][+-]?\d+(?:_\d+)*)?/.source)+")"+/(?![\w$])/.source),lookbehind:!0},operator:/--|\+\+|\*\*=?|=>|&&=?|\|\|=?|[!=]==|<<=?|>>>?=?|[-+*/%&|^!=<>]=?|\.{3}|\?\?=?|\?\.?|[~:]/});c.languages.javascript["class-name"][0].pattern=/(\b(?:class|extends|implements|instanceof|interface|new)\s+)[\w.\\]+/;c.languages.insertBefore("javascript","keyword",{regex:{pattern:RegExp(/((?:^|[^$\w\xA0-\uFFFF."'\])\s]|\b(?:return|yield))\s*)/.source+/\//.source+"(?:"+/(?:\[(?:[^\]\\\r\n]|\\.)*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}/.source+"|"+/(?:\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.)*\])*\])*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}v[dgimyus]{0,7}/.source+")"+/(?=(?:\s|\/\*(?:[^*]|\*(?!\/))*\*\/)*(?:$|[\r\n,.;:})\]]|\/\/))/.source),lookbehind:!0,greedy:!0,inside:{"regex-source":{pattern:/^(\/)[\s\S]+(?=\/[a-z]*$)/,lookbehind:!0,alias:"language-regex",inside:c.languages.regex},"regex-delimiter":/^\/|\/$/,"regex-flags":/^[a-z]+$/}},"function-variable":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*[=:]\s*(?:async\s*)?(?:\bfunction\b|(?:\((?:[^()]|\([^()]*\))*\)|(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)\s*=>))/,alias:"function"},parameter:[{pattern:/(function(?:\s+(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)?\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\))/,lookbehind:!0,inside:c.languages.javascript},{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$a-z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*=>)/i,lookbehind:!0,inside:c.languages.javascript},{pattern:/(\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*=>)/,lookbehind:!0,inside:c.languages.javascript},{pattern:/((?:\b|\s|^)(?!(?:as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)(?![$\w\xA0-\uFFFF]))(?:(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*)\(\s*|\]\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*\{)/,lookbehind:!0,inside:c.languages.javascript}],constant:/\b[A-Z](?:[A-Z_]|\dx?)*\b/});c.languages.insertBefore("javascript","string",{hashbang:{pattern:/^#!.*/,greedy:!0,alias:"comment"},"template-string":{pattern:/`(?:\\[\s\S]|\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}|(?!\$\{)[^\\`])*`/,greedy:!0,inside:{"template-punctuation":{pattern:/^`|`$/,alias:"string"},interpolation:{pattern:/((?:^|[^\\])(?:\\{2})*)\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}/,lookbehind:!0,inside:{"interpolation-punctuation":{pattern:/^\$\{|\}$/,alias:"punctuation"},rest:c.languages.javascript}},string:/[\s\S]+/}},"string-property":{pattern:/((?:^|[,{])[ \t]*)(["'])(?:\\(?:\r\n|[\s\S])|(?!\2)[^\\\r\n])*\2(?=\s*:)/m,lookbehind:!0,greedy:!0,alias:"property"}});c.languages.insertBefore("javascript","operator",{"literal-property":{pattern:/((?:^|[,{])[ \t]*)(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*:)/m,lookbehind:!0,alias:"property"}});c.languages.markup&&(c.languages.markup.tag.addInlined("script","javascript"),c.languages.markup.tag.addAttribute(/on(?:abort|blur|change|click|composition(?:end|start|update)|dblclick|error|focus(?:in|out)?|key(?:down|up)|load|mouse(?:down|enter|leave|move|out|over|up)|reset|resize|scroll|select|slotchange|submit|unload|wheel)/.source,"javascript"));c.languages.js=c.languages.javascript;(function(){if(typeof c>"u"||typeof document>"u")return;Element.prototype.matches||(Element.prototype.matches=Element.prototype.msMatchesSelector||Element.prototype.webkitMatchesSelector);var t="Loading\u2026",e=function(x,_){return"\u2716 Error "+x+" while fetching file: "+_},r="\u2716 Error: File does not exist or is empty",i={js:"javascript",py:"python",rb:"ruby",ps1:"powershell",psm1:"powershell",sh:"bash",bat:"batch",h:"c",tex:"latex"},n="data-src-status",p="loading",h="loaded",m="failed",v="pre[data-src]:not(["+n+'="'+h+'"]):not(['+n+'="'+p+'"])';function E(x,_,T){var s=new XMLHttpRequest;s.open("GET",x,!0),s.onreadystatechange=function(){s.readyState==4&&(s.status<400&&s.responseText?_(s.responseText):s.status>=400?T(e(s.status,s.statusText)):T(r))},s.send(null)}function w(x){var _=/^\s*(\d+)\s*(?:(,)\s*(?:(\d+)\s*)?)?$/.exec(x||"");if(_){var T=Number(_[1]),s=_[2],a=_[3];return s?a?[T,Number(a)]:[T,void 0]:[T,T]}}c.hooks.add("before-highlightall",function(x){x.selector+=", "+v}),c.hooks.add("before-sanity-check",function(x){var _=x.element;if(_.matches(v)){x.code="",_.setAttribute(n,p);var T=_.appendChild(document.createElement("CODE"));T.textContent=t;var s=_.getAttribute("data-src"),a=x.language;if(a==="none"){var l=(/\.(\w+)$/.exec(s)||[,"none"])[1];a=i[l]||l}c.util.setLanguage(T,a),c.util.setLanguage(_,a);var o=c.plugins.autoloader;o&&o.loadLanguages(a),E(s,function(u){_.setAttribute(n,h);var f=w(_.getAttribute("data-range"));if(f){var b=u.split(/\r\n?|\n/g),d=f[0],A=f[1]==null?b.length:f[1];d<0&&(d+=b.length),d=Math.max(0,Math.min(d-1,b.length)),A<0&&(A+=b.length),A=Math.max(0,Math.min(A,b.length)),u=b.slice(d,A).join(`
-`),_.hasAttribute("data-start")||_.setAttribute("data-start",String(d+1))}T.textContent=u,c.highlightElement(T)},function(u){_.setAttribute(n,m),T.textContent=u})}}),c.plugins.fileHighlight={highlight:function(_){for(var T=(_||document).querySelectorAll(v),s=0,a;a=T[s++];)c.highlightElement(a)}};var F=!1;c.fileHighlight=function(){F||(console.warn("Prism.fileHighlight is deprecated. Use `Prism.plugins.fileHighlight.highlight` instead."),F=!0),c.plugins.fileHighlight.highlight.apply(this,arguments)}})()});var ue=O((Tr,mt)=>{mt.exports={...Ie()}});var ir={};Pt(ir,{BUILD_ID:()=>sr,TempleComponent:()=>k.TempleComponent,TempleElement:()=>k.TempleElement,TempleEmitter:()=>k.TempleEmitter,TempleException:()=>k.TempleException,TempleRegistry:()=>k.TempleRegistry,children:()=>k.children,components:()=>ar,data:()=>k.data,emitter:()=>k.emitter,props:()=>k.props,signal:()=>k.signal});var C=D(I());var Ae=D(I()),Z=class extends Ae.TempleComponent{static component=["main","Main_fd7f1af6410c5b5c8e1f"];styles(){return""}template(){let e=this.props,r=()=>this.originalChildren;return()=>[Ae.TempleRegistry.createElement("main",{},[...this._toNodeList(r())]).element]}};var y=D(I()),ze=D(ht()),bt=D(ue()),W=class extends y.TempleComponent{static component=["code","Code_6f36bc13bb6a166c7abc"];styles(){return`:host {
+var TempleAPI=(()=>{var Rt=Object.create;var Le=Object.defineProperty;var qt=Object.getOwnPropertyDescriptor;var It=Object.getOwnPropertyNames;var Ht=Object.getPrototypeOf,zt=Object.prototype.hasOwnProperty;var D=(t,e)=>()=>(e||t((e={exports:{}}).exports,e),e.exports),Bt=(t,e)=>{for(var r in e)Le(t,r,{get:e[r],enumerable:!0})},ct=(t,e,r,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let n of It(e))!zt.call(t,n)&&n!==r&&Le(t,n,{get:()=>e[n],enumerable:!(i=qt(e,n))||i.enumerable});return t};var k=(t,e,r)=>(r=t!=null?Rt(Ht(t)):{},ct(e||!t||!t.__esModule?Le(r,"default",{value:t,enumerable:!0}):r,t)),Gt=t=>ct(Le({},"__esModule",{value:!0}),t);var ce=D(Xe=>{"use strict";Object.defineProperty(Xe,"__esModule",{value:!0});var Je=class extends Error{static for(e,...r){return r.forEach(function(i){e=e.replace("%s",i)}),new this(e)}static forErrorsFound(e){let r=new this("Invalid Parameters");return r.errors=e,r}static require(e,r,...i){if(!e){for(let n of i)r=r.replace("%s",n);throw new this(r)}}constructor(e,r=500){super(),this.errors={},this.start=0,this.end=0,this.message=e,this.name=this.constructor.name,this.code=r}withCode(e){return this.code=e,this}withPosition(e,r){return this.start=e,this.end=r,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};Xe.default=Je});var Ce=D(M=>{"use strict";var Wt=M&&M.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(M,"__esModule",{value:!0});M.match=M.TempleEmitter=M.events=void 0;M.bindAttribute=B;M.unbindAttribute=ft;var dt=Wt(De());M.events=["click","dblclick","mousedown","mouseup","mousemove","mouseover","mouseout","wheel","keydown","keypress","keyup","blur","change","contextmenu","focus","input","submit","invalid","reset","search","select","copy","cut","paste","drag","dragstart","dragend","dragover","dragenter","dragleave","drop","scroll","durationchange","ended","error","loadeddata","loadedmetadata","loadstart","pause","play","playing","progress","ratechange","seeked","seeking","stalled","suspend","timeupdate","volumechange","waiting","animationstart","animationend","animationiteration","transitionend","toggle"];var Pe=class extends EventTarget{emit(e,r){return this.dispatchEvent(new CustomEvent(e,{detail:r})),this}on(e,r){if(e==="ready"&&document.readyState!=="loading"){let i=new CustomEvent("ready");return setTimeout(()=>r(i),1),this}return this.addEventListener(e,r),this}once(e,r){let i=n=>{this.unbind(e,i),r(n)};return this.on(e,i),this}unbind(e,r){return this.removeEventListener(e,r),this}};M.TempleEmitter=Pe;var Ut=(t,e)=>Array.from(t.querySelectorAll("*")).filter(r=>{let i=dt.default.get(r),n=i&&i.hasAttribute(e)&&!i.hasEvent(e);return n&&i.addEvent(e),n}).map(r=>dt.default.get(r));M.match=Ut;function B(t,e){Se.on("mounted",r=>{if(!r.detail)return;let i=r.detail;(0,M.match)(i.shadowRoot||i,t).forEach(e)})}function ft(t,e){Se.on("unmounted",r=>{if(!r.detail)return;let i=r.detail;(0,M.match)(i.shadowRoot||i,t).forEach(e)})}var Se=new Pe;M.default=(document.onreadystatechange=()=>{document.readyState!=="loading"&&Se.emit("ready")},B("mount",t=>{let e=t.getAttribute("mount");if(typeof e=="function"){let r=new CustomEvent("mount",{detail:{node:t,target:t.element}});e(r)}}),ft("unmount",t=>{let e=t.getAttribute("unmount");if(typeof e=="function"){let r=new CustomEvent("unmount",{detail:{node:t,target:t.element}});e(r)}}),B("connect",t=>{let e=t.getAttribute("connect");if(typeof e=="function"){let r=new CustomEvent("connect",{detail:{node:t,target:t.element}});e(r)}}),B("disconnect",t=>{let e=t.getAttribute("disconnect");if(typeof e=="function"){let r=new CustomEvent("disconnect",{detail:{node:t,target:t.element}});e(r)}}),B("adopt",t=>{let e=t.getAttribute("adopt");if(typeof e=="function"){let r=new CustomEvent("adopt",{detail:{node:t,target:t.element}});e(r)}}),B("if",t=>{let e=t.getAttribute("if");(e===!1||e==="false"||typeof e=="function"&&!e())&&t.element.remove()}),M.events.forEach(t=>B(t,e=>{let r=e.getAttribute(t);typeof r=="function"&&(e.element.removeEventListener(t,r),e.element.addEventListener(t,r))})),Se)});var Ke=D(de=>{"use strict";var Zt=de&&de.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(de,"__esModule",{value:!0});var Ye=Zt(Ce()),Ve=class{get attributes(){return Object.assign({},this._attributes)}get element(){return this._element}get events(){return this._events}constructor(e,r){this._events=new Set,this._element=e,this._attributes=r}addEvent(e){return this._events.add(e),this}getAttribute(e){return this._attributes[e]}hasAttribute(e){return e in this._attributes}hasEvent(e){return this._events.has(e)}removeAttribute(e,r=!1){let i=this.getAttribute(e);return typeof i>"u"?this:(delete this._attributes[e],this._element.removeAttribute(e),r||Ye.default.emit("attribute-remove",{element:this,key:e,previous:i}),this)}setAttribute(e,r,i=!1){if(typeof r>"u")return this.removeAttribute(e,i);let n=this.getAttribute(e);return n===r?this:(this._attributes[e]=r,typeof r=="string"&&this._element.setAttribute(e,r),i||(typeof n>"u"?Ye.default.emit("attribute-create",{element:this,key:e,value:r}):Ye.default.emit("attribute-update",{element:this,key:e,value:r,previous:n})),this)}setAttributes(e,r=!1){for(let[n,d]of Object.entries(e))this.setAttribute(n,d,r);let i=Object.keys(e);for(let n of Object.keys(this._attributes))i.includes(n)||this.removeAttribute(n,r);return this}};de.default=Ve});var De=D(fe=>{"use strict";var Jt=fe&&fe.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(fe,"__esModule",{value:!0});var Xt=Jt(Ke()),pt=document.createElement("textarea"),Yt=t=>(pt.innerHTML=t,pt.value),Me=class{static get elements(){return this._elements}static createComponent(e,r,i,n=[]){let d=document.createElement("template");d.innerHTML=`<${e}>`;let m=d.content.querySelector(`${e}`);return Object.setPrototypeOf(m,r.prototype),m.constructor=r.constructor,m.constructor.component=r.component,m.register(i,n),m.element}static createElement(e,r,i=[]){let n=document.createElement(e);for(let[d,b]of Object.entries(r))typeof b=="string"?n.setAttribute(d,b):b===!0&&n.setAttribute(d,d);return i.filter(d=>typeof d<"u").forEach(d=>n.appendChild(d)),this.register(n,r)}static createText(e,r=!0){return document.createTextNode(Yt(e))}static filter(e){let r=[];return this._elements.forEach((i,n)=>{e(i,n)&&r.push(i)}),r}static get(e){return this._elements.get(e)||null}static has(e){return this._elements.has(e)}static map(e){let r=[];return this._elements.forEach((i,n)=>{r.push(e(i,n))}),r}static register(e,r){if(this.has(e))return this.get(e);let i=new Xt.default(e,r||{});return this._elements.set(e,i),i}};Me._elements=new Map;fe.default=Me});var Y=D(pe=>{"use strict";Object.defineProperty(pe,"__esModule",{value:!0});pe.TempleDataMap=void 0;var Oe=class{constructor(){window.__APP_DATA__||(window.__APP_DATA__={})}clear(){return window.__APP_DATA__={},this}delete(e){return this.has(e)?(delete window.__APP_DATA__[e],!0):!1}entries(){return Object.entries(window.__APP_DATA__)}has(e){return e in window.__APP_DATA__}get(e){return window.__APP_DATA__[e]}keys(){return Object.keys(window.__APP_DATA__)}set(e,r){return window.__APP_DATA__[e]=r,this}values(){return Object.values(window.__APP_DATA__)}};pe.TempleDataMap=Oe;var Vt=new Oe;pe.default=Vt});var mt=D(he=>{"use strict";var $e=he&&he.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(he,"__esModule",{value:!0});var ht=$e(ce()),G=$e(De()),W=$e(Ce()),je=$e(Y()),Qe=class t extends HTMLElement{static register(){customElements.define(this.component[0],this)}get attr(){return Object.fromEntries(Array.from(this.attributes).map(e=>[e.name,e.value]))}get element(){if(!G.default.has(this))throw ht.default.for("Component not mapped.");return G.default.get(this)}get metadata(){let[e,r]=this.constructor.component;return{tagname:e,classname:r}}get originalChildren(){return this._children}get initiated(){return this._initiated}get props(){return this.getAttributes()}get virtual(){return this._virtual}set props(e){this.setAttributes(e)}constructor(){if(super(),this._initiated=!1,this._template=null,this._children=void 0,this._rendering=!1,this._observer=null,this._virtual=!1,!G.default.has(this))throw ht.default.for("Component not mapped.")}adoptedCallback(){this.render(),W.default.emit("adopt",this)}connectedCallback(){this.wait(),W.default.emit("connect",this)}disconnectedCallback(){W.default.emit("disconnect",this)}getAttribute(e){return this.element.getAttribute(e)}getAttributes(){return Object.assign({},this.element.attributes)}getParentComponent(){let e=this.parentElement;for(;e;){if(e instanceof t)return e;e=e.parentElement}return null}hasAttribute(e){return this.element.hasAttribute(e)}register(e={},r=[]){G.default.has(this)?G.default.get(this).setAttributes(e):G.default.register(this,e);for(let[i,n]of Object.entries(e))typeof n=="string"?super.setAttribute(i,n):n===!0&&super.setAttribute(i,i);this._children=r,this._virtual=!0,this.connectedCallback()}removeAttribute(e){this.hasAttribute(e)&&this.element.removeAttribute(e),super.hasAttribute(e)&&super.removeAttribute(e)}render(){let e=this.getParentComponent();if(e&&!e.initiated)return;if(this._rendering)return;this._rendering=!0;let r=je.default.get("current");je.default.set("current",this);let i=this.styles();this._template?W.default.emit("unmounted",this):this._template=this.template();let n=this._template().filter(Boolean);if(i.length===0)this.textContent="",n.forEach(d=>this.appendChild(d));else{this.shadowRoot||this.attachShadow({mode:"open"});let d=this.shadowRoot;this.textContent="",d.textContent="";let b=document.createElement("style");b.innerText=i,d.appendChild(b),n.forEach(m=>{var v;return(v=this.shadowRoot)===null||v===void 0?void 0:v.appendChild(m)})}return r?je.default.set("current",r):je.default.delete("current"),this._initiated=!0,this._rendering=!1,W.default.emit("mounted",this),this.shadowRoot?this.shadowRoot.innerHTML:this.innerHTML}setAttribute(e,r){this.element.setAttribute(e,r),(typeof r=="string"||r===!0)&&super.setAttribute(e,r)}setAttributes(e){this.element.setAttributes(e)}wait(){if(document.readyState!=="loading")this._update();else{let e=()=>{this._update(),W.default.unbind("ready",e)};W.default.on("ready",e)}}_toNodeList(e){return e instanceof Node?[e]:Array.isArray(e)&&e.every(r=>r instanceof Node)?e:[G.default.createText(String(e))]}_update(){typeof this._children>"u"&&(this._children=Array.from(this.childNodes||[])),this._initiated||this.render()}};he.default=Qe});var V=D(me=>{"use strict";var gt=me&&me.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(me,"__esModule",{value:!0});me.default=er;var Kt=gt(ce()),Qt=gt(Y());function er(t=null,e=!1){if(!t&&(t=Qt.default.get("current"),!t)){if(!e)throw Kt.default.for("Not called within a Temple component");return null}return t}});var bt=D(ge=>{"use strict";var tr=ge&&ge.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ge,"__esModule",{value:!0});var rr=tr(Y());function nr(t){let e=rr.default.get("env")||{};return t?e[t]||null:e}ge.default=nr});var et=D(be=>{"use strict";var _t=be&&be.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(be,"__esModule",{value:!0});be.default=ir;var sr=_t(V()),ar=_t(Y());function ir(t=null){let e=(0,sr.default)(t,!0);return typeof e=="string"?ar.default.get("props")||{}:e?e.props:{}}});var yt=D(K=>{"use strict";var vt=K&&K.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(K,"__esModule",{value:!0});K.classlist=ur;K.default=cr;var lr=vt(V()),or=vt(et());function ur(t=null){var e;if(t==="body")return document.body.classList;if(t==="head")return document.head.classList;if(t==="document")return(e=document.body.parentElement)===null||e===void 0?void 0:e.classList;let r=(0,lr.default)(t);return r?.classList}function cr(t=null){return(0,or.default)(t).class}});var xt=D(U=>{"use strict";var dr=U&&U.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(U,"__esModule",{value:!0});U.innerHTML=pr;U.innerText=hr;U.default=tt;var fr=dr(V());function pr(t=null){let e=tt(t),r=document.createElement("template");return r.append(...e.map(i=>i.cloneNode(!0))),r.innerHTML}function hr(t=null){let e=tt(t),r=document.createElement("template");return r.append(...e.map(i=>i.cloneNode(!0))),r.innerText}function tt(t=null){let e=(0,fr.default)(t,!0);return typeof e!="string"&&e?e.originalChildren||[]:[]}});var At=D(Z=>{"use strict";var wt=Z&&Z.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Z,"__esModule",{value:!0});Z.SignalRegistry=void 0;Z.default=br;var mr=wt(V()),gr=wt(ce()),Q=class t{static observe(e,r){let i={getter:()=>d.raw,setter:m=>m},n=new Set,d={raw:r,change(m){n.add(m)},getter(m){return i.getter=m,d},setter(m){return i.setter=m,d}};Object.defineProperty(d,"value",{get(){return i.getter()},set(m){let v=i.setter(m),w=t.serialize(v)!==t.serialize(d.raw);d.raw=v,w&&(n.forEach(g=>g(v)),e.render())}});let b=this._observers.get(e);return b?(b.observed++,b.values.push(d)):this._observers.set(e,{observed:1,values:[d]}),d}static observer(e){return this._observers.get(e)||null}static serialize(e){return JSON.stringify(e)}};Z.SignalRegistry=Q;Q._observers=new Map;function br(t,e=null){let r=(0,mr.default)(e);if(!r.initiated)return Q.observe(r,t);let i=Q.observer(r);if(!i)throw gr.default.for("Signal state mismatch");return i.values[i.observed++%i.values.length]}});var nt=D(h=>{"use strict";var _r=h&&h.__createBinding||(Object.create?function(t,e,r,i){i===void 0&&(i=r);var n=Object.getOwnPropertyDescriptor(e,r);(!n||("get"in n?!e.__esModule:n.writable||n.configurable))&&(n={enumerable:!0,get:function(){return e[r]}}),Object.defineProperty(t,i,n)}:function(t,e,r,i){i===void 0&&(i=r),t[i]=e[r]}),vr=h&&h.__setModuleDefault||(Object.create?function(t,e){Object.defineProperty(t,"default",{enumerable:!0,value:e})}:function(t,e){t.default=e}),_e=h&&h.__importStar||function(t){if(t&&t.__esModule)return t;var e={};if(t!=null)for(var r in t)r!=="default"&&Object.prototype.hasOwnProperty.call(t,r)&&_r(e,t,r);return vr(e,t),e},J=h&&h.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(h,"__esModule",{value:!0});h.SignalRegistry=h.TempleException=h.TempleEmitter=h.TempleElement=h.TempleRegistry=h.TempleComponent=h.TempleDataMap=h.emitter=h.signal=h.innerHTML=h.innerText=h.children=h.classnames=h.classlist=h.props=h.env=h.data=h.component=void 0;var yr=J(ce());h.TempleException=yr.default;var xr=J(mt());h.TempleComponent=xr.default;var wr=J(De());h.TempleRegistry=wr.default;var Ar=J(Ke());h.TempleElement=Ar.default;var Tt=_e(Ce());h.emitter=Tt.default;Object.defineProperty(h,"TempleEmitter",{enumerable:!0,get:function(){return Tt.TempleEmitter}});var Tr=J(V());h.component=Tr.default;var Et=_e(Y());h.data=Et.default;Object.defineProperty(h,"TempleDataMap",{enumerable:!0,get:function(){return Et.TempleDataMap}});var Er=J(bt());h.env=Er.default;var Fr=J(et());h.props=Fr.default;var Ft=_e(yt());h.classnames=Ft.default;Object.defineProperty(h,"classlist",{enumerable:!0,get:function(){return Ft.classlist}});var rt=_e(xt());h.children=rt.default;Object.defineProperty(h,"innerHTML",{enumerable:!0,get:function(){return rt.innerHTML}});Object.defineProperty(h,"innerText",{enumerable:!0,get:function(){return rt.innerText}});var kt=_e(At());h.signal=kt.default;Object.defineProperty(h,"SignalRegistry",{enumerable:!0,get:function(){return kt.SignalRegistry}})});var $=D((Ur,Lt)=>{Lt.exports={...nt()}});var I=D((Zr,Pt)=>{Pt.exports={...nt()}});var Ct=D((en,ze)=>{var kr=typeof window<"u"?window:typeof WorkerGlobalScope<"u"&&self instanceof WorkerGlobalScope?self:{};var c=function(t){var e=/(?:^|\s)lang(?:uage)?-([\w-]+)(?=\s|$)/i,r=0,i={},n={manual:t.Prism&&t.Prism.manual,disableWorkerMessageHandler:t.Prism&&t.Prism.disableWorkerMessageHandler,util:{encode:function a(s){return s instanceof d?new d(s.type,a(s.content),s.alias):Array.isArray(s)?s.map(a):s.replace(/&/g,"&").replace(/"u")return null;if("currentScript"in document)return document.currentScript;try{throw new Error}catch(o){var a=(/at [^(\r\n]*\((.*):[^:]+:[^:]+\)$/i.exec(o.stack)||[])[1];if(a){var s=document.getElementsByTagName("script");for(var l in s)if(s[l].src==a)return s[l]}return null}},isActive:function(a,s,l){for(var o="no-"+s;a;){var u=a.classList;if(u.contains(s))return!0;if(u.contains(o))return!1;a=a.parentElement}return!!l}},languages:{plain:i,plaintext:i,text:i,txt:i,extend:function(a,s){var l=n.util.clone(n.languages[a]);for(var o in s)l[o]=s[o];return l},insertBefore:function(a,s,l,o){o=o||n.languages;var u=o[a],p={};for(var _ in u)if(u.hasOwnProperty(_)){if(_==s)for(var f in l)l.hasOwnProperty(f)&&(p[f]=l[f]);l.hasOwnProperty(_)||(p[_]=u[_])}var T=o[a];return o[a]=p,n.languages.DFS(n.languages,function(S,H){H===T&&S!=a&&(this[S]=p)}),p},DFS:function a(s,l,o,u){u=u||{};var p=n.util.objId;for(var _ in s)if(s.hasOwnProperty(_)){l.call(s,_,s[_],o||_);var f=s[_],T=n.util.type(f);T==="Object"&&!u[p(f)]?(u[p(f)]=!0,a(f,l,null,u)):T==="Array"&&!u[p(f)]&&(u[p(f)]=!0,a(f,l,_,u))}}},plugins:{},highlightAll:function(a,s){n.highlightAllUnder(document,a,s)},highlightAllUnder:function(a,s,l){var o={callback:l,container:a,selector:'code[class*="language-"], [class*="language-"] code, code[class*="lang-"], [class*="lang-"] code'};n.hooks.run("before-highlightall",o),o.elements=Array.prototype.slice.apply(o.container.querySelectorAll(o.selector)),n.hooks.run("before-all-elements-highlight",o);for(var u=0,p;p=o.elements[u++];)n.highlightElement(p,s===!0,o.callback)},highlightElement:function(a,s,l){var o=n.util.getLanguage(a),u=n.languages[o];n.util.setLanguage(a,o);var p=a.parentElement;p&&p.nodeName.toLowerCase()==="pre"&&n.util.setLanguage(p,o);var _=a.textContent,f={element:a,language:o,grammar:u,code:_};function T(H){f.highlightedCode=H,n.hooks.run("before-insert",f),f.element.innerHTML=f.highlightedCode,n.hooks.run("after-highlight",f),n.hooks.run("complete",f),l&&l.call(f.element)}if(n.hooks.run("before-sanity-check",f),p=f.element.parentElement,p&&p.nodeName.toLowerCase()==="pre"&&!p.hasAttribute("tabindex")&&p.setAttribute("tabindex","0"),!f.code){n.hooks.run("complete",f),l&&l.call(f.element);return}if(n.hooks.run("before-highlight",f),!f.grammar){T(n.util.encode(f.code));return}if(s&&t.Worker){var S=new Worker(n.filename);S.onmessage=function(H){T(H.data)},S.postMessage(JSON.stringify({language:f.language,code:f.code,immediateClose:!0}))}else T(n.highlight(f.code,f.grammar,f.language))},highlight:function(a,s,l){var o={code:a,grammar:s,language:l};if(n.hooks.run("before-tokenize",o),!o.grammar)throw new Error('The language "'+o.language+'" has no grammar.');return o.tokens=n.tokenize(o.code,o.grammar),n.hooks.run("after-tokenize",o),d.stringify(n.util.encode(o.tokens),o.language)},tokenize:function(a,s){var l=s.rest;if(l){for(var o in l)s[o]=l[o];delete s.rest}var u=new v;return w(u,u.head,a),m(a,u,s,u.head,0),A(u)},hooks:{all:{},add:function(a,s){var l=n.hooks.all;l[a]=l[a]||[],l[a].push(s)},run:function(a,s){var l=n.hooks.all[a];if(!(!l||!l.length))for(var o=0,u;u=l[o++];)u(s)}},Token:d};t.Prism=n;function d(a,s,l,o){this.type=a,this.content=s,this.alias=l,this.length=(o||"").length|0}d.stringify=function a(s,l){if(typeof s=="string")return s;if(Array.isArray(s)){var o="";return s.forEach(function(T){o+=a(T,l)}),o}var u={type:s.type,content:a(s.content,l),tag:"span",classes:["token",s.type],attributes:{},language:l},p=s.alias;p&&(Array.isArray(p)?Array.prototype.push.apply(u.classes,p):u.classes.push(p)),n.hooks.run("wrap",u);var _="";for(var f in u.attributes)_+=" "+f+'="'+(u.attributes[f]||"").replace(/"/g,""")+'"';return"<"+u.tag+' class="'+u.classes.join(" ")+'"'+_+">"+u.content+""};function b(a,s,l,o){a.lastIndex=s;var u=a.exec(l);if(u&&o&&u[1]){var p=u[1].length;u.index+=p,u[0]=u[0].slice(p)}return u}function m(a,s,l,o,u,p){for(var _ in l)if(!(!l.hasOwnProperty(_)||!l[_])){var f=l[_];f=Array.isArray(f)?f:[f];for(var T=0;T=p.reach);q+=C.value.length,C=C.next){var X=C.value;if(s.length>a.length)return;if(!(X instanceof d)){var Te=1,R;if(lt){if(R=b(ot,q,a,it),!R||R.index>=a.length)break;var Ee=R.index,$t=R.index+R[0].length,z=q;for(z+=C.value.length;Ee>=z;)C=C.next,z+=C.value.length;if(z-=C.value.length,q=z,C.value instanceof d)continue;for(var ue=C;ue!==s.tail&&(z<$t||typeof ue.value=="string");ue=ue.next)Te++,z+=ue.value.length;Te--,X=a.slice(q,z),R.index-=q}else if(R=b(ot,0,X,it),!R)continue;var Ee=R.index,Fe=R[0],We=X.slice(0,Ee),ut=X.slice(Ee+Fe.length),Ue=q+X.length;p&&Ue>p.reach&&(p.reach=Ue);var ke=C.prev;We&&(ke=w(s,ke,We),q+=We.length),g(s,ke,Te);var Nt=new d(_,H?n.tokenize(Fe,H):Fe,Ot,Fe);if(C=w(s,ke,Nt),ut&&w(s,C,ut),Te>1){var Ze={cause:_+","+T,reach:Ue};m(a,s,l,C.prev,q,Ze),p&&Ze.reach>p.reach&&(p.reach=Ze.reach)}}}}}}function v(){var a={value:null,prev:null,next:null},s={value:null,prev:a,next:null};a.next=s,this.head=a,this.tail=s,this.length=0}function w(a,s,l){var o=s.next,u={value:l,prev:s,next:o};return s.next=u,o.prev=u,a.length++,u}function g(a,s,l){for(var o=s.next,u=0;u/,greedy:!0},prolog:{pattern:/<\?[\s\S]+?\?>/,greedy:!0},doctype:{pattern:/"'[\]]|"[^"]*"|'[^']*')+(?:\[(?:[^<"'\]]|"[^"]*"|'[^']*'|<(?!!--)|)*\]\s*)?>/i,greedy:!0,inside:{"internal-subset":{pattern:/(^[^\[]*\[)[\s\S]+(?=\]>$)/,lookbehind:!0,greedy:!0,inside:null},string:{pattern:/"[^"]*"|'[^']*'/,greedy:!0},punctuation:/^$|[[\]]/,"doctype-tag":/^DOCTYPE/i,name:/[^\s<>'"]+/}},cdata:{pattern://i,greedy:!0},tag:{pattern:/<\/?(?!\d)[^\s>\/=$<%]+(?:\s(?:\s*[^\s>\/=]+(?:\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))|(?=[\s/>])))+)?\s*\/?>/,greedy:!0,inside:{tag:{pattern:/^<\/?[^\s>\/]+/,inside:{punctuation:/^<\/?/,namespace:/^[^\s>\/:]+:/}},"special-attr":[],"attr-value":{pattern:/=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+)/,inside:{punctuation:[{pattern:/^=/,alias:"attr-equals"},{pattern:/^(\s*)["']|["']$/,lookbehind:!0}]}},punctuation:/\/?>/,"attr-name":{pattern:/[^\s>\/]+/,inside:{namespace:/^[^\s>\/:]+:/}}}},entity:[{pattern:/&[\da-z]{1,8};/i,alias:"named-entity"},/&#x?[\da-f]{1,8};/i]};c.languages.markup.tag.inside["attr-value"].inside.entity=c.languages.markup.entity;c.languages.markup.doctype.inside["internal-subset"].inside=c.languages.markup;c.hooks.add("wrap",function(t){t.type==="entity"&&(t.attributes.title=t.content.replace(/&/,"&"))});Object.defineProperty(c.languages.markup.tag,"addInlined",{value:function(e,r){var i={};i["language-"+r]={pattern:/(^$)/i,lookbehind:!0,inside:c.languages[r]},i.cdata=/^$/i;var n={"included-cdata":{pattern://i,inside:i}};n["language-"+r]={pattern:/[\s\S]+/,inside:c.languages[r]};var d={};d[e]={pattern:RegExp(/(<__[^>]*>)(?:))*\]\]>|(?!)/.source.replace(/__/g,function(){return e}),"i"),lookbehind:!0,greedy:!0,inside:n},c.languages.insertBefore("markup","cdata",d)}});Object.defineProperty(c.languages.markup.tag,"addAttribute",{value:function(t,e){c.languages.markup.tag.inside["special-attr"].push({pattern:RegExp(/(^|["'\s])/.source+"(?:"+t+")"+/\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))/.source,"i"),lookbehind:!0,inside:{"attr-name":/^[^\s=]+/,"attr-value":{pattern:/=[\s\S]+/,inside:{value:{pattern:/(^=\s*(["']|(?!["'])))\S[\s\S]*(?=\2$)/,lookbehind:!0,alias:[e,"language-"+e],inside:c.languages[e]},punctuation:[{pattern:/^=/,alias:"attr-equals"},/"|'/]}}}})}});c.languages.html=c.languages.markup;c.languages.mathml=c.languages.markup;c.languages.svg=c.languages.markup;c.languages.xml=c.languages.extend("markup",{});c.languages.ssml=c.languages.xml;c.languages.atom=c.languages.xml;c.languages.rss=c.languages.xml;(function(t){var e=/(?:"(?:\\(?:\r\n|[\s\S])|[^"\\\r\n])*"|'(?:\\(?:\r\n|[\s\S])|[^'\\\r\n])*')/;t.languages.css={comment:/\/\*[\s\S]*?\*\//,atrule:{pattern:RegExp("@[\\w-](?:"+/[^;{\s"']|\s+(?!\s)/.source+"|"+e.source+")*?"+/(?:;|(?=\s*\{))/.source),inside:{rule:/^@[\w-]+/,"selector-function-argument":{pattern:/(\bselector\s*\(\s*(?![\s)]))(?:[^()\s]|\s+(?![\s)])|\((?:[^()]|\([^()]*\))*\))+(?=\s*\))/,lookbehind:!0,alias:"selector"},keyword:{pattern:/(^|[^\w-])(?:and|not|only|or)(?![\w-])/,lookbehind:!0}}},url:{pattern:RegExp("\\burl\\((?:"+e.source+"|"+/(?:[^\\\r\n()"']|\\[\s\S])*/.source+")\\)","i"),greedy:!0,inside:{function:/^url/i,punctuation:/^\(|\)$/,string:{pattern:RegExp("^"+e.source+"$"),alias:"url"}}},selector:{pattern:RegExp(`(^|[{}\\s])[^{}\\s](?:[^{};"'\\s]|\\s+(?![\\s{])|`+e.source+")*(?=\\s*\\{)"),lookbehind:!0},string:{pattern:e,greedy:!0},property:{pattern:/(^|[^-\w\xA0-\uFFFF])(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*(?=\s*:)/i,lookbehind:!0},important:/!important\b/i,function:{pattern:/(^|[^-a-z0-9])[-a-z0-9]+(?=\()/i,lookbehind:!0},punctuation:/[(){};:,]/},t.languages.css.atrule.inside.rest=t.languages.css;var r=t.languages.markup;r&&(r.tag.addInlined("style","css"),r.tag.addAttribute("style","css"))})(c);c.languages.clike={comment:[{pattern:/(^|[^\\])\/\*[\s\S]*?(?:\*\/|$)/,lookbehind:!0,greedy:!0},{pattern:/(^|[^\\:])\/\/.*/,lookbehind:!0,greedy:!0}],string:{pattern:/(["'])(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/,greedy:!0},"class-name":{pattern:/(\b(?:class|extends|implements|instanceof|interface|new|trait)\s+|\bcatch\s+\()[\w.\\]+/i,lookbehind:!0,inside:{punctuation:/[.\\]/}},keyword:/\b(?:break|catch|continue|do|else|finally|for|function|if|in|instanceof|new|null|return|throw|try|while)\b/,boolean:/\b(?:false|true)\b/,function:/\b\w+(?=\()/,number:/\b0x[\da-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:e[+-]?\d+)?/i,operator:/[<>]=?|[!=]=?=?|--?|\+\+?|&&?|\|\|?|[?*/~^%]/,punctuation:/[{}[\];(),.:]/};c.languages.javascript=c.languages.extend("clike",{"class-name":[c.languages.clike["class-name"],{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$A-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\.(?:constructor|prototype))/,lookbehind:!0}],keyword:[{pattern:/((?:^|\})\s*)catch\b/,lookbehind:!0},{pattern:/(^|[^.]|\.\.\.\s*)\b(?:as|assert(?=\s*\{)|async(?=\s*(?:function\b|\(|[$\w\xA0-\uFFFF]|$))|await|break|case|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally(?=\s*(?:\{|$))|for|from(?=\s*(?:['"]|$))|function|(?:get|set)(?=\s*(?:[#\[$\w\xA0-\uFFFF]|$))|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)\b/,lookbehind:!0}],function:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*(?:\.\s*(?:apply|bind|call)\s*)?\()/,number:{pattern:RegExp(/(^|[^\w$])/.source+"(?:"+(/NaN|Infinity/.source+"|"+/0[bB][01]+(?:_[01]+)*n?/.source+"|"+/0[oO][0-7]+(?:_[0-7]+)*n?/.source+"|"+/0[xX][\dA-Fa-f]+(?:_[\dA-Fa-f]+)*n?/.source+"|"+/\d+(?:_\d+)*n/.source+"|"+/(?:\d+(?:_\d+)*(?:\.(?:\d+(?:_\d+)*)?)?|\.\d+(?:_\d+)*)(?:[Ee][+-]?\d+(?:_\d+)*)?/.source)+")"+/(?![\w$])/.source),lookbehind:!0},operator:/--|\+\+|\*\*=?|=>|&&=?|\|\|=?|[!=]==|<<=?|>>>?=?|[-+*/%&|^!=<>]=?|\.{3}|\?\?=?|\?\.?|[~:]/});c.languages.javascript["class-name"][0].pattern=/(\b(?:class|extends|implements|instanceof|interface|new)\s+)[\w.\\]+/;c.languages.insertBefore("javascript","keyword",{regex:{pattern:RegExp(/((?:^|[^$\w\xA0-\uFFFF."'\])\s]|\b(?:return|yield))\s*)/.source+/\//.source+"(?:"+/(?:\[(?:[^\]\\\r\n]|\\.)*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}/.source+"|"+/(?:\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.)*\])*\])*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}v[dgimyus]{0,7}/.source+")"+/(?=(?:\s|\/\*(?:[^*]|\*(?!\/))*\*\/)*(?:$|[\r\n,.;:})\]]|\/\/))/.source),lookbehind:!0,greedy:!0,inside:{"regex-source":{pattern:/^(\/)[\s\S]+(?=\/[a-z]*$)/,lookbehind:!0,alias:"language-regex",inside:c.languages.regex},"regex-delimiter":/^\/|\/$/,"regex-flags":/^[a-z]+$/}},"function-variable":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*[=:]\s*(?:async\s*)?(?:\bfunction\b|(?:\((?:[^()]|\([^()]*\))*\)|(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)\s*=>))/,alias:"function"},parameter:[{pattern:/(function(?:\s+(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)?\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\))/,lookbehind:!0,inside:c.languages.javascript},{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$a-z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*=>)/i,lookbehind:!0,inside:c.languages.javascript},{pattern:/(\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*=>)/,lookbehind:!0,inside:c.languages.javascript},{pattern:/((?:\b|\s|^)(?!(?:as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)(?![$\w\xA0-\uFFFF]))(?:(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*)\(\s*|\]\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*\{)/,lookbehind:!0,inside:c.languages.javascript}],constant:/\b[A-Z](?:[A-Z_]|\dx?)*\b/});c.languages.insertBefore("javascript","string",{hashbang:{pattern:/^#!.*/,greedy:!0,alias:"comment"},"template-string":{pattern:/`(?:\\[\s\S]|\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}|(?!\$\{)[^\\`])*`/,greedy:!0,inside:{"template-punctuation":{pattern:/^`|`$/,alias:"string"},interpolation:{pattern:/((?:^|[^\\])(?:\\{2})*)\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}/,lookbehind:!0,inside:{"interpolation-punctuation":{pattern:/^\$\{|\}$/,alias:"punctuation"},rest:c.languages.javascript}},string:/[\s\S]+/}},"string-property":{pattern:/((?:^|[,{])[ \t]*)(["'])(?:\\(?:\r\n|[\s\S])|(?!\2)[^\\\r\n])*\2(?=\s*:)/m,lookbehind:!0,greedy:!0,alias:"property"}});c.languages.insertBefore("javascript","operator",{"literal-property":{pattern:/((?:^|[,{])[ \t]*)(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*:)/m,lookbehind:!0,alias:"property"}});c.languages.markup&&(c.languages.markup.tag.addInlined("script","javascript"),c.languages.markup.tag.addAttribute(/on(?:abort|blur|change|click|composition(?:end|start|update)|dblclick|error|focus(?:in|out)?|key(?:down|up)|load|mouse(?:down|enter|leave|move|out|over|up)|reset|resize|scroll|select|slotchange|submit|unload|wheel)/.source,"javascript"));c.languages.js=c.languages.javascript;(function(){if(typeof c>"u"||typeof document>"u")return;Element.prototype.matches||(Element.prototype.matches=Element.prototype.msMatchesSelector||Element.prototype.webkitMatchesSelector);var t="Loading\u2026",e=function(E,y){return"\u2716 Error "+E+" while fetching file: "+y},r="\u2716 Error: File does not exist or is empty",i={js:"javascript",py:"python",rb:"ruby",ps1:"powershell",psm1:"powershell",sh:"bash",bat:"batch",h:"c",tex:"latex"},n="data-src-status",d="loading",b="loaded",m="failed",v="pre[data-src]:not(["+n+'="'+b+'"]):not(['+n+'="'+d+'"])';function w(E,y,F){var a=new XMLHttpRequest;a.open("GET",E,!0),a.onreadystatechange=function(){a.readyState==4&&(a.status<400&&a.responseText?y(a.responseText):a.status>=400?F(e(a.status,a.statusText)):F(r))},a.send(null)}function g(E){var y=/^\s*(\d+)\s*(?:(,)\s*(?:(\d+)\s*)?)?$/.exec(E||"");if(y){var F=Number(y[1]),a=y[2],s=y[3];return a?s?[F,Number(s)]:[F,void 0]:[F,F]}}c.hooks.add("before-highlightall",function(E){E.selector+=", "+v}),c.hooks.add("before-sanity-check",function(E){var y=E.element;if(y.matches(v)){E.code="",y.setAttribute(n,d);var F=y.appendChild(document.createElement("CODE"));F.textContent=t;var a=y.getAttribute("data-src"),s=E.language;if(s==="none"){var l=(/\.(\w+)$/.exec(a)||[,"none"])[1];s=i[l]||l}c.util.setLanguage(F,s),c.util.setLanguage(y,s);var o=c.plugins.autoloader;o&&o.loadLanguages(s),w(a,function(u){y.setAttribute(n,b);var p=g(y.getAttribute("data-range"));if(p){var _=u.split(/\r\n?|\n/g),f=p[0],T=p[1]==null?_.length:p[1];f<0&&(f+=_.length),f=Math.max(0,Math.min(f-1,_.length)),T<0&&(T+=_.length),T=Math.max(0,Math.min(T,_.length)),u=_.slice(f,T).join(`
+`),y.hasAttribute("data-start")||y.setAttribute("data-start",String(f+1))}F.textContent=u,c.highlightElement(F)},function(u){y.setAttribute(n,m),F.textContent=u})}}),c.plugins.fileHighlight={highlight:function(y){for(var F=(y||document).querySelectorAll(v),a=0,s;s=F[a++];)c.highlightElement(s)}};var A=!1;c.fileHighlight=function(){A||(console.warn("Prism.fileHighlight is deprecated. Use `Prism.plugins.fileHighlight.highlight` instead."),A=!0),c.plugins.fileHighlight.highlight.apply(this,arguments)}})()});var Cr={};Bt(Cr,{BUILD_ID:()=>Sr,TempleComponent:()=>P.TempleComponent,TempleElement:()=>P.TempleElement,TempleEmitter:()=>P.TempleEmitter,TempleException:()=>P.TempleException,TempleRegistry:()=>P.TempleRegistry,children:()=>P.children,components:()=>Pr,data:()=>P.data,emitter:()=>P.emitter,props:()=>P.props,signal:()=>P.signal});var j=k($());var St=k($()),N=k(I()),ee=class extends St.TempleComponent{static component=["layout","Layout_9f3ab204ce271feaf6f7"];styles(){return""}template(){(0,N.classlist)().add("relative","w-full","vh","scroll-hidden");let e=(0,N.children)(),r=e.find(g=>g.nodeName.endsWith("PANEL-MAIN")),i=e.find(g=>g.nodeName.endsWith("PANEL-HEAD")),n=e.find(g=>g.nodeName.endsWith("PANEL-FOOT")),d=e.find(g=>g.nodeName.endsWith("PANEL-LEFT")),b=e.find(g=>g.nodeName.endsWith("PANEL-RIGHT")),m={head:!!i,foot:!!n,left:!!d,right:!!b},v=new Set,w={left:!1,right:!1,change:g=>v.add(g)};return r&&N.TempleRegistry.get(r).setAttribute("show",w).setAttribute("layout",m),i&&N.TempleRegistry.get(i).setAttribute("show",w).setAttribute("layout",m),n&&N.TempleRegistry.get(n).setAttribute("show",w).setAttribute("layout",m),d&&N.TempleRegistry.get(d).setAttribute("show",w).setAttribute("layout",m),b&&N.TempleRegistry.get(b).setAttribute("show",w).setAttribute("layout",m),this.toggle=g=>{w[g]=!w[g],v.forEach(A=>A())},()=>[N.TempleRegistry.createText(`
+`,!1),...this._toNodeList(e)]}};var ve=k($()),Ne=k(I()),te=class extends ve.TempleComponent{static component=["head","Head_2bf4dff19bc88ba4138b"];styles(){return""}template(){let{layout:e,show:r}=this.element.attributes,i=(0,Ne.classlist)(),n=d=>{this.classList.add("absolute","top-0","right-0","h-60","transition-500"),e?.left?(this.classList.remove("left-0"),this.classList.add("left-226")):this.classList.add("left-0"),r.left?(this.classList.remove("md-left-0"),this.classList.add("md-left-226")):(this.classList.remove("md-left-226"),this.classList.add("md-left-0"))};return r.change(n),n(),()=>[ve.TempleRegistry.createText(`
+`,!1),ve.TempleRegistry.createElement("header",{class:"block w-full h-full relative"},[...this._toNodeList((0,Ne.children)())]).element]}};var ye=k($()),Re=k(I()),re=class extends ye.TempleComponent{static component=["left","Left_f4ab589e043eee17d229"];styles(){return""}template(){let{layout:e,show:r}=this.element.attributes,i=(0,Re.classlist)(),n=d=>{this.classList.add("w-226","absolute","bottom-0","left-0","top-0","transition-500"),r.left?(this.classList.remove("md-left--226"),this.classList.add("md-left-0")):this.classList.add("md-left--226")};return r.change(n),n(),()=>[ye.TempleRegistry.createText(`
+`,!1),ye.TempleRegistry.createElement("aside",{class:"block w-full h-full relative"},[...this._toNodeList((0,Re.children)())]).element]}};var xe=k($()),qe=k(I()),ne=class extends xe.TempleComponent{static component=["main","Main_847772763f4518728ede"];styles(){return""}template(){let{layout:e,show:r}=this.element.attributes,i=(0,qe.classlist)(),n=d=>{this.classList.add("absolute","transition-500"),e?.head?(this.classList.remove("top-0"),this.classList.add("top-60")):this.classList.add("top-0"),e?.foot?(this.classList.remove("bottom-0"),this.classList.add("bottom-60")):this.classList.add("bottom-0"),e?.left?(this.classList.remove("left-0"),this.classList.add("left-226")):this.classList.add("left-0"),e?.right?(this.classList.remove("right-0"),this.classList.add("right-200")):this.classList.add("right-0"),r.left?(this.classList.remove("md-left-0"),this.classList.add("md-left-226")):(this.classList.remove("md-left-226"),this.classList.add("md-left-0")),r.right?(this.classList.remove("md-right-0"),this.classList.add("md-right-200")):(this.classList.remove("md-right-200"),this.classList.add("md-right-0"))};return r.change(n),n(),()=>[xe.TempleRegistry.createText(`
+`,!1),xe.TempleRegistry.createElement("main",{class:"block w-full h-full relative"},[...this._toNodeList((0,qe.children)())]).element]}};var we=k($()),Ie=k(I()),se=class extends we.TempleComponent{static component=["docs","Docs_40562a7bb56d70d971df"];styles(){return""}template(){return(0,Ie.classlist)().add("block","w-full","h-full","scroll-y-auto","scroll-x-hidden"),()=>[we.TempleRegistry.createText(`
+`,!1),we.TempleRegistry.createElement("article",{class:"block p-10 tx-t-1"},[...this._toNodeList((0,Ie.children)())]).element]}};var L=k($()),He=k(I()),ae=class extends L.TempleComponent{static component=["app","App_381239c61b65b86a1c20"];styles(){return""}template(){let{title:e,height:r}=(0,He.props)(),i=r?`height:${r}px`:"";return()=>[L.TempleRegistry.createText(`
+`,!1),L.TempleRegistry.createElement("div",{class:"bd-rad-curved scroll-hidden shadow-0-0-10-0-0-0-5"},[L.TempleRegistry.createText(`
+  `,!1),L.TempleRegistry.createElement("div",{class:"relative flex flex-center-y gap-10 p-10 bg-t-1 tx-c-999999 tx-16"},[L.TempleRegistry.createText(`
+    `,!1),L.TempleRegistry.createElement("span",{class:"bg-h-999999 pill h-10 w-10"},[]).element,L.TempleRegistry.createText(`
+    `,!1),L.TempleRegistry.createElement("span",{class:"bg-h-999999 pill h-10 w-10"},[]).element,L.TempleRegistry.createText(`
+    `,!1),L.TempleRegistry.createElement("span",{class:"bg-h-999999 pill h-10 w-10"},[]).element,L.TempleRegistry.createText(`
+    `,!1),L.TempleRegistry.createElement("span",{class:"flex flex-center h-full w-full absolute top-0 left-0"},[L.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(e),L.TempleRegistry.createText(`
+    `,!1)]).element,L.TempleRegistry.createText(`
+  `,!1)]).element,L.TempleRegistry.createText(`
+  `,!1),L.TempleRegistry.createElement("div",{class:"bg-black tx-t-1 relative",style:i},[...this._toNodeList((0,He.children)())]).element,L.TempleRegistry.createText(`
+`,!1)]).element]}};var x=k($()),st=k(Ct()),Dt=k(I()),ie=class extends x.TempleComponent{static component=["code","Code_5294df1c620ef5ddbd2f"];styles(){return`:host {
     display: block;
     font-size: 14px;
     line-height: 20px;
   }
   :host([inline]) {
-    display: inline;
+    display: inline !important;
   }
   :host([inline]),
   :host([inline]) > pre,
   :host([inline]) > pre > code {
-    display: inline;
+    display: inline !important;
   }
   .snippet {
     background-color: #000000;
     color: #ABB2BF;
+    height: 100%;
     margin: 0;
     padding: 0;
   }
@@ -73,51 +90,39 @@ var TempleAPI=(()=>{var xt=Object.create;var ge=Object.defineProperty;var Tt=Obj
 
   .terminal {
     background-color: #000000;
+    font-family: 'Courier New', Courier, monospace;
     font-size: 15px;
+    height: 100%;
     padding: 10px;
   }
   .terminal span {
     color: #00FF00;
-  }`}template(){let e=this.props,{lang:r="markup",numbers:i=!1,inline:n=!1,trim:p=!1,ltrim:h=!1,rtrim:m=!1,detab:v=0}=e,E=(0,bt.children)(),w=E[0]?.textContent||"";v&&(w=w.replace(new RegExp(`\\n {${v}}`,"g"),`
-`)),p?w=w.trim():h?w=w.replace(/^\s+/,""):m&&(w=w.replace(/\s+$/,""));let F=x=>{if(!w)return;let _=ze.default.highlight(w,ze.default.languages[r],r);if(x.detail.target.innerHTML=_,i){let T=_.match(/\n(?!$)/g),s=T?T.length+1:1,a=new Array(s+1).join(""),l=document.createElement("span");l.setAttribute("aria-hidden","true"),l.className="line-numbers-rows",l.innerHTML=a,x.detail.target.appendChild(l)}};return()=>[y.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism.min.css"}).element,y.TempleRegistry.createText(`
-`,!1),y.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism-tomorrow.min.css"}).element,y.TempleRegistry.createText(`
-`,!1),...r==="bash"?[y.TempleRegistry.createText(`
-  `,!1),y.TempleRegistry.createElement("div",{class:"terminal"},[y.TempleRegistry.createElement("span",{},[y.TempleRegistry.createText("$",!1)]).element,y.TempleRegistry.createText(" ",!1),...this._toNodeList(E)]).element,y.TempleRegistry.createText(`
-`,!1)]:w?[,y.TempleRegistry.createText(`
-  `,!1),...i?[y.TempleRegistry.createText(`
-    `,!1),y.TempleRegistry.createElement("pre",{class:"snippet line-numbers"},[y.TempleRegistry.createElement("code",{mount:F},[]).element]).element,y.TempleRegistry.createText(`
-  `,!1)]:[,y.TempleRegistry.createText(`
-    `,!1),y.TempleRegistry.createElement("pre",{class:"snippet pad"},[y.TempleRegistry.createElement("code",{mount:F},[]).element]).element,y.TempleRegistry.createText(`
-  `,!1)],y.TempleRegistry.createText(`
-`,!1)]:[]]}};var J=D(I()),_t=D(ue()),X=class extends J.TempleComponent{static component=["preview","Preview_f99bb2771682cb0390ea"];styles(){return`:host {
-    display: block;
-  }
-  .preview {
-    background-color: #EFEFEF;
-    color: #222222;
-    font-family: Arial, Helvetica, sans-serif;
-    font-size: 13px;
-    padding: 10px;
-  }`}template(){return()=>[J.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/default.min.css"}).element,J.TempleRegistry.createText(`
-`,!1),J.TempleRegistry.createElement("div",{class:"preview"},[...this._toNodeList((0,_t.children)())]).element]}};var P=D(I()),Te=D(ue()),Y=class extends P.TempleComponent{static component=["app","App_05341fddbfd1fe4f273b"];styles(){return""}template(){let{title:e,panel:r}=(0,Te.props)(),i=`body ${r?"panel":""}`,n=r?`height:${r}px`:"";return()=>[P.TempleRegistry.createText(`
-`,!1),P.TempleRegistry.createElement("div",{class:"window"},[P.TempleRegistry.createText(`
-  `,!1),P.TempleRegistry.createElement("div",{class:"head"},[P.TempleRegistry.createText(`
-    `,!1),P.TempleRegistry.createElement("span",{class:"dot"},[]).element,P.TempleRegistry.createText(`
-    `,!1),P.TempleRegistry.createElement("span",{class:"dot"},[]).element,P.TempleRegistry.createText(`
-    `,!1),P.TempleRegistry.createElement("span",{class:"dot"},[]).element,P.TempleRegistry.createText(`
-    `,!1),P.TempleRegistry.createElement("span",{class:"title"},[...this._toNodeList(e)]).element,P.TempleRegistry.createText(`
-  `,!1)]).element,P.TempleRegistry.createText(`
-  `,!1),P.TempleRegistry.createElement("div",{class:i,style:n},[...this._toNodeList((0,Te.children)())]).element,P.TempleRegistry.createText(`
-`,!1)]).element]}};var M=D(I());var He=function(t,...e){let r=Ne(t);for(let i=0;i[M.TempleRegistry.createText(`
-    `,!1),...r?[M.TempleRegistry.createText(`
-      `,!1),M.TempleRegistry.createElement("p",{},[...this._toNodeList(w)]).element,M.TempleRegistry.createText(`
-    `,!1)]:i?[,M.TempleRegistry.createText(`
-      `,!1),M.TempleRegistry.createElement("li",{},[...this._toNodeList(w)]).element,M.TempleRegistry.createText(`
-    `,!1)]:n?[,M.TempleRegistry.createText(`
-      `,!1),M.TempleRegistry.createElement("div",{},[...this._toNodeList(w)]).element,M.TempleRegistry.createText(`
-    `,!1)]:[,M.TempleRegistry.createText(`
-      `,!1),...this._toNodeList(w),M.TempleRegistry.createText(`
-    `,!1)]]}};var k=D(I());C.emitter.once("ready",()=>{let t=document.querySelector("script[data-app]");if(!t)throw C.TempleException.for("APP_DATA not found");try{let h=atob(t.getAttribute("data-app"));window.__APP_DATA__=JSON.parse(h),Object.entries(window.__APP_DATA__).forEach(([m,v])=>{C.data.set(m,v)})}catch{throw C.TempleException.for("APP_DATA is not a valid JSON")}C.data.set("current","document");let e="/docs/index.html",r=He("Documentation - Temple reactive web component template engine."),i=He("Temple is a template engine hat generates web components and support reactivity."),n=h=>{document.body.classList.toggle("panel-left-open")};C.data.delete("current");let p={0:{class:"head panel-head"},1:{class:"menu fas fa-fw fa-bars",click:n},2:{href:"/temple"},3:{src:"/temple/temple-icon.png",alt:"Temple Logo"},5:{class:"tx-white",href:"/temple"},7:{class:"tx-white",href:"/temple/docs/index.html"},8:{class:"github",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},9:{class:"fab fa-github"},10:{class:"npm",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},11:{class:"fab fa-npm text-white"},12:{class:"discord",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},13:{class:"fab fa-discord text-white"},14:{class:"left panel-left"},16:{href:"/temple"},17:{src:"/temple/temple-icon.png",alt:"Temple Logo"},19:{class:"tx-white",href:"/temple"},20:{class:"toggle fas fa-fw fa-chevron-left",click:n},23:{href:"/temple/docs/index.html"},24:{href:"/temple/docs/getting-started.html"},26:{href:"/temple/docs/markup-syntax.html"},27:{href:"/temple/docs/state-management.html"},28:{href:"/temple/docs/component-strategy.html"},29:{href:"/temple/docs/compiler-api.html"},30:{href:"/temple/docs/client-api.html"},32:{href:"/temple/docs/template-engine.html"},33:{href:"/temple/docs/single-page.html"},34:{href:"/temple/docs/static-site.html"},35:{href:"/temple/docs/component-publisher.html"},36:{href:"/temple/docs/developer-tools.html"},37:{class:"panel-main"},38:{class:"docs container"},40:{p:!0,trim:!0},41:{p:!0,trim:!0},42:{p:!0,trim:!0},43:{p:!0,trim:!0},44:{title:"Basic Example"},45:{class:"split-view"},46:{numbers:!0,trim:!0,detab:14},50:{p:!0,trim:!0},51:{title:"Transpiler Example"},52:{class:"split-view"},53:{numbers:!0,ltrim:!0,detab:14},54:{class:"div",lang:"js",trim:!0,detab:14},55:{class:"pager"},56:{class:"next",href:"/temple/docs/getting-started.html"},57:{class:"fas fa-fw fa-chevron-right"},58:{class:"foot"}};for(let h of document.body.querySelectorAll("*")){let m=Object.fromEntries(Array.from(h.attributes).map(E=>[E.nodeName,E.nodeValue.length>0?E.nodeValue:!0])),v=String(C.TempleRegistry.elements.size);p[v]&&(Object.assign(m,p[v]),h.TempleAttributes=p[v]),C.TempleRegistry.register(h,m)}customElements.define("panel-main",Z),customElements.define("ide-code",W),customElements.define("ide-preview",X),customElements.define("ide-app",Y),customElements.define("i18n-translate",V),C.emitter.emit("mounted",document.body)});var ar={PanelMain_fd7f1af6410c5b5c8e1f:Z,IdeCode_6f36bc13bb6a166c7abc:W,IdePreview_f99bb2771682cb0390ea:X,IdeApp_05341fddbfd1fe4f273b:Y,I18nTranslate_7d25e372f5ffb5e39dad:V},sr="3e6a90cc5da3e950a902";return St(ir);})();
+  }`}template(){let e=this.props,{lang:r="markup",numbers:i=!1,inline:n=!1,trim:d=!1,ltrim:b=!1,rtrim:m=!1,detab:v=0}=e,w=(0,Dt.children)(),g=w[0]?.textContent||"";v&&(g=g.replace(new RegExp(`\\n {${v}}`,"g"),`
+`)),d?g=g.trim():b?g=g.replace(/^\s+/,""):m&&(g=g.replace(/\s+$/,""));let A=E=>{if(!g)return;let y=st.default.highlight(g,st.default.languages[r],r);if(E.detail.target.innerHTML=y,i){let F=y.match(/\n(?!$)/g),a=F?F.length+1:1,s=new Array(a+1).join(""),l=document.createElement("span");l.setAttribute("aria-hidden","true"),l.className="line-numbers-rows",l.innerHTML=s,E.detail.target.appendChild(l)}};return()=>[x.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism.min.css"}).element,x.TempleRegistry.createText(`
+`,!1),x.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism-tomorrow.min.css"}).element,x.TempleRegistry.createText(`
+`,!1),...r==="bash"?[x.TempleRegistry.createText(`
+  `,!1),x.TempleRegistry.createElement("div",{class:"terminal"},[x.TempleRegistry.createElement("span",{},[x.TempleRegistry.createText("$",!1)]).element,x.TempleRegistry.createText(" ",!1),...this._toNodeList(w)]).element,x.TempleRegistry.createText(`
+`,!1)]:g?[,x.TempleRegistry.createText(`
+  `,!1),...i?[x.TempleRegistry.createText(`
+    `,!1),x.TempleRegistry.createElement("pre",{class:"snippet line-numbers"},[x.TempleRegistry.createElement("code",{mount:A},[]).element]).element,x.TempleRegistry.createText(`
+  `,!1)]:[,x.TempleRegistry.createText(`
+    `,!1),x.TempleRegistry.createElement("pre",{class:"snippet pad"},[x.TempleRegistry.createElement("code",{mount:A},[]).element]).element,x.TempleRegistry.createText(`
+  `,!1)],x.TempleRegistry.createText(`
+`,!1)]:[,x.TempleRegistry.createText(`
+  `,!1),x.TempleRegistry.createElement("span",{},[x.TempleRegistry.createText("????",!1)]).element,x.TempleRegistry.createText(`
+`,!1)],x.TempleRegistry.createText(`
+
+`,!1)]}};var Ae=k($()),Be=k(I()),le=class extends Ae.TempleComponent{static component=["preview","Preview_ab5776d356e4ce3da5d5"];styles(){return""}template(){return(0,Be.classlist)().add("block","w-full","h-full","scroll-auto"),()=>[Ae.TempleRegistry.createText(`
+`,!1),Ae.TempleRegistry.createElement("div",{class:"bg-white tx-black arial p-10 h-full"},[...this._toNodeList((0,Be.children)())]).element]}};var O=k($());var Mt=function(t){return t};var Ge=k(I()),oe=class extends O.TempleComponent{static component=["translate","Translate_0014b007fc91289b2776"];styles(){return""}template(){let{trim:e=!1,p:r=!1,li:i=!1,div:n=!1}=(0,Ge.props)(),d=(0,Ge.children)(),b=[],m=[];for(let A of d)typeof A=="string"?b.push(A):A instanceof Node&&A.textContent?b.push(A.textContent):(b.push("%s"),m.push(A));let v=b.join("");e&&(v=v.replace(/\s+/," ").trim());let w=Mt(v).split("%s"),g=[];for(let A=0;A[O.TempleRegistry.createText(`
+    `,!1),...r?[O.TempleRegistry.createText(`
+      `,!1),O.TempleRegistry.createElement("p",{},[...this._toNodeList(g)]).element,O.TempleRegistry.createText(`
+    `,!1)]:i?[,O.TempleRegistry.createText(`
+      `,!1),O.TempleRegistry.createElement("li",{},[...this._toNodeList(g)]).element,O.TempleRegistry.createText(`
+    `,!1)]:n?[,O.TempleRegistry.createText(`
+      `,!1),O.TempleRegistry.createElement("div",{},[...this._toNodeList(g)]).element,O.TempleRegistry.createText(`
+    `,!1)]:[,O.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(g),O.TempleRegistry.createText(`
+    `,!1)]]}};var at=function(t,...e){let r=Lr(t);for(let i=0;i{let t=document.querySelector("script[data-app]");if(!t)throw j.TempleException.for("APP_DATA not found");try{let b=atob(t.getAttribute("data-app"));window.__APP_DATA__=JSON.parse(b),Object.entries(window.__APP_DATA__).forEach(([m,v])=>{j.data.set(m,v)})}catch{throw j.TempleException.for("APP_DATA is not a valid JSON")}j.data.set("current","document");let e="/docs/index.html",r=at("Documentation - Temple reactive web component template engine."),i=at("Temple is a template engine hat generates web components and support reactivity."),n=()=>{document.getElementsByTagName("panel-layout")[0].toggle("left")};j.data.delete("current");let d={2:{class:"flex flex-center-y px-20 py-15 m-0 bg-t-1"},3:{class:"fas fa-fw fa-bars cursor-pointer py-5 pr-10 none md-inline-block tx-t-1",click:n},4:{class:"flex-grow"},5:{class:"flex flex-center-y"},6:{class:"tx-white",href:"/temple/docs/index.html"},7:{class:"tx-t-1 tx-5xl ml-10",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},8:{class:"fab fa-github"},9:{class:"bg-h-cb3837 pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},10:{class:"fab fa-npm text-white"},11:{class:"bg-h-7289da pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},12:{class:"fab fa-discord text-white"},14:{class:"flex flex-center-y bg-t-2 py-15 pr-5 pl-10"},15:{href:"/temple"},16:{class:"h-26 mr-10",src:"/temple/temple-icon.png",alt:"Temple Logo"},17:{class:"flex-grow m-0 tx-uppercase"},18:{class:"tx-white",href:"/temple"},19:{class:"fas fa-fw fa-chevron-left cursor-pointer none md-inline-block",click:n},20:{class:"bg-t-1 scroll-auto h-calc-full-60"},21:{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-0 pt-20 pb-10 pl-10 tx-uppercase"},22:{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/index.html"},23:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/getting-started.html"},24:{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},25:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/markup-syntax.html"},26:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/state-management.html"},27:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-strategy.html"},28:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/compiler-api.html"},29:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/client-api.html"},30:{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},31:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/template-engine.html"},32:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/single-page.html"},33:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/static-site.html"},34:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-publisher.html"},35:{class:"block tx-t-1 py-10 pl-10 mb-100",href:"/temple/docs/developer-tools.html"},38:{class:"tx-primary tx-uppercase tx-30 py-20"},39:{p:!0,trim:!0,class:"tx-lh-36 py-20"},40:{p:!0,trim:!0,class:"tx-lh-36 py-20"},41:{p:!0,trim:!0,class:"tx-lh-36 py-20"},42:{p:!0,trim:!0,class:"tx-lh-36 py-20"},43:{title:"Basic Example",class:"py-20"},44:{class:"flex bg-h-EFEFEF h-full lg-block"},45:{class:"basis-half",numbers:!0,trim:!0,detab:16},46:{class:"bg-white basis-half h-140 lg-h-auto"},49:{p:!0,trim:!0,class:"tx-lh-36 py-20"},50:{title:"Transpiler Example",class:"py-20"},51:{class:"flex bg-h-EFEFEF h-full lg-block"},52:{class:"basis-half scroll-auto",scroll:!0,numbers:!0,ltrim:!0,detab:16},53:{class:"basis-half h-full bd-t-1 bd-solid bdy-0 bdl-1 bdr-0 lg-bd-0 lg-h-auto scroll-auto",lang:"js",trim:!0,scroll:!0,detab:16},54:{class:"flex"},55:{class:"flex-grow tx-right tx-primary py-40",href:"/temple/docs/getting-started.html"},56:{class:"fas fa-fw fa-chevron-right tx-t-1"},57:{class:"foot"}};for(let b of document.body.querySelectorAll("*")){let m=Object.fromEntries(Array.from(b.attributes).map(w=>[w.nodeName,w.nodeValue.length>0?w.nodeValue:!0])),v=String(j.TempleRegistry.elements.size);d[v]&&(Object.assign(m,d[v]),b.TempleAttributes=d[v]),j.TempleRegistry.register(b,m)}customElements.define("panel-layout",ee),customElements.define("panel-head",te),customElements.define("panel-left",re),customElements.define("panel-main",ne),customElements.define("api-docs",se),customElements.define("ide-app",ae),customElements.define("ide-code",ie),customElements.define("ide-preview",le),customElements.define("i18n-translate",oe),j.emitter.emit("mounted",document.body)});var Pr={PanelLayout_9f3ab204ce271feaf6f7:ee,PanelHead_2bf4dff19bc88ba4138b:te,PanelLeft_f4ab589e043eee17d229:re,PanelMain_847772763f4518728ede:ne,ApiDocs_40562a7bb56d70d971df:se,IdeApp_381239c61b65b86a1c20:ae,IdeCode_5294df1c620ef5ddbd2f:ie,IdePreview_ab5776d356e4ce3da5d5:le,I18nTranslate_0014b007fc91289b2776:oe},Sr="3e6a90cc5da3e950a902";return Gt(Cr);})();
 /*! Bundled license information:
 
 prismjs/prism.js:
diff --git a/docs/build/client/57e37fa233b38c87fe71.css b/docs/build/client/57e37fa233b38c87fe71.css
index e69de29..90f007c 100644
--- a/docs/build/client/57e37fa233b38c87fe71.css
+++ b/docs/build/client/57e37fa233b38c87fe71.css
@@ -0,0 +1,233 @@
+html, body {
+  height: 100%;
+  margin: 0;
+  padding: 0;
+  width: 100%;
+}
+
+h1, h2, h3, h4, h5, h6, p {
+  margin: 0;
+  padding: 0;
+}
+
+a {
+  text-decoration: none;
+}
+  html-head:not(:defined) { opacity: 0; }
+html-header:not(:defined) { opacity: 0; }
+html-aside:not(:defined) { opacity: 0; }
+panel-layout:not(:defined) { opacity: 0; }
+panel-head:not(:defined) { opacity: 0; }
+panel-left:not(:defined) { opacity: 0; }
+panel-right:not(:defined) { opacity: 0; }
+panel-main:not(:defined) { opacity: 0; }
+tui-alert:not(:defined) { opacity: 0; }
+api-docs:not(:defined) { opacity: 0; }
+ide-app:not(:defined) { opacity: 0; }
+ide-code:not(:defined) { opacity: 0; }
+i18n-translate:not(:defined) { opacity: 0; }
+  :root {
+  --black: #000000;
+  --white: #FFFFFF;
+  --info: #1474FC;
+  --error: #DC3545;
+  --warning: #FF7B07;
+  --success: #28A745;
+  --muted: #999999;
+}
+
+.light {
+  --bg-0: #EFEFEF;
+  --bg-1: #CFCFCF;
+  --bg-2: #AFAFAF;
+  --bg-3: #8F8F8F;
+  --bg-4: #6F6F6F;
+  --bd-0: #EFEFEF;
+  --bd-1: #CFCFCF;
+  --bd-2: #AFAFAF;
+  --bd-3: #8F8F8F;
+  --bd-4: #6F6F6F;
+  --bg-inverse: #242424;
+  --tx-0: #000000;
+  --tx-1: #242424;
+  --tx-inverse: #CFCFCF;
+}
+
+.dark {
+  --bg-0: #121212;
+  --bg-1: #222222;
+  --bg-2: #323232;
+  --bg-3: #424242;
+  --bg-4: #525252;
+  --bd-0: #121212;
+  --bd-1: #222222;
+  --bd-2: #323232;
+  --bd-3: #424242;
+  --bd-4: #525252;
+  --bg-inverse: #DBDBDB;
+  --tx-0: #FFFFFF;
+  --tx-1: #CFCFCF;
+  --tx-inverse: #222222;
+}
+  html-head { display: block; }
+html-header { display: block; }
+html-aside { display: block; }
+panel-layout { display: block; }
+panel-head { display: block; }
+panel-left { display: block; }
+panel-right { display: block; }
+panel-main { display: block; }
+tui-alert { display: block; }
+api-docs { display: block; }
+ide-app { display: block; }
+ide-code { display: block; }
+i18n-translate { display: block; }
+  .arial { font-family: Arial, sans-serif; }
+.none { display: none; }
+.block { display: block; }
+.flex { display: flex; }
+.inline { display: inline; }
+.transparent { opacity: 0; }
+.relative { position: relative; }
+.absolute { position: absolute; }
+.static { position: static; }
+.bottom-0 { bottom: 0px; }
+.bottom-60 { bottom: 60px; }
+.left-0 { left: 0px; }
+.left-226 { left: 226px; }
+.left-0 { left: 0px; }
+.left-226 { left: 226px; }
+.left--226 { left: -226px; }
+.right-0 { right: 0px; }
+.right--200 { right: -200px; }
+.right-0 { right: 0px; }
+.right-200 { right: 200px; }
+.right-200 { right: 200px; }
+.top-0 { top: 0px; }
+.top-60 { top: 60px; }
+.flex-grow { flex-grow: 1; }
+.flex-center { align-items: center; justify-content: center; }
+.flex-center-y { align-items: center; }
+.gap-10 { gap: 10px; }
+.scroll-auto { overflow: auto; }
+.scroll-hidden { overflow: hidden; }
+.scroll-x-hidden { overflow-x: hidden; }
+.scroll-y-auto { overflow-y: auto; }
+.h-full { height: 100%; }
+.h-26 { height: 26px; }
+.h-7289 { height: 7289px; }
+.h-905496362982981723 { height: 905496362982981723px; }
+.h-60 { height: 60px; }
+.h-999999 { height: 999999px; }
+.h-10 { height: 10px; }
+.h-32 { height: 32px; }
+.h-36 { height: 36px; }
+.h-24 { height: 24px; }
+.h-calc-full-60 { height: calc(100% - 60px); }
+.h-calc-full-40 { height: calc(100% - 40px); }
+.vh { height: 100vh; }
+.w-full { width: 100%; }
+.w-226 { width: 226px; }
+.w-200 { width: 200px; }
+.w-0 { width: 0px; }
+.w-10 { width: 10px; }
+.bg-primary { background-color: var(--primary) !important; }
+.bg-secondary { background-color: var(--secondary) !important; }
+.bg-black { background-color: var(--black) !important; }
+.bg-white { background-color: var(--white) !important; }
+.bg-info { background-color: var(--info) !important; }
+.bg-error { background-color: var(--error) !important; }
+.bg-warning { background-color: var(--warning) !important; }
+.bg-success { background-color: var(--success) !important; }
+.bg-muted { background-color: var(--muted) !important; }
+.bg-t-1 { background-color: var(--bg-1) !important; }
+.bg-t-2 { background-color: var(--bg-2) !important; }
+.bg-t-0 { background-color: var(--bg-0) !important; }
+.bg-h-cb3837 { background-color: #cb3837; }
+.bg-h-7289da { background-color: #7289da; }
+.bg-h-999999 { background-color: #999999; }
+.tx-5 { font-size: 5px; }
+.tx-14 { font-size: 14px; }
+.tx-16 { font-size: 16px; }
+.tx-30 { font-size: 30px; }
+.tx-26 { font-size: 26px; }
+.tx-22 { font-size: 22px; }
+.tx-lg { font-size: 16px; }
+.tx-5xl { font-size: 26px; }
+.tx-center { text-align: center; }
+.tx-right { text-align: right; }
+.tx-bold { font-weight: bold; }
+.tx-uppercase { text-transform: uppercase; }
+.tx-lh-32 { line-height: 32px; }
+.tx-lh-36 { line-height: 36px; }
+.tx-lh-24 { line-height: 24px; }
+.tx-primary { color: var(--primary) !important; }
+.tx-secondary { color: var(--secondary) !important; }
+.tx-white { color: var(--white) !important; }
+.tx-info { color: var(--info) !important; }
+.tx-error { color: var(--error) !important; }
+.tx-warning { color: var(--warning) !important; }
+.tx-success { color: var(--success) !important; }
+.tx-muted { color: var(--muted) !important; }
+.tx-t-1 { color: var(--tx-1) !important; }
+.tx-t-0 { color: var(--tx-0) !important; }
+.bd-solid { border-style: solid; }
+.bd-primary { border-color: var(--primary) !important; }
+.bd-secondary { border-color: var(--secondary) !important; }
+.bd-info { border-color: var(--info) !important; }
+.bd-error { border-color: var(--error) !important; }
+.bd-warning { border-color: var(--warning) !important; }
+.bd-success { border-color: var(--success) !important; }
+.bd-muted { border-color: var(--muted) !important; }
+.bd-t-1 { border-color: var(--bd-1) !important; }
+.bdb-1 { border-bottom-width: 1px; }
+.bdt-0 { border-top-width: 0px; }
+.bdx-0 { border-left-width: 0px; border-right-width: 0px; }
+.curved { border-radius: 4px; }
+.rounded { border-radius: 12px; }
+.pill { border-radius: 10000px; }
+.m-0 { margin: 0px; }
+.m-0 { margin: 0px; }
+.m-60 { margin: 60px; }
+.mb-0 { margin-bottom: 0px; }
+.mb-100 { margin-bottom: 100px; }
+.mb-20 { margin-bottom: 20px; }
+.ml-10 { margin-left: 10px; }
+.ml-5 { margin-left: 5px; }
+.mr-10 { margin-right: 10px; }
+.mt-0 { margin-top: 0px; }
+.mt-20 { margin-top: 20px; }
+.my-10 { margin-top: 10px; margin-bottom: 10px; }
+.p-5 { padding: 5px; }
+.p-0 { padding: 0px; }
+.p-60 { padding: 60px; }
+.p-16 { padding: 16px; }
+.p-10 { padding: 10px; }
+.p-10 { padding: 10px; }
+.pb-10 { padding-bottom: 10px; }
+.pb-20 { padding-bottom: 20px; }
+.pl-10 { padding-left: 10px; }
+.pl-20 { padding-left: 20px; }
+.pr-10 { padding-right: 10px; }
+.pr-5 { padding-right: 5px; }
+.pt-20 { padding-top: 20px; }
+.pt-40 { padding-top: 40px; }
+.px-20 { padding-left: 20px; padding-right: 20px; }
+.px-10 { padding-left: 10px; padding-right: 10px; }
+.py-15 { padding-top: 15px; padding-bottom: 15px; }
+.py-5 { padding-top: 5px; padding-bottom: 5px; }
+.py-10 { padding-top: 10px; padding-bottom: 10px; }
+.py-20 { padding-top: 20px; padding-bottom: 20px; }
+.py-40 { padding-top: 40px; padding-bottom: 40px; }
+.cursor-pointer { cursor: pointer; }
+.transition-500 { transition: 500ms; }
+.shadow-0-0-10-0-0-0-5 { box-shadow: 0px 0px 10px rgb(0, 0, 0, 0.5); }
+@media (max-width: 767px) {
+  .md-inline-block { display: inline-block; }
+  .md-left-0 { left: 0px; }
+  .md-left-226 { left: 226px; }
+  .md-left--226 { left: -226px; }
+  .md-right--200 { right: -200px; }
+  .md-right-0 { right: 0px; }
+  .md-right-200 { right: 200px; }
+}
\ No newline at end of file
diff --git a/docs/build/client/57e37fa233b38c87fe71.html b/docs/build/client/57e37fa233b38c87fe71.html
index 7c1be30..d073642 100644
--- a/docs/build/client/57e37fa233b38c87fe71.html
+++ b/docs/build/client/57e37fa233b38c87fe71.html
@@ -18,597 +18,692 @@
   
   
   
-  
+  
   
   
   
   
 
-  
-    

-  
-  
-    Temple Logo
-  
-  
Temple

-  
+      
+        
+          

+            On this page
+          

+          
+        
+      
+      
+        
+          

+            Markup Syntax
+          

+
+          
+            Components are the building blocks of Temple files. Documents 
+            and page level markup are written in 
+            .dtml files. Components 
+            and templates are written in 
+            .tml files. In both 
+            cases, the code is written in a superset of HTML.
+          
+          
+            The four sections that make up a temple file — imports, 
+            script, styles and markup — are all optional and can be 
+            used in any order.
+          
+          
+            
+              <!-- imports go here -->
+
+              <style>
+                /* styles go here */
+              </style>
+
+              <script>
+                // logic goes here
+              </script>
+              
+              <!-- HTML goes here -->
+            
+          
+
+          
+          

+            Imports
+          

+
+          
+            Imports are used to include additional components, templates 
+            and stylesheets in the current component. Components can 
+            be imported as a template or 
+            component type.
+          
 
-        
-          
-            <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/prism.min.css" />
-            <link rel="stylesheet" type="text/css" href="/styles/layout.css" />
-            <link rel="import" type="template" href="@/modules/html-head.tml" />
-            <link rel="import" type="component" href="@/modules/i18n/translate.tml" name="i18n-translate" />
-
-            <style>
-              /* styles go here */
-            </style>
-
-            <script>
-              // logic goes here
-            </script>
-            
-            <!-- HTML goes here -->
-          
-        
-        
-        
-          The rel attribute 
-          specifies the relationship between the current document and 
-          the linked resource. 
-          
-          rel="import" denotes
-          that the imported resource is a component or template.
-        
-        
-          The type 
-          attribute specifies the type of the linked resource. 
-          
-          type="component" 
-          imports a web component that can be used as regular markup
-          with attributes and children. 
+          
+            
+              <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/prism.min.css" />
+              <link rel="stylesheet" type="text/css" href="/styles/layout.css" />
+              <link rel="import" type="template" href="@/modules/html-head.tml" />
+              <link rel="import" type="component" href="@/modules/i18n/translate.tml" name="i18n-translate" />
+
+              <style>
+                /* styles go here */
+              </style>
+
+              <script>
+                // logic goes here
+              </script>
+              
+              <!-- HTML goes here -->
+            
+          
           
-          type="template" 
-          imports a template partial that can be included in the current 
-          markup. Template partials do not process attributes or children
-          if given.
-        
-        
-          The 
-          href attribute specifies
-          the URL of the linked resource. The 
-          name
-          attribute specifies the tag name of the imported component or template.
-        
-
-        
-        
Styles

-
-        
-          CSS styles inside a <style> 
-          block enables the native shadow DOM and will be scoped only to that component. 
-          Additionally styles defined outside of the component such as 
-          global styles will not affect the component.
-        
-
-        
-          External stylesheets can be imported using the 
-          <link> tag or using 
-          @import() CSS directive. 
-        
-
-        
-          You can use host selectors to style an element from within 
-          a component. The :host 
-          pseudo-class always applies styles to the root element of the 
-          web component.
-        
-
-        
-          
-            <style>
-              :host {
-                display: block;
-              }
-            </style>
-          
-        
+          
+            The rel attribute 
+            specifies the relationship between the current document and 
+            the linked resource. 
+            
+            rel="import" denotes
+            that the imported resource is a component or template.
+          
+          
+            The type 
+            attribute specifies the type of the linked resource. 
+            
+            type="component" 
+            imports a web component that can be used as regular markup
+            with attributes and children. 
+            
+            type="template" 
+            imports a template partial that can be included in the current 
+            markup. Template partials do not process attributes or children
+            if given.
+          
+          
+            The 
+            href attribute specifies
+            the URL of the linked resource. The 
+            name
+            attribute specifies the tag name of the imported component or template.
+          
 
-        
-          You can also add conditional styles using the 
-          :host selector function. 
-          This can be used to style the host so long as it matches the 
-          given selector. For example, it can be used to select for 
-          hosts that have a given attribute or class.
-        
+          
+          

+            Styles
+          

 
-        
-          
-            <style>
-              :host([active]) {
-                background-color: #333;
-                color: #FFF;
-              }
-              :host(.active) {
-                background-color: #333;
-                color: #FFF;
-              }
-            </style>
-          
-        
+          
+            CSS styles inside a <style> 
+            block enables the native shadow DOM and will be scoped only to that component. 
+            Additionally styles defined outside of the component such as 
+            global styles will not affect the component.
+          
 
-        
-        
Scripts

+          
+            External stylesheets can be imported using the 
+            <link> tag or using 
+            @import() CSS directive. 
+          
 
-        
-          The <script> block is used 
-          to write TypeScript logic for the component. The script block 
-          can be used to define variables, functions, and event listeners.
-          Variables declared (or imported) at the top level are 
-          'visible' from the component's markup. 
-        
+          
+            You can use host selectors to style an element from within 
+            a component. The :host 
+            pseudo-class always applies styles to the root element of the 
+            web component.
+          
 
-        
-          
-            <script>
-              const title = 'Hello World';
-            </script>
+          
+            
+              <style>
+                :host {
+                  display: block;
+                }
+              </style>
+            
+          
+
+          
+            You can also add conditional styles using the 
+            :host selector function. 
+            This can be used to style the host so long as it matches the 
+            given selector. For example, it can be used to select for 
+            hosts that have a given attribute or class.
+          
 
-            <h1>{title}</h1>
-          
-        
+          
+            
+              <style>
+                :host([active]) {
+                  background-color: #333;
+                  color: #FFF;
+                }
+                :host(.active) {
+                  background-color: #333;
+                  color: #FFF;
+                }
+              </style>
+            
+          
+
+          
+          

+            Scripts
+          

+
+          
+            The <script> block is used 
+            to write TypeScript logic for the component. The script block 
+            can be used to define variables, functions, and event listeners.
+            Variables declared (or imported) at the top level are 
+            'visible' from the component's markup. 
+          
 
-        
-          The <script> block can also 
-          be used to import variables from other components to be used
-          in the markup.
-        
+          
+            
+              <script>
+                const title = 'Hello World';
+              </script>
 
-        
-          
-            <script>
-              import getTitle from './getTitle';
-              const title = getTitle();
-            </script>
+              <h1>{title}</h1>
+            
+          
 
-            <h1 title={title}>{title}</h1>
-          
-        
+          
+            The <script> block can also 
+            be used to import variables from other components to be used
+            in the markup.
+          
 
-        
-          You can use @/ to prefix the 
-          current working directory. This is useful when importing
-          files completely in a separate directory in your project
-        
+          
+            
+              <script>
+                import getTitle from './getTitle';
+                const title = getTitle();
+              </script>
+
+              <h1 title={title}>{title}</h1>
+            
+          
+
+          
+            You can use @/ to prefix the 
+            current working directory. This is useful when importing
+            files completely in a separate directory in your project
+          
 
-        
-          
-            <script>
-              import getTitle from '@/data/getTitle';
-              const title = getTitle();
-            </script>
+          
+            
+              <script>
+                import getTitle from '@/data/getTitle';
+                const title = getTitle();
+              </script>
+
+              <h1 title={title}>{title}</h1>
+            
+          
+
+          
+          

+            Markup
+          

+
+          
+            In order to be closer to the native, Temple follows the same 
+            standards and conventions as HTML5 web components. Temple 
+            components are compiled to native web components that possibly 
+            can be used in other projects any modern browser.
+          
+
+          
+          

+            Tag Names
+          

+
+          
+            For web components it's recommended that tag names must have 
+            at least one dash (-) in them. As such you probably want to 
+            name your element with two distinct words like 
+            i18n-translate. You can 
+            use as many dashes as you want, you're not limited to one. 
+            Some specific rules to follow in order to make a valid tag 
+            name:
+          
+
+          
    
+            
+              It must use all lowercase characters of the alphabet (a-z).
+            
+            
+              It must contain at least one dash (-). Temple will 
+              auto prefix component names based on your configuration.
+            
+            
+              It must not be an already reserved tag name including 
+              annotation-xml,
+              color-profile,
+              font-face,
+              font-face-src,
+              font-face-uri,
+              font-face-format,
+              font-face-name, and 
+              missing-glyph.
+            
+            
+              It must not contain symbols, like =, @, $.
+            
+            
+              It can contain underscores, and numbers.
+            
+            
+              It can contain characters from different alphabets, 
+              such as é, ð, ö, 爱.
+            
+          

+
+          
+            Additionally, Temple works best with correct markup. The 
+            following standards should be followed:
+          
+
+          
    
+            
+              Self closing tags like 
+              <img />,
+              <link />,
+              <meta />,
+              <input />
+              must have a slash before the closing.
+            
+            
+              When using tables, rows should be wrapped in a 
+              <tbody> tag and cells
+              should be wrapped in a <tr> 
+              tag. ie. <table><tbody><tr><td>
+            
+            
+              When using lists, items should be wrapped in a 
+              <ul> or 
+              <ol> tags.
+              ie. <ul><li>
+            
+          

+
+          
+            
+            Warning: Any markup auto corrected by browser will cause data syncing 
+            issues with Temple.
+          
+
+          
+            Temple components can loosely be self closing
+            <i18n-translate />
+            or expressed as a block
+            <i18n-translate></i18n-translate>.
+          
 
-            <h1 title={title}>{title}</h1>
+          
+          

+            Attributes
+          

+
+          
+            
+              <a title={title} {href} {...attributes}>
+                {title}
+              </a>
+              <i18n-translate title=title>
+                {detail}
+              </i18n-translate>
+            
+          
+
+          
+            Attributes can be bound to expressions using the 
+            {} syntax. 
+            Expressions can be variables, functions, or any valid 
+            JavaScript expression. By default, attributes work exactly 
+            like their HTML counterparts.
+          
+
+          

+            
+              <button type="button" disabled>Submit</button>
+            
+          

+          
+            Traditional HTML attributes can be assigned string values or 
+            no value evaluates as true.
+          
+
+          
+            <a title={title}>Click</a>
           
-        
-
-        
-        
Markup

-
-        
-          In order to be closer to the native, Temple follows the same 
-          standards and conventions as HTML5 web components. Temple 
-          components are compiled to native web components that possibly 
-          can be used in other projects any modern browser.
-        
-
-        
-        
Tag Names

-
-        
-          Tag names must have at least one dash (-) in them. As such 
-          you probably want to name your element with two distinct words 
-          like i18n-translate. You can 
-          use as many dashes as you want, you're not limited to one. 
-          Some specific rules to follow in order to make a valid tag 
-          name:
-        
-
-        
    
-          
-            It must use all lowercase characters of the alphabet (a-z).
-          
-          
-            t must contain at least one dash (-).
-          
-          
-            It must not be an already reserved tag name including 
-            annotation-xml,
-            color-profile,
-            font-face,
-            font-face-src,
-            font-face-uri,
-            font-face-format,
-            font-face-name, and 
-            missing-glyph.
-          
-          
-            It must not contain symbols, like =, @, $.
-          
-          
-            It can contain underscores, and numbers.
-          
-          
-            It can contain characters from different alphabets, 
-            such as é, ð, ö, 爱.
-          
-        

-
-        
-          Additionally, Temple works best with correct markup. The 
-          following standards should be followed:
-        
-
-        
    
-          
-            Self closing tags like 
-            <img />,
-            <link />,
-            <meta />,
-            <input />
-            must have a slash before the closing.
-          
-          
-            When using tables, rows should be wrapped in a 
-            <tbody> tag and cells
-            should be wrapped in a <tr> 
-            tag. ie. <table><tbody><tr><td>
-          
-          
-            When using lists, items should be wrapped in a 
-            <ul> or 
-            <ol> tags.
-            ie. <ul><li>
-          
-        

-
-        
-          
-          Warning: Any markup auto corrected by browser will cause data syncing 
-          issues with Temple.
-        
-
-        
-          Temple components can loosely be self closing
-          <i18n-translate />
-          or expressed as a block
-          <i18n-translate></i18n-translate>.
-        
-
-        
-        
Attributes

-
-        
-          
-            <a title={title} {href} {...attributes}>
-              {title}
-            </a>
-            <i18n-translate title=title>
-              {detail}
-            </i18n-translate>
+          
+            Attributes can be assigned variable names.
+          
+
+          
+            <a title=title>Click</a>
           
-        
-
-        
-          Attributes can be bound to expressions using the 
-          {} syntax. 
-          Expressions can be variables, functions, or any valid 
-          JavaScript expression. By default, attributes work exactly 
-          like their HTML counterparts.
-        
-
-        
-          <button type="button" disabled>Submit</button>
-        
-        
-          Traditional HTML attributes can be assigned string values or 
-          no value evaluates as true.
-        
-
-        
-          <a title={title}>Click</a>
-        
-        
-          Attributes can be assigned variable names.
-        
-
-        
-          <a title=title>Click</a>
-        
-        
-          Variable names do not need to be wrapped in curly braces
-          {}.
-        
-
-        
-          <a {title}>Click</a>
-        
-        
-          Attributes with the same name as a variable can be assigned
-          by just wrapping curly braces. ie. 
-          {title}.
-        
-
-        
-          <script>
-            const attributes = { target: '_blank' };
-          </script>
-          <a {...attributes}>Click</a>
-        
-        
-          Spread operators can be used to assign multiple attributes.
-        
-
-        
-          <script>
-            let count = 10
-            const metadata = { foo: 'bar', baz: 1, qux: true };
-            const data = () => metadata
-          </script>
-          <a {count} get={data} data-meta={metadata} disable={count < 10}>
-            Click
-          </a>
-        
-        
-          You can assign any valid JavaScript expression to an attribute.
-        
-
-        
-        
Conditionals

-
-        
+          
+            Variable names do not need to be wrapped in curly braces
+            {}.
+          
+
+          
+            <a {title}>Click</a>
+          
+          
+            Attributes with the same name as a variable can be assigned
+            by just wrapping curly braces. ie. 
+            {title}.
+          
+
+          

+            
+              <script>
+                const attributes = { target: '_blank' };
+              </script>
+              <a {...attributes}>Click</a>
+            
+          

+          
+            Spread operators can be used to assign multiple attributes.
+          
+
+          

+            
+              <script>
+                let count = 10
+                const metadata = { foo: 'bar', baz: 1, qux: true };
+                const data = () => metadata
+              </script>
+              <a {count} get={data} data-meta={metadata} disable={count < 10}>
+                Click
+              </a>
+            
+          

+          
+            You can assign any valid JavaScript expression to an attribute.
+          
+
+          
+          

+            Conditionals
+          

+
+          
+            
+              <if true={count > 10}>
+                <p>Count is greater than 10</p>
+              <elif true={count < 5} />
+                <p>Count is less than 5</p>
+              <else />
+                <p>Count is between 5 and 10</p>
+              </if>
+            
+          
+          
+            Conditionals can be used to show or hide elements based on 
+            the value of a variable.
+          
+
+          

+            
+              <if true={count > 10}>
+                <p>Count is greater than 10</p>
+              </if>
+            
+          

+          
+            The basic syntax for an if statement looks like this and can be 
+            truesy or 
+            falsey.
+          
+
+          

+            
+              <if false={count > 10}>
+                <p>Count is not greater than 10</p>
+              </if>
+            
+          

+          
+            You can also use the false
+            attribute to negate the condition.
+          
+
+          

+            
+              <if true={count > 10}>
+                <p>Count is greater than 10</p>
+              <else />
+                <p>Count is less than or equal to 10</p>
+              </if>
+            
+          

+          
+            You can use the else block to 
+            show content when the condition is false.
+          
+
           
             <if true={count > 10}>
               <p>Count is greater than 10</p>
             <elif true={count < 5} />
               <p>Count is less than 5</p>
-            <else />
-              <p>Count is between 5 and 10</p>
             </if>
           
-        
-        
-          Conditionals can be used to show or hide elements based on 
-          the value of a variable.
-        
-
-        
-          <if true={count > 10}>
-            <p>Count is greater than 10</p>
-          </if>
-        
-        
-          The basic syntax for an if statement looks like this and can be 
-          truesy or 
-          falsey.
-        
-
-        
-          <if false={count > 10}>
-            <p>Count is not greater than 10</p>
-          </if>
-        
-        
-          You can also use the false
-          attribute to negate the condition.
-        
-
-        
-          <if true={count > 10}>
-            <p>Count is greater than 10</p>
-          <else />
-            <p>Count is less than or equal to 10</p>
-          </if>
-        
-        
-          You can use the else block to 
-          show content when the condition is false.
-        
-
-        
-          <if true={count > 10}>
-            <p>Count is greater than 10</p>
-          <elif true={count < 5} />
-            <p>Count is less than 5</p>
-          </if>
-        
-        
-          You can use the elif block to 
-          show content when the previous condition is false.
-        
-
-        
-        
Iterations

-
-        
+          
+            You can use the elif block to 
+            show content when the previous condition is false.
+          
+
+          
+          

+            Iterations
+          

+
+          
+            
+              <each key=index value=article from=articles>
+                <h1>#{index + 1} {article.title}</h1>
+                <p>{article.body}</p>
+              </each>
+            
+          
+          
+            The <each> block can be used 
+            to iterate over an array of items or objects.
+            The from attribute value is 
+            required and can be an array, object or JavaScript expression 
+            that evaluates to an array or object. Both the 
+            key and 
+            value attributes are optional.
+          
+
+          

+            
+              <each value={article} from={articles}>
+                <h1>{article.title}</h1>
+                <p>{article.body}</p>
+              </each>
+            
+          

+          
+            The value of value, in this 
+            case article can be used 
+            only with in the block. This can be any valid JavaScript 
+            variable name.
+          
+
           
-            <each key=index value=article from=articles>
-              <h1>#{index + 1} {article.title}</h1>
-              <p>{article.body}</p>
+            <each key={index} from={[1, 2, 3]}>
+              <h1>#{index} ???</h1>
             </each>
           
-        
-        
-          The <each> block can be used 
-          to iterate over an array of items or objects.
-          The from attribute value is 
-          required and can be an array, object or JavaScript expression 
-          that evaluates to an array or object. Both the 
-          key and 
-          value attributes are optional.
-        
-
-        
-          <each value={article} from={articles}>
-            <h1>{article.title}</h1>
-            <p>{article.body}</p>
-          </each>
-        
-        
-          The value of value, in this 
-          case article can be used 
-          only with in the block. This can be any valid JavaScript 
-          variable name.
-        
-
-        
-          <each key={index} from={[1, 2, 3]}>
-            <h1>#{index} ???</h1>
-          </each>
-        
-        
-          The value of key, in this 
-          case index can be used 
-          only with in the block. This can be any valid JavaScript 
-          variable name.
-        
-
-        
-        
Try/Catch

-
-        
-          
-            <try>
-              <p>{mayCauseError()}</p>
-            <catch error={e} />
-              <p>Error: {e.message}</p>
-            </try>
-          
-        
-
-        
-          The <try><catch> block can 
-          be used to catch errors that occur in the block. The 
-          <catch> block is required and 
-          can be used to handle the error.
-
-          The value of error, in the  
-          <catch> block in this case
-          e is an 
-          Error object
-          that can only be used with in the block. 
-        
-
-        
-      
-      

-    
+          
+            The value of key, in this 
+            case index can be used 
+            only with in the block. This can be any valid JavaScript 
+            variable name.
+          
+
+          
+          

+            Try/Catch
+          

+
+          
+            
+              <try>
+                <p>{mayCauseError()}</p>
+              <catch error={e} />
+                <p>Error: {e.message}</p>
+              </try>
+            
+          
+
+          
+            The <try><catch> block can 
+            be used to catch errors that occur in the block. The 
+            <catch> block is required and 
+            can be used to handle the error.
+
+            The value of error, in the  
+            <catch> block in this case
+            e is an 
+            Error object
+            that can only be used with in the block. 
+          
+
+          
+          

+        
+      
+    
   
 
\ No newline at end of file
diff --git a/docs/build/client/57e37fa233b38c87fe71.js b/docs/build/client/57e37fa233b38c87fe71.js
index 428dd9f..4988e0d 100644
--- a/docs/build/client/57e37fa233b38c87fe71.js
+++ b/docs/build/client/57e37fa233b38c87fe71.js
@@ -1,20 +1,39 @@
-var TempleAPI=(()=>{var At=Object.create;var he=Object.defineProperty;var Tt=Object.getOwnPropertyDescriptor;var Et=Object.getOwnPropertyNames;var Ft=Object.getPrototypeOf,kt=Object.prototype.hasOwnProperty;var M=(t,e)=>()=>(e||t((e={exports:{}}).exports,e),e.exports),St=(t,e)=>{for(var r in e)he(t,r,{get:e[r],enumerable:!0})},Je=(t,e,r,a)=>{if(e&&typeof e=="object"||typeof e=="function")for(let i of Et(e))!kt.call(t,i)&&i!==r&&he(t,i,{get:()=>e[i],enumerable:!(a=Tt(e,i))||a.enumerable});return t};var D=(t,e,r)=>(r=t!=null?At(Ft(t)):{},Je(e||!t||!t.__esModule?he(r,"default",{value:t,enumerable:!0}):r,t)),Pt=t=>Je(he({},"__esModule",{value:!0}),t);var Oe=M(Me=>{"use strict";Object.defineProperty(Me,"__esModule",{value:!0});var Ce=class extends Error{static for(e,...r){return r.forEach(function(a){e=e.replace("%s",a)}),new this(e)}static forErrorsFound(e){let r=new this("Invalid Parameters");return r.errors=e,r}static require(e,r,...a){if(!e){for(let i of a)r=r.replace("%s",i);throw new this(r)}}constructor(e,r=500){super(),this.errors={},this.start=0,this.end=0,this.message=e,this.name=this.constructor.name,this.code=r}withCode(e){return this.code=e,this}withPosition(e,r){return this.start=e,this.end=r,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};Me.default=Ce});var te=M(ee=>{"use strict";Object.defineProperty(ee,"__esModule",{value:!0});ee.TempleEmitter=void 0;var ge=class extends EventTarget{emit(e,r){return this.dispatchEvent(new CustomEvent(e,{detail:r})),this}on(e,r){if(e==="ready"&&document.readyState!=="loading"){let a=new CustomEvent("ready");return setTimeout(()=>r(a),1),this}return this.addEventListener(e,r),this}once(e,r){let a=i=>{this.unbind(e,a),r(i)};return this.on(e,a),this}unbind(e,r){return this.removeEventListener(e,r),this}};ee.TempleEmitter=ge;var Ve=new ge;document.onreadystatechange=()=>{document.readyState!=="loading"&&Ve.emit("ready")};ee.default=Ve});var $e=M(re=>{"use strict";var Ct=re&&re.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(re,"__esModule",{value:!0});var je=Ct(te()),De=class{get attributes(){return Object.assign({},this._attributes)}get element(){return this._element}constructor(e,r){this._element=e,this._attributes=r}hasAttribute(e){return e in this._attributes}getAttribute(e){return this._attributes[e]}removeAttribute(e,r=!1){let a=this.getAttribute(e);return typeof a>"u"?this:(delete this._attributes[e],this._element.removeAttribute(e),r||je.default.emit("attribute-remove",{element:this,key:e,previous:a}),this)}setAttribute(e,r,a=!1){if(typeof r>"u")return this.removeAttribute(e,a);let i=this.getAttribute(e);return i===r?this:(this._attributes[e]=r,typeof r=="string"&&this._element.setAttribute(e,r),a||(typeof i>"u"?je.default.emit("attribute-create",{element:this,key:e,value:r}):je.default.emit("attribute-update",{element:this,key:e,value:r,previous:i})),this)}setAttributes(e,r=!1){for(let[i,p]of Object.entries(e))this.setAttribute(i,p,r);let a=Object.keys(e);for(let i of Object.keys(this._attributes))a.includes(i)||this.removeAttribute(i,r);return this}};re.default=De});var _e=M(ne=>{"use strict";var Mt=ne&&ne.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ne,"__esModule",{value:!0});var Ot=Mt($e()),be=class{static get elements(){return this._elements}static createComponent(e,r,a,i=[]){let p=document.createElement("template");p.innerHTML=`<${e}>`;let g=p.content.querySelector(`${e}`);Object.setPrototypeOf(g,r.prototype),g.constructor=r.constructor,g.constructor.component=r.component;for(let[v,T]of Object.entries(a))typeof T=="string"?g.setAttribute(v,T):T===!0&&g.setAttribute(v,v);return g._TempleAttributes=a,g.props=a,i.forEach(v=>g.appendChild(v)),g.register(),customElements.get(e)||g.connectedCallback(),this.register(g,a)}static createElement(e,r,a=[]){let i=document.createElement(e);for(let[p,h]of Object.entries(r))typeof h=="string"?i.setAttribute(p,h):h===!0&&i.setAttribute(p,p);return a.filter(p=>typeof p<"u").forEach(p=>i.appendChild(p)),this.register(i,r)}static createText(e,r=!1){return document.createTextNode(e)}static filter(e){let r=[];return this._elements.forEach((a,i)=>{e(a,i)&&r.push(a)}),r}static get(e){return this._elements.get(e)||null}static has(e){return this._elements.has(e)}static map(e){let r=[];return this._elements.forEach((a,i)=>{r.push(e(a,i))}),r}static register(e,r){if(this.has(e))return this.get(e);let a=new Ot.default(e,r||{});return this._elements.set(e,a),a}};be._elements=new Map;ne.default=be});var N=M(ie=>{"use strict";Object.defineProperty(ie,"__esModule",{value:!0});ie.TempleDataMap=void 0;var ve=class{constructor(){window.__APP_DATA__||(window.__APP_DATA__={})}clear(){return window.__APP_DATA__={},this}delete(e){return this.has(e)?(delete window.__APP_DATA__[e],!0):!1}entries(){return Object.entries(window.__APP_DATA__)}has(e){return e in window.__APP_DATA__}get(e){return window.__APP_DATA__[e]}keys(){return Object.keys(window.__APP_DATA__)}set(e,r){return window.__APP_DATA__[e]=r,this}values(){return Object.values(window.__APP_DATA__)}};ie.TempleDataMap=ve;var jt=new ve;ie.default=jt});var Ye=M(ae=>{"use strict";var qe=ae&&ae.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ae,"__esModule",{value:!0});var se=qe(_e()),ye=qe(te()),Xe=qe(N()),Le=class t extends HTMLElement{constructor(){super(...arguments),this._initiated=!1,this._template=null,this._attributes={},this._props={},this._children=void 0,this._rendering=!1}static register(){customElements.define(this.component[0],this)}get attr(){return this._attributes}get element(){return se.default.has(this)?se.default.get(this):se.default.register(this,this._TempleAttributes||{})}get metadata(){let[e,r]=this.constructor.component;return{tagname:e,classname:r}}get originalChildren(){return this._children}get initiated(){return this._initiated}get props(){return this._props}set props(e){this._props=Object.assign({},e),this._attributes=Object.fromEntries(Object.entries(e).filter(r=>typeof r[1]=="string"||r[1]===!0))}adoptedCallback(){this.render()}attributeChangedCallback(e,r,a){this.props=Object.assign(Object.assign({},this.props),{[e]:a}),this.render()}connectedCallback(){this.wait()}disconnectedCallback(){}getParentComponent(){let e=this.parentElement;for(;e;){if(e instanceof t)return e;e=e.parentElement}return null}register(){se.default.register(this,this._props)}render(){let e=this.getParentComponent();if(e&&!e.initiated)return;if(this._rendering)return;this._rendering=!0,Xe.default.set("current",this);let r=this.styles();this._template?ye.default.emit("unmounted",this):this._template=this.template();let a=this._template().filter(Boolean);if(r.length===0)this.textContent="",a.forEach(i=>this.appendChild(i));else{this.shadowRoot||this.attachShadow({mode:"open"});let i=this.shadowRoot;this.textContent="",i.textContent="";let p=document.createElement("style");p.innerText=r,i.appendChild(p),a.forEach(h=>{var g;return(g=this.shadowRoot)===null||g===void 0?void 0:g.appendChild(h)})}return Xe.default.delete("current"),this._initiated=!0,ye.default.emit("mounted",this),this._rendering=!1,this.shadowRoot?this.shadowRoot.innerHTML:this.innerHTML}wait(){if(document.readyState!=="loading")this._update();else{let e=()=>{this._update(),ye.default.unbind("ready",e)};ye.default.on("ready",e)}}_toNodeList(e){return e instanceof Node?[e]:Array.isArray(e)&&e.every(r=>r instanceof Node)?e:[se.default.createText(String(e))]}_update(){typeof this._children>"u"&&(this._children=Array.from(this.childNodes||[]));let e=this.element;e&&(this.props=Object.assign({},e.attributes),this.render()),this._initiated||this.render()}};ae.default=Le});var Ke=M(le=>{"use strict";var Dt=le&&le.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(le,"__esModule",{value:!0});var $t=Dt(N());function Lt(t){let e=$t.default.get("env")||{};return t?e[t]||null:e}le.default=Lt});var Re=M(ue=>{"use strict";var qt=ue&&ue.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ue,"__esModule",{value:!0});ue.default=Rt;var Qe=qt(N());function Rt(t=null){return t||(t=Qe.default.get("current")||null),t?t==="document"?Qe.default.get("props")||{}:t.props:{}}});var et=M(oe=>{"use strict";var It=oe&&oe.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(oe,"__esModule",{value:!0});oe.default=Nt;var zt=It(Re());function Nt(t=null){return(0,zt.default)(t).class}});var rt=M(G=>{"use strict";var Ht=G&&G.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(G,"__esModule",{value:!0});G.innerHTML=Ut;G.default=tt;var Bt=Ht(N());function Ut(t=null){let e=tt(t),r=document.createElement("template");return r.append(...e),r.innerHTML}function tt(t=null){return t||(t=Bt.default.get("current")||null),t?t.originalChildren||[]:[]}});var st=M(H=>{"use strict";var it=H&&H.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(H,"__esModule",{value:!0});H.SignalRegistry=void 0;H.default=Wt;var nt=it(Oe()),Gt=it(N()),W=class t{static observe(e,r){let a={getter:()=>i.raw,setter:h=>h},i={raw:r,getter(h){return a.getter=h,i},setter(h){return a.setter=h,i}};Object.defineProperty(i,"value",{get(){return a.getter()},set(h){let g=a.setter(h),v=t.serialize(g)!==t.serialize(i.raw);i.raw=g,v&&e.render()}});let p=this._observers.get(e);return p?(p.observed++,p.values.push(i)):this._observers.set(e,{observed:1,values:[i]}),i}static observer(e){return this._observers.get(e)||null}static serialize(e){return JSON.stringify(e)}};H.SignalRegistry=W;W._observers=new Map;function Wt(t,e=null){if(e||(e=Gt.default.get("current")||null),!e)throw nt.default.for("Signals can only be created within a Temple component");if(!e.initiated)return W.observe(e,t);let r=W.observer(e);if(!r)throw nt.default.for("State mismatch");return r.values[r.observed++%r.values.length]}});var ct=M(we=>{"use strict";var lt=we&&we.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(we,"__esModule",{value:!0});var at=lt(_e()),ut=lt(te()),ot=(t,e)=>Array.from(t.querySelectorAll("*")).filter(r=>{let a=at.default.get(r);return a&&a.hasAttribute(e)}).map(r=>at.default.get(r));function Ie(t,e){ut.default.on("mounted",r=>{if(!r.detail)return;let a=r.detail;ot(a.shadowRoot||a,t).forEach(e)})}function Zt(t,e){ut.default.on("unmounted",r=>{if(!r.detail)return;let a=r.detail;ot(a.shadowRoot||a,t).forEach(e)})}Ie("mount",t=>{let e=t.getAttribute("mount");if(typeof e=="function"){let r=new CustomEvent("mount",{detail:{node:t,target:t.element}});e(r)}});Zt("unmount",t=>{let e=t.getAttribute("unmount");if(typeof e=="function"){let r=new CustomEvent("unmount",{detail:{node:t,target:t.element}});e(r)}});Ie("if",t=>{let e=t.getAttribute("if");(e===!1||e==="false"||typeof e=="function"&&!e())&&t.element.remove()});["click","dblclick","mousedown","mouseup","mousemove","mouseover","mouseout","wheel","keydown","keypress","keyup","blur","change","contextmenu","focus","input","submit","invalid","reset","search","select","copy","cut","paste","drag","dragstart","dragend","dragover","dragenter","dragleave","drop","scroll","durationchange","ended","error","loadeddata","loadedmetadata","loadstart","pause","play","playing","progress","ratechange","seeked","seeking","stalled","suspend","timeupdate","volumechange","waiting","animationstart","animationend","animationiteration","transitionend","toggle"].forEach(t=>Ie(t,e=>{let r=e.getAttribute(t);typeof r=="function"&&(e.element.removeEventListener(t,r),e.element.addEventListener(t,r))}))});var ze=M(m=>{"use strict";var Jt=m&&m.__createBinding||(Object.create?function(t,e,r,a){a===void 0&&(a=r);var i=Object.getOwnPropertyDescriptor(e,r);(!i||("get"in i?!e.__esModule:i.writable||i.configurable))&&(i={enumerable:!0,get:function(){return e[r]}}),Object.defineProperty(t,a,i)}:function(t,e,r,a){a===void 0&&(a=r),t[a]=e[r]}),Vt=m&&m.__setModuleDefault||(Object.create?function(t,e){Object.defineProperty(t,"default",{enumerable:!0,value:e})}:function(t,e){t.default=e}),xe=m&&m.__importStar||function(t){if(t&&t.__esModule)return t;var e={};if(t!=null)for(var r in t)r!=="default"&&Object.prototype.hasOwnProperty.call(t,r)&&Jt(e,t,r);return Vt(e,t),e},B=m&&m.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(m,"__esModule",{value:!0});m.SignalRegistry=m.TempleException=m.TempleEmitter=m.TempleElement=m.TempleRegistry=m.TempleComponent=m.TempleDataMap=m.emitter=m.signal=m.innerHTML=m.children=m.classnames=m.props=m.env=m.data=void 0;var Xt=B(Oe());m.TempleException=Xt.default;var Yt=B(Ye());m.TempleComponent=Yt.default;var Kt=B(_e());m.TempleRegistry=Kt.default;var Qt=B($e());m.TempleElement=Qt.default;var dt=xe(te());m.emitter=dt.default;Object.defineProperty(m,"TempleEmitter",{enumerable:!0,get:function(){return dt.TempleEmitter}});var ft=xe(N());m.data=ft.default;Object.defineProperty(m,"TempleDataMap",{enumerable:!0,get:function(){return ft.TempleDataMap}});var er=B(Ke());m.env=er.default;var tr=B(Re());m.props=tr.default;var rr=B(et());m.classnames=rr.default;var pt=xe(rt());m.children=pt.default;Object.defineProperty(m,"innerHTML",{enumerable:!0,get:function(){return pt.innerHTML}});var mt=xe(st());m.signal=mt.default;Object.defineProperty(m,"SignalRegistry",{enumerable:!0,get:function(){return mt.SignalRegistry}});ct()});var I=M((wr,ht)=>{ht.exports={...ze()}});var gt=M((Ar,Te)=>{var nr=typeof window<"u"?window:typeof WorkerGlobalScope<"u"&&self instanceof WorkerGlobalScope?self:{};var c=function(t){var e=/(?:^|\s)lang(?:uage)?-([\w-]+)(?=\s|$)/i,r=0,a={},i={manual:t.Prism&&t.Prism.manual,disableWorkerMessageHandler:t.Prism&&t.Prism.disableWorkerMessageHandler,util:{encode:function n(s){return s instanceof p?new p(s.type,n(s.content),s.alias):Array.isArray(s)?s.map(n):s.replace(/&/g,"&").replace(/"u")return null;if("currentScript"in document)return document.currentScript;try{throw new Error}catch(u){var n=(/at [^(\r\n]*\((.*):[^:]+:[^:]+\)$/i.exec(u.stack)||[])[1];if(n){var s=document.getElementsByTagName("script");for(var l in s)if(s[l].src==n)return s[l]}return null}},isActive:function(n,s,l){for(var u="no-"+s;n;){var o=n.classList;if(o.contains(s))return!0;if(o.contains(u))return!1;n=n.parentElement}return!!l}},languages:{plain:a,plaintext:a,text:a,txt:a,extend:function(n,s){var l=i.util.clone(i.languages[n]);for(var u in s)l[u]=s[u];return l},insertBefore:function(n,s,l,u){u=u||i.languages;var o=u[n],f={};for(var b in o)if(o.hasOwnProperty(b)){if(b==s)for(var d in l)l.hasOwnProperty(d)&&(f[d]=l[d]);l.hasOwnProperty(b)||(f[b]=o[b])}var F=u[n];return u[n]=f,i.languages.DFS(i.languages,function(P,q){q===F&&P!=n&&(this[P]=f)}),f},DFS:function n(s,l,u,o){o=o||{};var f=i.util.objId;for(var b in s)if(s.hasOwnProperty(b)){l.call(s,b,s[b],u||b);var d=s[b],F=i.util.type(d);F==="Object"&&!o[f(d)]?(o[f(d)]=!0,n(d,l,null,o)):F==="Array"&&!o[f(d)]&&(o[f(d)]=!0,n(d,l,b,o))}}},plugins:{},highlightAll:function(n,s){i.highlightAllUnder(document,n,s)},highlightAllUnder:function(n,s,l){var u={callback:l,container:n,selector:'code[class*="language-"], [class*="language-"] code, code[class*="lang-"], [class*="lang-"] code'};i.hooks.run("before-highlightall",u),u.elements=Array.prototype.slice.apply(u.container.querySelectorAll(u.selector)),i.hooks.run("before-all-elements-highlight",u);for(var o=0,f;f=u.elements[o++];)i.highlightElement(f,s===!0,u.callback)},highlightElement:function(n,s,l){var u=i.util.getLanguage(n),o=i.languages[u];i.util.setLanguage(n,u);var f=n.parentElement;f&&f.nodeName.toLowerCase()==="pre"&&i.util.setLanguage(f,u);var b=n.textContent,d={element:n,language:u,grammar:o,code:b};function F(q){d.highlightedCode=q,i.hooks.run("before-insert",d),d.element.innerHTML=d.highlightedCode,i.hooks.run("after-highlight",d),i.hooks.run("complete",d),l&&l.call(d.element)}if(i.hooks.run("before-sanity-check",d),f=d.element.parentElement,f&&f.nodeName.toLowerCase()==="pre"&&!f.hasAttribute("tabindex")&&f.setAttribute("tabindex","0"),!d.code){i.hooks.run("complete",d),l&&l.call(d.element);return}if(i.hooks.run("before-highlight",d),!d.grammar){F(i.util.encode(d.code));return}if(s&&t.Worker){var P=new Worker(i.filename);P.onmessage=function(q){F(q.data)},P.postMessage(JSON.stringify({language:d.language,code:d.code,immediateClose:!0}))}else F(i.highlight(d.code,d.grammar,d.language))},highlight:function(n,s,l){var u={code:n,grammar:s,language:l};if(i.hooks.run("before-tokenize",u),!u.grammar)throw new Error('The language "'+u.language+'" has no grammar.');return u.tokens=i.tokenize(u.code,u.grammar),i.hooks.run("after-tokenize",u),p.stringify(i.util.encode(u.tokens),u.language)},tokenize:function(n,s){var l=s.rest;if(l){for(var u in l)s[u]=l[u];delete s.rest}var o=new v;return T(o,o.head,n),g(n,o,s,o.head,0),E(o)},hooks:{all:{},add:function(n,s){var l=i.hooks.all;l[n]=l[n]||[],l[n].push(s)},run:function(n,s){var l=i.hooks.all[n];if(!(!l||!l.length))for(var u=0,o;o=l[u++];)o(s)}},Token:p};t.Prism=i;function p(n,s,l,u){this.type=n,this.content=s,this.alias=l,this.length=(u||"").length|0}p.stringify=function n(s,l){if(typeof s=="string")return s;if(Array.isArray(s)){var u="";return s.forEach(function(F){u+=n(F,l)}),u}var o={type:s.type,content:n(s.content,l),tag:"span",classes:["token",s.type],attributes:{},language:l},f=s.alias;f&&(Array.isArray(f)?Array.prototype.push.apply(o.classes,f):o.classes.push(f)),i.hooks.run("wrap",o);var b="";for(var d in o.attributes)b+=" "+d+'="'+(o.attributes[d]||"").replace(/"/g,""")+'"';return"<"+o.tag+' class="'+o.classes.join(" ")+'"'+b+">"+o.content+""};function h(n,s,l,u){n.lastIndex=s;var o=n.exec(l);if(o&&u&&o[1]){var f=o[1].length;o.index+=f,o[0]=o[0].slice(f)}return o}function g(n,s,l,u,o,f){for(var b in l)if(!(!l.hasOwnProperty(b)||!l[b])){var d=l[b];d=Array.isArray(d)?d:[d];for(var F=0;F=f.reach);L+=C.value.length,C=C.next){var U=C.value;if(s.length>n.length)return;if(!(U instanceof p)){var de=1,$;if(Ge){if($=h(We,L,n,Ue),!$||$.index>=n.length)break;var fe=$.index,wt=$.index+$[0].length,R=L;for(R+=C.value.length;fe>=R;)C=C.next,R+=C.value.length;if(R-=C.value.length,L=R,C.value instanceof p)continue;for(var Q=C;Q!==s.tail&&(Rf.reach&&(f.reach=Se);var me=C.prev;ke&&(me=T(s,me,ke),L+=ke.length),y(s,me,de);var xt=new p(b,q?i.tokenize(pe,q):pe,vt,pe);if(C=T(s,me,xt),Ze&&T(s,C,Ze),de>1){var Pe={cause:b+","+F,reach:Se};g(n,s,l,C.prev,L,Pe),f&&Pe.reach>f.reach&&(f.reach=Pe.reach)}}}}}}function v(){var n={value:null,prev:null,next:null},s={value:null,prev:n,next:null};n.next=s,this.head=n,this.tail=s,this.length=0}function T(n,s,l){var u=s.next,o={value:l,prev:s,next:u};return s.next=o,u.prev=o,n.length++,o}function y(n,s,l){for(var u=s.next,o=0;o/,greedy:!0},prolog:{pattern:/<\?[\s\S]+?\?>/,greedy:!0},doctype:{pattern:/"'[\]]|"[^"]*"|'[^']*')+(?:\[(?:[^<"'\]]|"[^"]*"|'[^']*'|<(?!!--)|)*\]\s*)?>/i,greedy:!0,inside:{"internal-subset":{pattern:/(^[^\[]*\[)[\s\S]+(?=\]>$)/,lookbehind:!0,greedy:!0,inside:null},string:{pattern:/"[^"]*"|'[^']*'/,greedy:!0},punctuation:/^$|[[\]]/,"doctype-tag":/^DOCTYPE/i,name:/[^\s<>'"]+/}},cdata:{pattern://i,greedy:!0},tag:{pattern:/<\/?(?!\d)[^\s>\/=$<%]+(?:\s(?:\s*[^\s>\/=]+(?:\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))|(?=[\s/>])))+)?\s*\/?>/,greedy:!0,inside:{tag:{pattern:/^<\/?[^\s>\/]+/,inside:{punctuation:/^<\/?/,namespace:/^[^\s>\/:]+:/}},"special-attr":[],"attr-value":{pattern:/=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+)/,inside:{punctuation:[{pattern:/^=/,alias:"attr-equals"},{pattern:/^(\s*)["']|["']$/,lookbehind:!0}]}},punctuation:/\/?>/,"attr-name":{pattern:/[^\s>\/]+/,inside:{namespace:/^[^\s>\/:]+:/}}}},entity:[{pattern:/&[\da-z]{1,8};/i,alias:"named-entity"},/&#x?[\da-f]{1,8};/i]};c.languages.markup.tag.inside["attr-value"].inside.entity=c.languages.markup.entity;c.languages.markup.doctype.inside["internal-subset"].inside=c.languages.markup;c.hooks.add("wrap",function(t){t.type==="entity"&&(t.attributes.title=t.content.replace(/&/,"&"))});Object.defineProperty(c.languages.markup.tag,"addInlined",{value:function(e,r){var a={};a["language-"+r]={pattern:/(^$)/i,lookbehind:!0,inside:c.languages[r]},a.cdata=/^$/i;var i={"included-cdata":{pattern://i,inside:a}};i["language-"+r]={pattern:/[\s\S]+/,inside:c.languages[r]};var p={};p[e]={pattern:RegExp(/(<__[^>]*>)(?:))*\]\]>|(?!)/.source.replace(/__/g,function(){return e}),"i"),lookbehind:!0,greedy:!0,inside:i},c.languages.insertBefore("markup","cdata",p)}});Object.defineProperty(c.languages.markup.tag,"addAttribute",{value:function(t,e){c.languages.markup.tag.inside["special-attr"].push({pattern:RegExp(/(^|["'\s])/.source+"(?:"+t+")"+/\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))/.source,"i"),lookbehind:!0,inside:{"attr-name":/^[^\s=]+/,"attr-value":{pattern:/=[\s\S]+/,inside:{value:{pattern:/(^=\s*(["']|(?!["'])))\S[\s\S]*(?=\2$)/,lookbehind:!0,alias:[e,"language-"+e],inside:c.languages[e]},punctuation:[{pattern:/^=/,alias:"attr-equals"},/"|'/]}}}})}});c.languages.html=c.languages.markup;c.languages.mathml=c.languages.markup;c.languages.svg=c.languages.markup;c.languages.xml=c.languages.extend("markup",{});c.languages.ssml=c.languages.xml;c.languages.atom=c.languages.xml;c.languages.rss=c.languages.xml;(function(t){var e=/(?:"(?:\\(?:\r\n|[\s\S])|[^"\\\r\n])*"|'(?:\\(?:\r\n|[\s\S])|[^'\\\r\n])*')/;t.languages.css={comment:/\/\*[\s\S]*?\*\//,atrule:{pattern:RegExp("@[\\w-](?:"+/[^;{\s"']|\s+(?!\s)/.source+"|"+e.source+")*?"+/(?:;|(?=\s*\{))/.source),inside:{rule:/^@[\w-]+/,"selector-function-argument":{pattern:/(\bselector\s*\(\s*(?![\s)]))(?:[^()\s]|\s+(?![\s)])|\((?:[^()]|\([^()]*\))*\))+(?=\s*\))/,lookbehind:!0,alias:"selector"},keyword:{pattern:/(^|[^\w-])(?:and|not|only|or)(?![\w-])/,lookbehind:!0}}},url:{pattern:RegExp("\\burl\\((?:"+e.source+"|"+/(?:[^\\\r\n()"']|\\[\s\S])*/.source+")\\)","i"),greedy:!0,inside:{function:/^url/i,punctuation:/^\(|\)$/,string:{pattern:RegExp("^"+e.source+"$"),alias:"url"}}},selector:{pattern:RegExp(`(^|[{}\\s])[^{}\\s](?:[^{};"'\\s]|\\s+(?![\\s{])|`+e.source+")*(?=\\s*\\{)"),lookbehind:!0},string:{pattern:e,greedy:!0},property:{pattern:/(^|[^-\w\xA0-\uFFFF])(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*(?=\s*:)/i,lookbehind:!0},important:/!important\b/i,function:{pattern:/(^|[^-a-z0-9])[-a-z0-9]+(?=\()/i,lookbehind:!0},punctuation:/[(){};:,]/},t.languages.css.atrule.inside.rest=t.languages.css;var r=t.languages.markup;r&&(r.tag.addInlined("style","css"),r.tag.addAttribute("style","css"))})(c);c.languages.clike={comment:[{pattern:/(^|[^\\])\/\*[\s\S]*?(?:\*\/|$)/,lookbehind:!0,greedy:!0},{pattern:/(^|[^\\:])\/\/.*/,lookbehind:!0,greedy:!0}],string:{pattern:/(["'])(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/,greedy:!0},"class-name":{pattern:/(\b(?:class|extends|implements|instanceof|interface|new|trait)\s+|\bcatch\s+\()[\w.\\]+/i,lookbehind:!0,inside:{punctuation:/[.\\]/}},keyword:/\b(?:break|catch|continue|do|else|finally|for|function|if|in|instanceof|new|null|return|throw|try|while)\b/,boolean:/\b(?:false|true)\b/,function:/\b\w+(?=\()/,number:/\b0x[\da-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:e[+-]?\d+)?/i,operator:/[<>]=?|[!=]=?=?|--?|\+\+?|&&?|\|\|?|[?*/~^%]/,punctuation:/[{}[\];(),.:]/};c.languages.javascript=c.languages.extend("clike",{"class-name":[c.languages.clike["class-name"],{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$A-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\.(?:constructor|prototype))/,lookbehind:!0}],keyword:[{pattern:/((?:^|\})\s*)catch\b/,lookbehind:!0},{pattern:/(^|[^.]|\.\.\.\s*)\b(?:as|assert(?=\s*\{)|async(?=\s*(?:function\b|\(|[$\w\xA0-\uFFFF]|$))|await|break|case|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally(?=\s*(?:\{|$))|for|from(?=\s*(?:['"]|$))|function|(?:get|set)(?=\s*(?:[#\[$\w\xA0-\uFFFF]|$))|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)\b/,lookbehind:!0}],function:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*(?:\.\s*(?:apply|bind|call)\s*)?\()/,number:{pattern:RegExp(/(^|[^\w$])/.source+"(?:"+(/NaN|Infinity/.source+"|"+/0[bB][01]+(?:_[01]+)*n?/.source+"|"+/0[oO][0-7]+(?:_[0-7]+)*n?/.source+"|"+/0[xX][\dA-Fa-f]+(?:_[\dA-Fa-f]+)*n?/.source+"|"+/\d+(?:_\d+)*n/.source+"|"+/(?:\d+(?:_\d+)*(?:\.(?:\d+(?:_\d+)*)?)?|\.\d+(?:_\d+)*)(?:[Ee][+-]?\d+(?:_\d+)*)?/.source)+")"+/(?![\w$])/.source),lookbehind:!0},operator:/--|\+\+|\*\*=?|=>|&&=?|\|\|=?|[!=]==|<<=?|>>>?=?|[-+*/%&|^!=<>]=?|\.{3}|\?\?=?|\?\.?|[~:]/});c.languages.javascript["class-name"][0].pattern=/(\b(?:class|extends|implements|instanceof|interface|new)\s+)[\w.\\]+/;c.languages.insertBefore("javascript","keyword",{regex:{pattern:RegExp(/((?:^|[^$\w\xA0-\uFFFF."'\])\s]|\b(?:return|yield))\s*)/.source+/\//.source+"(?:"+/(?:\[(?:[^\]\\\r\n]|\\.)*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}/.source+"|"+/(?:\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.)*\])*\])*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}v[dgimyus]{0,7}/.source+")"+/(?=(?:\s|\/\*(?:[^*]|\*(?!\/))*\*\/)*(?:$|[\r\n,.;:})\]]|\/\/))/.source),lookbehind:!0,greedy:!0,inside:{"regex-source":{pattern:/^(\/)[\s\S]+(?=\/[a-z]*$)/,lookbehind:!0,alias:"language-regex",inside:c.languages.regex},"regex-delimiter":/^\/|\/$/,"regex-flags":/^[a-z]+$/}},"function-variable":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*[=:]\s*(?:async\s*)?(?:\bfunction\b|(?:\((?:[^()]|\([^()]*\))*\)|(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)\s*=>))/,alias:"function"},parameter:[{pattern:/(function(?:\s+(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)?\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\))/,lookbehind:!0,inside:c.languages.javascript},{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$a-z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*=>)/i,lookbehind:!0,inside:c.languages.javascript},{pattern:/(\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*=>)/,lookbehind:!0,inside:c.languages.javascript},{pattern:/((?:\b|\s|^)(?!(?:as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)(?![$\w\xA0-\uFFFF]))(?:(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*)\(\s*|\]\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*\{)/,lookbehind:!0,inside:c.languages.javascript}],constant:/\b[A-Z](?:[A-Z_]|\dx?)*\b/});c.languages.insertBefore("javascript","string",{hashbang:{pattern:/^#!.*/,greedy:!0,alias:"comment"},"template-string":{pattern:/`(?:\\[\s\S]|\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}|(?!\$\{)[^\\`])*`/,greedy:!0,inside:{"template-punctuation":{pattern:/^`|`$/,alias:"string"},interpolation:{pattern:/((?:^|[^\\])(?:\\{2})*)\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}/,lookbehind:!0,inside:{"interpolation-punctuation":{pattern:/^\$\{|\}$/,alias:"punctuation"},rest:c.languages.javascript}},string:/[\s\S]+/}},"string-property":{pattern:/((?:^|[,{])[ \t]*)(["'])(?:\\(?:\r\n|[\s\S])|(?!\2)[^\\\r\n])*\2(?=\s*:)/m,lookbehind:!0,greedy:!0,alias:"property"}});c.languages.insertBefore("javascript","operator",{"literal-property":{pattern:/((?:^|[,{])[ \t]*)(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*:)/m,lookbehind:!0,alias:"property"}});c.languages.markup&&(c.languages.markup.tag.addInlined("script","javascript"),c.languages.markup.tag.addAttribute(/on(?:abort|blur|change|click|composition(?:end|start|update)|dblclick|error|focus(?:in|out)?|key(?:down|up)|load|mouse(?:down|enter|leave|move|out|over|up)|reset|resize|scroll|select|slotchange|submit|unload|wheel)/.source,"javascript"));c.languages.js=c.languages.javascript;(function(){if(typeof c>"u"||typeof document>"u")return;Element.prototype.matches||(Element.prototype.matches=Element.prototype.msMatchesSelector||Element.prototype.webkitMatchesSelector);var t="Loading\u2026",e=function(w,_){return"\u2716 Error "+w+" while fetching file: "+_},r="\u2716 Error: File does not exist or is empty",a={js:"javascript",py:"python",rb:"ruby",ps1:"powershell",psm1:"powershell",sh:"bash",bat:"batch",h:"c",tex:"latex"},i="data-src-status",p="loading",h="loaded",g="failed",v="pre[data-src]:not(["+i+'="'+h+'"]):not(['+i+'="'+p+'"])';function T(w,_,x){var n=new XMLHttpRequest;n.open("GET",w,!0),n.onreadystatechange=function(){n.readyState==4&&(n.status<400&&n.responseText?_(n.responseText):n.status>=400?x(e(n.status,n.statusText)):x(r))},n.send(null)}function y(w){var _=/^\s*(\d+)\s*(?:(,)\s*(?:(\d+)\s*)?)?$/.exec(w||"");if(_){var x=Number(_[1]),n=_[2],s=_[3];return n?s?[x,Number(s)]:[x,void 0]:[x,x]}}c.hooks.add("before-highlightall",function(w){w.selector+=", "+v}),c.hooks.add("before-sanity-check",function(w){var _=w.element;if(_.matches(v)){w.code="",_.setAttribute(i,p);var x=_.appendChild(document.createElement("CODE"));x.textContent=t;var n=_.getAttribute("data-src"),s=w.language;if(s==="none"){var l=(/\.(\w+)$/.exec(n)||[,"none"])[1];s=a[l]||l}c.util.setLanguage(x,s),c.util.setLanguage(_,s);var u=c.plugins.autoloader;u&&u.loadLanguages(s),T(n,function(o){_.setAttribute(i,h);var f=y(_.getAttribute("data-range"));if(f){var b=o.split(/\r\n?|\n/g),d=f[0],F=f[1]==null?b.length:f[1];d<0&&(d+=b.length),d=Math.max(0,Math.min(d-1,b.length)),F<0&&(F+=b.length),F=Math.max(0,Math.min(F,b.length)),o=b.slice(d,F).join(`
-`),_.hasAttribute("data-start")||_.setAttribute("data-start",String(d+1))}x.textContent=o,c.highlightElement(x)},function(o){_.setAttribute(i,g),x.textContent=o})}}),c.plugins.fileHighlight={highlight:function(_){for(var x=(_||document).querySelectorAll(v),n=0,s;s=x[n++];)c.highlightElement(s)}};var E=!1;c.fileHighlight=function(){E||(console.warn("Prism.fileHighlight is deprecated. Use `Prism.plugins.fileHighlight.highlight` instead."),E=!0),c.plugins.fileHighlight.highlight.apply(this,arguments)}})()});var ce=M((Tr,bt)=>{bt.exports={...ze()}});var ar={};St(ar,{BUILD_ID:()=>sr,TempleComponent:()=>k.TempleComponent,TempleElement:()=>k.TempleElement,TempleEmitter:()=>k.TempleEmitter,TempleException:()=>k.TempleException,TempleRegistry:()=>k.TempleRegistry,children:()=>k.children,components:()=>ir,data:()=>k.data,emitter:()=>k.emitter,props:()=>k.props,signal:()=>k.signal});var j=D(I());var Ae=D(I()),Z=class extends Ae.TempleComponent{static component=["main","Main_fd7f1af6410c5b5c8e1f"];styles(){return""}template(){let e=this.props,r=()=>this.originalChildren;return()=>[Ae.TempleRegistry.createElement("main",{},[...this._toNodeList(r())]).element]}};var A=D(I()),Ne=D(gt()),_t=D(ce()),J=class extends A.TempleComponent{static component=["code","Code_6f36bc13bb6a166c7abc"];styles(){return`:host {
+var TempleAPI=(()=>{var Ht=Object.create;var Se=Object.defineProperty;var zt=Object.getOwnPropertyDescriptor;var Bt=Object.getOwnPropertyNames;var Wt=Object.getPrototypeOf,Ut=Object.prototype.hasOwnProperty;var M=(t,e)=>()=>(e||t((e={exports:{}}).exports,e),e.exports),Gt=(t,e)=>{for(var r in e)Se(t,r,{get:e[r],enumerable:!0})},ft=(t,e,r,a)=>{if(e&&typeof e=="object"||typeof e=="function")for(let s of Bt(e))!Ut.call(t,s)&&s!==r&&Se(t,s,{get:()=>e[s],enumerable:!(a=zt(e,s))||a.enumerable});return t};var k=(t,e,r)=>(r=t!=null?Ht(Wt(t)):{},ft(e||!t||!t.__esModule?Se(r,"default",{value:t,enumerable:!0}):r,t)),Zt=t=>ft(Se({},"__esModule",{value:!0}),t);var pe=M(Ke=>{"use strict";Object.defineProperty(Ke,"__esModule",{value:!0});var Ye=class extends Error{static for(e,...r){return r.forEach(function(a){e=e.replace("%s",a)}),new this(e)}static forErrorsFound(e){let r=new this("Invalid Parameters");return r.errors=e,r}static require(e,r,...a){if(!e){for(let s of a)r=r.replace("%s",s);throw new this(r)}}constructor(e,r=500){super(),this.errors={},this.start=0,this.end=0,this.message=e,this.name=this.constructor.name,this.code=r}withCode(e){return this.code=e,this}withPosition(e,r){return this.start=e,this.end=r,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};Ke.default=Ye});var De=M(D=>{"use strict";var Jt=D&&D.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(D,"__esModule",{value:!0});D.match=D.TempleEmitter=D.events=void 0;D.bindAttribute=B;D.unbindAttribute=ht;var mt=Jt(Oe());D.events=["click","dblclick","mousedown","mouseup","mousemove","mouseover","mouseout","wheel","keydown","keypress","keyup","blur","change","contextmenu","focus","input","submit","invalid","reset","search","select","copy","cut","paste","drag","dragstart","dragend","dragover","dragenter","dragleave","drop","scroll","durationchange","ended","error","loadeddata","loadedmetadata","loadstart","pause","play","playing","progress","ratechange","seeked","seeking","stalled","suspend","timeupdate","volumechange","waiting","animationstart","animationend","animationiteration","transitionend","toggle"];var Ce=class extends EventTarget{emit(e,r){return this.dispatchEvent(new CustomEvent(e,{detail:r})),this}on(e,r){if(e==="ready"&&document.readyState!=="loading"){let a=new CustomEvent("ready");return setTimeout(()=>r(a),1),this}return this.addEventListener(e,r),this}once(e,r){let a=s=>{this.unbind(e,a),r(s)};return this.on(e,a),this}unbind(e,r){return this.removeEventListener(e,r),this}};D.TempleEmitter=Ce;var Vt=(t,e)=>Array.from(t.querySelectorAll("*")).filter(r=>{let a=mt.default.get(r),s=a&&a.hasAttribute(e)&&!a.hasEvent(e);return s&&a.addEvent(e),s}).map(r=>mt.default.get(r));D.match=Vt;function B(t,e){Me.on("mounted",r=>{if(!r.detail)return;let a=r.detail;(0,D.match)(a.shadowRoot||a,t).forEach(e)})}function ht(t,e){Me.on("unmounted",r=>{if(!r.detail)return;let a=r.detail;(0,D.match)(a.shadowRoot||a,t).forEach(e)})}var Me=new Ce;D.default=(document.onreadystatechange=()=>{document.readyState!=="loading"&&Me.emit("ready")},B("mount",t=>{let e=t.getAttribute("mount");if(typeof e=="function"){let r=new CustomEvent("mount",{detail:{node:t,target:t.element}});e(r)}}),ht("unmount",t=>{let e=t.getAttribute("unmount");if(typeof e=="function"){let r=new CustomEvent("unmount",{detail:{node:t,target:t.element}});e(r)}}),B("connect",t=>{let e=t.getAttribute("connect");if(typeof e=="function"){let r=new CustomEvent("connect",{detail:{node:t,target:t.element}});e(r)}}),B("disconnect",t=>{let e=t.getAttribute("disconnect");if(typeof e=="function"){let r=new CustomEvent("disconnect",{detail:{node:t,target:t.element}});e(r)}}),B("adopt",t=>{let e=t.getAttribute("adopt");if(typeof e=="function"){let r=new CustomEvent("adopt",{detail:{node:t,target:t.element}});e(r)}}),B("if",t=>{let e=t.getAttribute("if");(e===!1||e==="false"||typeof e=="function"&&!e())&&t.element.remove()}),D.events.forEach(t=>B(t,e=>{let r=e.getAttribute(t);typeof r=="function"&&(e.element.removeEventListener(t,r),e.element.addEventListener(t,r))})),Me)});var tt=M(fe=>{"use strict";var Xt=fe&&fe.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(fe,"__esModule",{value:!0});var Qe=Xt(De()),et=class{get attributes(){return Object.assign({},this._attributes)}get element(){return this._element}get events(){return this._events}constructor(e,r){this._events=new Set,this._element=e,this._attributes=r}addEvent(e){return this._events.add(e),this}getAttribute(e){return this._attributes[e]}hasAttribute(e){return e in this._attributes}hasEvent(e){return this._events.has(e)}removeAttribute(e,r=!1){let a=this.getAttribute(e);return typeof a>"u"?this:(delete this._attributes[e],this._element.removeAttribute(e),r||Qe.default.emit("attribute-remove",{element:this,key:e,previous:a}),this)}setAttribute(e,r,a=!1){if(typeof r>"u")return this.removeAttribute(e,a);let s=this.getAttribute(e);return s===r?this:(this._attributes[e]=r,typeof r=="string"&&this._element.setAttribute(e,r),a||(typeof s>"u"?Qe.default.emit("attribute-create",{element:this,key:e,value:r}):Qe.default.emit("attribute-update",{element:this,key:e,value:r,previous:s})),this)}setAttributes(e,r=!1){for(let[s,c]of Object.entries(e))this.setAttribute(s,c,r);let a=Object.keys(e);for(let s of Object.keys(this._attributes))a.includes(s)||this.removeAttribute(s,r);return this}};fe.default=et});var Oe=M(me=>{"use strict";var Yt=me&&me.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(me,"__esModule",{value:!0});var Kt=Yt(tt()),gt=document.createElement("textarea"),Qt=t=>(gt.innerHTML=t,gt.value),je=class{static get elements(){return this._elements}static createComponent(e,r,a,s=[]){let c=document.createElement("template");c.innerHTML=`<${e}>`;let g=c.content.querySelector(`${e}`);return Object.setPrototypeOf(g,r.prototype),g.constructor=r.constructor,g.constructor.component=r.component,g.register(a,s),g.element}static createElement(e,r,a=[]){let s=document.createElement(e);for(let[c,b]of Object.entries(r))typeof b=="string"?s.setAttribute(c,b):b===!0&&s.setAttribute(c,c);return a.filter(c=>typeof c<"u").forEach(c=>s.appendChild(c)),this.register(s,r)}static createText(e,r=!0){return document.createTextNode(Qt(e))}static filter(e){let r=[];return this._elements.forEach((a,s)=>{e(a,s)&&r.push(a)}),r}static get(e){return this._elements.get(e)||null}static has(e){return this._elements.has(e)}static map(e){let r=[];return this._elements.forEach((a,s)=>{r.push(e(a,s))}),r}static register(e,r){if(this.has(e))return this.get(e);let a=new Kt.default(e,r||{});return this._elements.set(e,a),a}};je._elements=new Map;me.default=je});var X=M(he=>{"use strict";Object.defineProperty(he,"__esModule",{value:!0});he.TempleDataMap=void 0;var $e=class{constructor(){window.__APP_DATA__||(window.__APP_DATA__={})}clear(){return window.__APP_DATA__={},this}delete(e){return this.has(e)?(delete window.__APP_DATA__[e],!0):!1}entries(){return Object.entries(window.__APP_DATA__)}has(e){return e in window.__APP_DATA__}get(e){return window.__APP_DATA__[e]}keys(){return Object.keys(window.__APP_DATA__)}set(e,r){return window.__APP_DATA__[e]=r,this}values(){return Object.values(window.__APP_DATA__)}};he.TempleDataMap=$e;var er=new $e;he.default=er});var yt=M(ge=>{"use strict";var Re=ge&&ge.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ge,"__esModule",{value:!0});var bt=Re(pe()),W=Re(Oe()),U=Re(De()),Ne=Re(X()),rt=class t extends HTMLElement{static register(){customElements.define(this.component[0],this)}get attr(){return Object.fromEntries(Array.from(this.attributes).map(e=>[e.name,e.value]))}get element(){if(!W.default.has(this))throw bt.default.for("Component not mapped.");return W.default.get(this)}get metadata(){let[e,r]=this.constructor.component;return{tagname:e,classname:r}}get originalChildren(){return this._children}get initiated(){return this._initiated}get props(){return this.getAttributes()}get virtual(){return this._virtual}set props(e){this.setAttributes(e)}constructor(){if(super(),this._initiated=!1,this._template=null,this._children=void 0,this._rendering=!1,this._observer=null,this._virtual=!1,!W.default.has(this))throw bt.default.for("Component not mapped.")}adoptedCallback(){this.render(),U.default.emit("adopt",this)}connectedCallback(){this.wait(),U.default.emit("connect",this)}disconnectedCallback(){U.default.emit("disconnect",this)}getAttribute(e){return this.element.getAttribute(e)}getAttributes(){return Object.assign({},this.element.attributes)}getParentComponent(){let e=this.parentElement;for(;e;){if(e instanceof t)return e;e=e.parentElement}return null}hasAttribute(e){return this.element.hasAttribute(e)}register(e={},r=[]){W.default.has(this)?W.default.get(this).setAttributes(e):W.default.register(this,e);for(let[a,s]of Object.entries(e))typeof s=="string"?super.setAttribute(a,s):s===!0&&super.setAttribute(a,a);this._children=r,this._virtual=!0,this.connectedCallback()}removeAttribute(e){this.hasAttribute(e)&&this.element.removeAttribute(e),super.hasAttribute(e)&&super.removeAttribute(e)}render(){let e=this.getParentComponent();if(e&&!e.initiated)return;if(this._rendering)return;this._rendering=!0;let r=Ne.default.get("current");Ne.default.set("current",this);let a=this.styles();this._template?U.default.emit("unmounted",this):this._template=this.template();let s=this._template().filter(Boolean);if(a.length===0)this.textContent="",s.forEach(c=>this.appendChild(c));else{this.shadowRoot||this.attachShadow({mode:"open"});let c=this.shadowRoot;this.textContent="",c.textContent="";let b=document.createElement("style");b.innerText=a,c.appendChild(b),s.forEach(g=>{var x;return(x=this.shadowRoot)===null||x===void 0?void 0:x.appendChild(g)})}return r?Ne.default.set("current",r):Ne.default.delete("current"),this._initiated=!0,this._rendering=!1,U.default.emit("mounted",this),this.shadowRoot?this.shadowRoot.innerHTML:this.innerHTML}setAttribute(e,r){this.element.setAttribute(e,r),(typeof r=="string"||r===!0)&&super.setAttribute(e,r)}setAttributes(e){this.element.setAttributes(e)}wait(){if(document.readyState!=="loading")this._update();else{let e=()=>{this._update(),U.default.unbind("ready",e)};U.default.on("ready",e)}}_toNodeList(e){return e instanceof Node?[e]:Array.isArray(e)&&e.every(r=>r instanceof Node)?e:[W.default.createText(String(e))]}_update(){typeof this._children>"u"&&(this._children=Array.from(this.childNodes||[])),this._initiated||this.render()}};ge.default=rt});var Y=M(be=>{"use strict";var xt=be&&be.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(be,"__esModule",{value:!0});be.default=sr;var tr=xt(pe()),rr=xt(X());function sr(t=null,e=!1){if(!t&&(t=rr.default.get("current"),!t)){if(!e)throw tr.default.for("Not called within a Temple component");return null}return t}});var _t=M(ye=>{"use strict";var nr=ye&&ye.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ye,"__esModule",{value:!0});var ir=nr(X());function ar(t){let e=ir.default.get("env")||{};return t?e[t]||null:e}ye.default=ar});var st=M(xe=>{"use strict";var vt=xe&&xe.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(xe,"__esModule",{value:!0});xe.default=ur;var lr=vt(Y()),or=vt(X());function ur(t=null){let e=(0,lr.default)(t,!0);return typeof e=="string"?or.default.get("props")||{}:e?e.props:{}}});var At=M(K=>{"use strict";var wt=K&&K.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(K,"__esModule",{value:!0});K.classlist=pr;K.default=fr;var cr=wt(Y()),dr=wt(st());function pr(t=null){var e;if(t==="body")return document.body.classList;if(t==="head")return document.head.classList;if(t==="document")return(e=document.body.parentElement)===null||e===void 0?void 0:e.classList;let r=(0,cr.default)(t);return r?.classList}function fr(t=null){return(0,dr.default)(t).class}});var Tt=M(G=>{"use strict";var mr=G&&G.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(G,"__esModule",{value:!0});G.innerHTML=gr;G.innerText=br;G.default=nt;var hr=mr(Y());function gr(t=null){let e=nt(t),r=document.createElement("template");return r.append(...e.map(a=>a.cloneNode(!0))),r.innerHTML}function br(t=null){let e=nt(t),r=document.createElement("template");return r.append(...e.map(a=>a.cloneNode(!0))),r.innerText}function nt(t=null){let e=(0,hr.default)(t,!0);return typeof e!="string"&&e?e.originalChildren||[]:[]}});var kt=M(Z=>{"use strict";var Et=Z&&Z.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Z,"__esModule",{value:!0});Z.SignalRegistry=void 0;Z.default=_r;var yr=Et(Y()),xr=Et(pe()),Q=class t{static observe(e,r){let a={getter:()=>c.raw,setter:g=>g},s=new Set,c={raw:r,change(g){s.add(g)},getter(g){return a.getter=g,c},setter(g){return a.setter=g,c}};Object.defineProperty(c,"value",{get(){return a.getter()},set(g){let x=a.setter(g),v=t.serialize(x)!==t.serialize(c.raw);c.raw=x,v&&(s.forEach(h=>h(x)),e.render())}});let b=this._observers.get(e);return b?(b.observed++,b.values.push(c)):this._observers.set(e,{observed:1,values:[c]}),c}static observer(e){return this._observers.get(e)||null}static serialize(e){return JSON.stringify(e)}};Z.SignalRegistry=Q;Q._observers=new Map;function _r(t,e=null){let r=(0,yr.default)(e);if(!r.initiated)return Q.observe(r,t);let a=Q.observer(r);if(!a)throw xr.default.for("Signal state mismatch");return a.values[a.observed++%a.values.length]}});var at=M(m=>{"use strict";var vr=m&&m.__createBinding||(Object.create?function(t,e,r,a){a===void 0&&(a=r);var s=Object.getOwnPropertyDescriptor(e,r);(!s||("get"in s?!e.__esModule:s.writable||s.configurable))&&(s={enumerable:!0,get:function(){return e[r]}}),Object.defineProperty(t,a,s)}:function(t,e,r,a){a===void 0&&(a=r),t[a]=e[r]}),wr=m&&m.__setModuleDefault||(Object.create?function(t,e){Object.defineProperty(t,"default",{enumerable:!0,value:e})}:function(t,e){t.default=e}),_e=m&&m.__importStar||function(t){if(t&&t.__esModule)return t;var e={};if(t!=null)for(var r in t)r!=="default"&&Object.prototype.hasOwnProperty.call(t,r)&&vr(e,t,r);return wr(e,t),e},J=m&&m.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(m,"__esModule",{value:!0});m.SignalRegistry=m.TempleException=m.TempleEmitter=m.TempleElement=m.TempleRegistry=m.TempleComponent=m.TempleDataMap=m.emitter=m.signal=m.innerHTML=m.innerText=m.children=m.classnames=m.classlist=m.props=m.env=m.data=m.component=void 0;var Ar=J(pe());m.TempleException=Ar.default;var Tr=J(yt());m.TempleComponent=Tr.default;var Er=J(Oe());m.TempleRegistry=Er.default;var kr=J(tt());m.TempleElement=kr.default;var Lt=_e(De());m.emitter=Lt.default;Object.defineProperty(m,"TempleEmitter",{enumerable:!0,get:function(){return Lt.TempleEmitter}});var Lr=J(Y());m.component=Lr.default;var Ft=_e(X());m.data=Ft.default;Object.defineProperty(m,"TempleDataMap",{enumerable:!0,get:function(){return Ft.TempleDataMap}});var Fr=J(_t());m.env=Fr.default;var Pr=J(st());m.props=Pr.default;var Pt=_e(At());m.classnames=Pt.default;Object.defineProperty(m,"classlist",{enumerable:!0,get:function(){return Pt.classlist}});var it=_e(Tt());m.children=it.default;Object.defineProperty(m,"innerHTML",{enumerable:!0,get:function(){return it.innerHTML}});Object.defineProperty(m,"innerText",{enumerable:!0,get:function(){return it.innerText}});var St=_e(kt());m.signal=St.default;Object.defineProperty(m,"SignalRegistry",{enumerable:!0,get:function(){return St.SignalRegistry}})});var j=M((Vr,Ct)=>{Ct.exports={...at()}});var q=M((Xr,Mt)=>{Mt.exports={...at()}});var Ot=M((is,Ge)=>{var Sr=typeof window<"u"?window:typeof WorkerGlobalScope<"u"&&self instanceof WorkerGlobalScope?self:{};var d=function(t){var e=/(?:^|\s)lang(?:uage)?-([\w-]+)(?=\s|$)/i,r=0,a={},s={manual:t.Prism&&t.Prism.manual,disableWorkerMessageHandler:t.Prism&&t.Prism.disableWorkerMessageHandler,util:{encode:function i(n){return n instanceof c?new c(n.type,i(n.content),n.alias):Array.isArray(n)?n.map(i):n.replace(/&/g,"&").replace(/"u")return null;if("currentScript"in document)return document.currentScript;try{throw new Error}catch(u){var i=(/at [^(\r\n]*\((.*):[^:]+:[^:]+\)$/i.exec(u.stack)||[])[1];if(i){var n=document.getElementsByTagName("script");for(var o in n)if(n[o].src==i)return n[o]}return null}},isActive:function(i,n,o){for(var u="no-"+n;i;){var l=i.classList;if(l.contains(n))return!0;if(l.contains(u))return!1;i=i.parentElement}return!!o}},languages:{plain:a,plaintext:a,text:a,txt:a,extend:function(i,n){var o=s.util.clone(s.languages[i]);for(var u in n)o[u]=n[u];return o},insertBefore:function(i,n,o,u){u=u||s.languages;var l=u[i],p={};for(var y in l)if(l.hasOwnProperty(y)){if(y==n)for(var f in o)o.hasOwnProperty(f)&&(p[f]=o[f]);o.hasOwnProperty(y)||(p[y]=l[y])}var L=u[i];return u[i]=p,s.languages.DFS(s.languages,function(S,H){H===L&&S!=i&&(this[S]=p)}),p},DFS:function i(n,o,u,l){l=l||{};var p=s.util.objId;for(var y in n)if(n.hasOwnProperty(y)){o.call(n,y,n[y],u||y);var f=n[y],L=s.util.type(f);L==="Object"&&!l[p(f)]?(l[p(f)]=!0,i(f,o,null,l)):L==="Array"&&!l[p(f)]&&(l[p(f)]=!0,i(f,o,y,l))}}},plugins:{},highlightAll:function(i,n){s.highlightAllUnder(document,i,n)},highlightAllUnder:function(i,n,o){var u={callback:o,container:i,selector:'code[class*="language-"], [class*="language-"] code, code[class*="lang-"], [class*="lang-"] code'};s.hooks.run("before-highlightall",u),u.elements=Array.prototype.slice.apply(u.container.querySelectorAll(u.selector)),s.hooks.run("before-all-elements-highlight",u);for(var l=0,p;p=u.elements[l++];)s.highlightElement(p,n===!0,u.callback)},highlightElement:function(i,n,o){var u=s.util.getLanguage(i),l=s.languages[u];s.util.setLanguage(i,u);var p=i.parentElement;p&&p.nodeName.toLowerCase()==="pre"&&s.util.setLanguage(p,u);var y=i.textContent,f={element:i,language:u,grammar:l,code:y};function L(H){f.highlightedCode=H,s.hooks.run("before-insert",f),f.element.innerHTML=f.highlightedCode,s.hooks.run("after-highlight",f),s.hooks.run("complete",f),o&&o.call(f.element)}if(s.hooks.run("before-sanity-check",f),p=f.element.parentElement,p&&p.nodeName.toLowerCase()==="pre"&&!p.hasAttribute("tabindex")&&p.setAttribute("tabindex","0"),!f.code){s.hooks.run("complete",f),o&&o.call(f.element);return}if(s.hooks.run("before-highlight",f),!f.grammar){L(s.util.encode(f.code));return}if(n&&t.Worker){var S=new Worker(s.filename);S.onmessage=function(H){L(H.data)},S.postMessage(JSON.stringify({language:f.language,code:f.code,immediateClose:!0}))}else L(s.highlight(f.code,f.grammar,f.language))},highlight:function(i,n,o){var u={code:i,grammar:n,language:o};if(s.hooks.run("before-tokenize",u),!u.grammar)throw new Error('The language "'+u.language+'" has no grammar.');return u.tokens=s.tokenize(u.code,u.grammar),s.hooks.run("after-tokenize",u),c.stringify(s.util.encode(u.tokens),u.language)},tokenize:function(i,n){var o=n.rest;if(o){for(var u in o)n[u]=o[u];delete n.rest}var l=new x;return v(l,l.head,i),g(i,l,n,l.head,0),A(l)},hooks:{all:{},add:function(i,n){var o=s.hooks.all;o[i]=o[i]||[],o[i].push(n)},run:function(i,n){var o=s.hooks.all[i];if(!(!o||!o.length))for(var u=0,l;l=o[u++];)l(n)}},Token:c};t.Prism=s;function c(i,n,o,u){this.type=i,this.content=n,this.alias=o,this.length=(u||"").length|0}c.stringify=function i(n,o){if(typeof n=="string")return n;if(Array.isArray(n)){var u="";return n.forEach(function(L){u+=i(L,o)}),u}var l={type:n.type,content:i(n.content,o),tag:"span",classes:["token",n.type],attributes:{},language:o},p=n.alias;p&&(Array.isArray(p)?Array.prototype.push.apply(l.classes,p):l.classes.push(p)),s.hooks.run("wrap",l);var y="";for(var f in l.attributes)y+=" "+f+'="'+(l.attributes[f]||"").replace(/"/g,""")+'"';return"<"+l.tag+' class="'+l.classes.join(" ")+'"'+y+">"+l.content+""};function b(i,n,o,u){i.lastIndex=n;var l=i.exec(o);if(l&&u&&l[1]){var p=l[1].length;l.index+=p,l[0]=l[0].slice(p)}return l}function g(i,n,o,u,l,p){for(var y in o)if(!(!o.hasOwnProperty(y)||!o[y])){var f=o[y];f=Array.isArray(f)?f:[f];for(var L=0;L=p.reach);I+=C.value.length,C=C.next){var V=C.value;if(n.length>i.length)return;if(!(V instanceof c)){var ke=1,R;if(ct){if(R=b(dt,I,i,ut),!R||R.index>=i.length)break;var Le=R.index,qt=R.index+R[0].length,z=I;for(z+=C.value.length;Le>=z;)C=C.next,z+=C.value.length;if(z-=C.value.length,I=z,C.value instanceof c)continue;for(var de=C;de!==n.tail&&(zp.reach&&(p.reach=Ve);var Pe=C.prev;Je&&(Pe=v(n,Pe,Je),I+=Je.length),h(n,Pe,ke);var It=new c(y,H?s.tokenize(Fe,H):Fe,Nt,Fe);if(C=v(n,Pe,It),pt&&v(n,C,pt),ke>1){var Xe={cause:y+","+L,reach:Ve};g(i,n,o,C.prev,I,Xe),p&&Xe.reach>p.reach&&(p.reach=Xe.reach)}}}}}}function x(){var i={value:null,prev:null,next:null},n={value:null,prev:i,next:null};i.next=n,this.head=i,this.tail=n,this.length=0}function v(i,n,o){var u=n.next,l={value:o,prev:n,next:u};return n.next=l,u.prev=l,i.length++,l}function h(i,n,o){for(var u=n.next,l=0;l/,greedy:!0},prolog:{pattern:/<\?[\s\S]+?\?>/,greedy:!0},doctype:{pattern:/"'[\]]|"[^"]*"|'[^']*')+(?:\[(?:[^<"'\]]|"[^"]*"|'[^']*'|<(?!!--)|)*\]\s*)?>/i,greedy:!0,inside:{"internal-subset":{pattern:/(^[^\[]*\[)[\s\S]+(?=\]>$)/,lookbehind:!0,greedy:!0,inside:null},string:{pattern:/"[^"]*"|'[^']*'/,greedy:!0},punctuation:/^$|[[\]]/,"doctype-tag":/^DOCTYPE/i,name:/[^\s<>'"]+/}},cdata:{pattern://i,greedy:!0},tag:{pattern:/<\/?(?!\d)[^\s>\/=$<%]+(?:\s(?:\s*[^\s>\/=]+(?:\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))|(?=[\s/>])))+)?\s*\/?>/,greedy:!0,inside:{tag:{pattern:/^<\/?[^\s>\/]+/,inside:{punctuation:/^<\/?/,namespace:/^[^\s>\/:]+:/}},"special-attr":[],"attr-value":{pattern:/=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+)/,inside:{punctuation:[{pattern:/^=/,alias:"attr-equals"},{pattern:/^(\s*)["']|["']$/,lookbehind:!0}]}},punctuation:/\/?>/,"attr-name":{pattern:/[^\s>\/]+/,inside:{namespace:/^[^\s>\/:]+:/}}}},entity:[{pattern:/&[\da-z]{1,8};/i,alias:"named-entity"},/&#x?[\da-f]{1,8};/i]};d.languages.markup.tag.inside["attr-value"].inside.entity=d.languages.markup.entity;d.languages.markup.doctype.inside["internal-subset"].inside=d.languages.markup;d.hooks.add("wrap",function(t){t.type==="entity"&&(t.attributes.title=t.content.replace(/&/,"&"))});Object.defineProperty(d.languages.markup.tag,"addInlined",{value:function(e,r){var a={};a["language-"+r]={pattern:/(^$)/i,lookbehind:!0,inside:d.languages[r]},a.cdata=/^$/i;var s={"included-cdata":{pattern://i,inside:a}};s["language-"+r]={pattern:/[\s\S]+/,inside:d.languages[r]};var c={};c[e]={pattern:RegExp(/(<__[^>]*>)(?:))*\]\]>|(?!)/.source.replace(/__/g,function(){return e}),"i"),lookbehind:!0,greedy:!0,inside:s},d.languages.insertBefore("markup","cdata",c)}});Object.defineProperty(d.languages.markup.tag,"addAttribute",{value:function(t,e){d.languages.markup.tag.inside["special-attr"].push({pattern:RegExp(/(^|["'\s])/.source+"(?:"+t+")"+/\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))/.source,"i"),lookbehind:!0,inside:{"attr-name":/^[^\s=]+/,"attr-value":{pattern:/=[\s\S]+/,inside:{value:{pattern:/(^=\s*(["']|(?!["'])))\S[\s\S]*(?=\2$)/,lookbehind:!0,alias:[e,"language-"+e],inside:d.languages[e]},punctuation:[{pattern:/^=/,alias:"attr-equals"},/"|'/]}}}})}});d.languages.html=d.languages.markup;d.languages.mathml=d.languages.markup;d.languages.svg=d.languages.markup;d.languages.xml=d.languages.extend("markup",{});d.languages.ssml=d.languages.xml;d.languages.atom=d.languages.xml;d.languages.rss=d.languages.xml;(function(t){var e=/(?:"(?:\\(?:\r\n|[\s\S])|[^"\\\r\n])*"|'(?:\\(?:\r\n|[\s\S])|[^'\\\r\n])*')/;t.languages.css={comment:/\/\*[\s\S]*?\*\//,atrule:{pattern:RegExp("@[\\w-](?:"+/[^;{\s"']|\s+(?!\s)/.source+"|"+e.source+")*?"+/(?:;|(?=\s*\{))/.source),inside:{rule:/^@[\w-]+/,"selector-function-argument":{pattern:/(\bselector\s*\(\s*(?![\s)]))(?:[^()\s]|\s+(?![\s)])|\((?:[^()]|\([^()]*\))*\))+(?=\s*\))/,lookbehind:!0,alias:"selector"},keyword:{pattern:/(^|[^\w-])(?:and|not|only|or)(?![\w-])/,lookbehind:!0}}},url:{pattern:RegExp("\\burl\\((?:"+e.source+"|"+/(?:[^\\\r\n()"']|\\[\s\S])*/.source+")\\)","i"),greedy:!0,inside:{function:/^url/i,punctuation:/^\(|\)$/,string:{pattern:RegExp("^"+e.source+"$"),alias:"url"}}},selector:{pattern:RegExp(`(^|[{}\\s])[^{}\\s](?:[^{};"'\\s]|\\s+(?![\\s{])|`+e.source+")*(?=\\s*\\{)"),lookbehind:!0},string:{pattern:e,greedy:!0},property:{pattern:/(^|[^-\w\xA0-\uFFFF])(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*(?=\s*:)/i,lookbehind:!0},important:/!important\b/i,function:{pattern:/(^|[^-a-z0-9])[-a-z0-9]+(?=\()/i,lookbehind:!0},punctuation:/[(){};:,]/},t.languages.css.atrule.inside.rest=t.languages.css;var r=t.languages.markup;r&&(r.tag.addInlined("style","css"),r.tag.addAttribute("style","css"))})(d);d.languages.clike={comment:[{pattern:/(^|[^\\])\/\*[\s\S]*?(?:\*\/|$)/,lookbehind:!0,greedy:!0},{pattern:/(^|[^\\:])\/\/.*/,lookbehind:!0,greedy:!0}],string:{pattern:/(["'])(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/,greedy:!0},"class-name":{pattern:/(\b(?:class|extends|implements|instanceof|interface|new|trait)\s+|\bcatch\s+\()[\w.\\]+/i,lookbehind:!0,inside:{punctuation:/[.\\]/}},keyword:/\b(?:break|catch|continue|do|else|finally|for|function|if|in|instanceof|new|null|return|throw|try|while)\b/,boolean:/\b(?:false|true)\b/,function:/\b\w+(?=\()/,number:/\b0x[\da-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:e[+-]?\d+)?/i,operator:/[<>]=?|[!=]=?=?|--?|\+\+?|&&?|\|\|?|[?*/~^%]/,punctuation:/[{}[\];(),.:]/};d.languages.javascript=d.languages.extend("clike",{"class-name":[d.languages.clike["class-name"],{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$A-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\.(?:constructor|prototype))/,lookbehind:!0}],keyword:[{pattern:/((?:^|\})\s*)catch\b/,lookbehind:!0},{pattern:/(^|[^.]|\.\.\.\s*)\b(?:as|assert(?=\s*\{)|async(?=\s*(?:function\b|\(|[$\w\xA0-\uFFFF]|$))|await|break|case|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally(?=\s*(?:\{|$))|for|from(?=\s*(?:['"]|$))|function|(?:get|set)(?=\s*(?:[#\[$\w\xA0-\uFFFF]|$))|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)\b/,lookbehind:!0}],function:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*(?:\.\s*(?:apply|bind|call)\s*)?\()/,number:{pattern:RegExp(/(^|[^\w$])/.source+"(?:"+(/NaN|Infinity/.source+"|"+/0[bB][01]+(?:_[01]+)*n?/.source+"|"+/0[oO][0-7]+(?:_[0-7]+)*n?/.source+"|"+/0[xX][\dA-Fa-f]+(?:_[\dA-Fa-f]+)*n?/.source+"|"+/\d+(?:_\d+)*n/.source+"|"+/(?:\d+(?:_\d+)*(?:\.(?:\d+(?:_\d+)*)?)?|\.\d+(?:_\d+)*)(?:[Ee][+-]?\d+(?:_\d+)*)?/.source)+")"+/(?![\w$])/.source),lookbehind:!0},operator:/--|\+\+|\*\*=?|=>|&&=?|\|\|=?|[!=]==|<<=?|>>>?=?|[-+*/%&|^!=<>]=?|\.{3}|\?\?=?|\?\.?|[~:]/});d.languages.javascript["class-name"][0].pattern=/(\b(?:class|extends|implements|instanceof|interface|new)\s+)[\w.\\]+/;d.languages.insertBefore("javascript","keyword",{regex:{pattern:RegExp(/((?:^|[^$\w\xA0-\uFFFF."'\])\s]|\b(?:return|yield))\s*)/.source+/\//.source+"(?:"+/(?:\[(?:[^\]\\\r\n]|\\.)*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}/.source+"|"+/(?:\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.)*\])*\])*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}v[dgimyus]{0,7}/.source+")"+/(?=(?:\s|\/\*(?:[^*]|\*(?!\/))*\*\/)*(?:$|[\r\n,.;:})\]]|\/\/))/.source),lookbehind:!0,greedy:!0,inside:{"regex-source":{pattern:/^(\/)[\s\S]+(?=\/[a-z]*$)/,lookbehind:!0,alias:"language-regex",inside:d.languages.regex},"regex-delimiter":/^\/|\/$/,"regex-flags":/^[a-z]+$/}},"function-variable":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*[=:]\s*(?:async\s*)?(?:\bfunction\b|(?:\((?:[^()]|\([^()]*\))*\)|(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)\s*=>))/,alias:"function"},parameter:[{pattern:/(function(?:\s+(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)?\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\))/,lookbehind:!0,inside:d.languages.javascript},{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$a-z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*=>)/i,lookbehind:!0,inside:d.languages.javascript},{pattern:/(\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*=>)/,lookbehind:!0,inside:d.languages.javascript},{pattern:/((?:\b|\s|^)(?!(?:as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)(?![$\w\xA0-\uFFFF]))(?:(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*)\(\s*|\]\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*\{)/,lookbehind:!0,inside:d.languages.javascript}],constant:/\b[A-Z](?:[A-Z_]|\dx?)*\b/});d.languages.insertBefore("javascript","string",{hashbang:{pattern:/^#!.*/,greedy:!0,alias:"comment"},"template-string":{pattern:/`(?:\\[\s\S]|\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}|(?!\$\{)[^\\`])*`/,greedy:!0,inside:{"template-punctuation":{pattern:/^`|`$/,alias:"string"},interpolation:{pattern:/((?:^|[^\\])(?:\\{2})*)\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}/,lookbehind:!0,inside:{"interpolation-punctuation":{pattern:/^\$\{|\}$/,alias:"punctuation"},rest:d.languages.javascript}},string:/[\s\S]+/}},"string-property":{pattern:/((?:^|[,{])[ \t]*)(["'])(?:\\(?:\r\n|[\s\S])|(?!\2)[^\\\r\n])*\2(?=\s*:)/m,lookbehind:!0,greedy:!0,alias:"property"}});d.languages.insertBefore("javascript","operator",{"literal-property":{pattern:/((?:^|[,{])[ \t]*)(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*:)/m,lookbehind:!0,alias:"property"}});d.languages.markup&&(d.languages.markup.tag.addInlined("script","javascript"),d.languages.markup.tag.addAttribute(/on(?:abort|blur|change|click|composition(?:end|start|update)|dblclick|error|focus(?:in|out)?|key(?:down|up)|load|mouse(?:down|enter|leave|move|out|over|up)|reset|resize|scroll|select|slotchange|submit|unload|wheel)/.source,"javascript"));d.languages.js=d.languages.javascript;(function(){if(typeof d>"u"||typeof document>"u")return;Element.prototype.matches||(Element.prototype.matches=Element.prototype.msMatchesSelector||Element.prototype.webkitMatchesSelector);var t="Loading\u2026",e=function(T,_){return"\u2716 Error "+T+" while fetching file: "+_},r="\u2716 Error: File does not exist or is empty",a={js:"javascript",py:"python",rb:"ruby",ps1:"powershell",psm1:"powershell",sh:"bash",bat:"batch",h:"c",tex:"latex"},s="data-src-status",c="loading",b="loaded",g="failed",x="pre[data-src]:not(["+s+'="'+b+'"]):not(['+s+'="'+c+'"])';function v(T,_,E){var i=new XMLHttpRequest;i.open("GET",T,!0),i.onreadystatechange=function(){i.readyState==4&&(i.status<400&&i.responseText?_(i.responseText):i.status>=400?E(e(i.status,i.statusText)):E(r))},i.send(null)}function h(T){var _=/^\s*(\d+)\s*(?:(,)\s*(?:(\d+)\s*)?)?$/.exec(T||"");if(_){var E=Number(_[1]),i=_[2],n=_[3];return i?n?[E,Number(n)]:[E,void 0]:[E,E]}}d.hooks.add("before-highlightall",function(T){T.selector+=", "+x}),d.hooks.add("before-sanity-check",function(T){var _=T.element;if(_.matches(x)){T.code="",_.setAttribute(s,c);var E=_.appendChild(document.createElement("CODE"));E.textContent=t;var i=_.getAttribute("data-src"),n=T.language;if(n==="none"){var o=(/\.(\w+)$/.exec(i)||[,"none"])[1];n=a[o]||o}d.util.setLanguage(E,n),d.util.setLanguage(_,n);var u=d.plugins.autoloader;u&&u.loadLanguages(n),v(i,function(l){_.setAttribute(s,b);var p=h(_.getAttribute("data-range"));if(p){var y=l.split(/\r\n?|\n/g),f=p[0],L=p[1]==null?y.length:p[1];f<0&&(f+=y.length),f=Math.max(0,Math.min(f-1,y.length)),L<0&&(L+=y.length),L=Math.max(0,Math.min(L,y.length)),l=y.slice(f,L).join(`
+`),_.hasAttribute("data-start")||_.setAttribute("data-start",String(f+1))}E.textContent=l,d.highlightElement(E)},function(l){_.setAttribute(s,g),E.textContent=l})}}),d.plugins.fileHighlight={highlight:function(_){for(var E=(_||document).querySelectorAll(x),i=0,n;n=E[i++];)d.highlightElement(n)}};var A=!1;d.fileHighlight=function(){A||(console.warn("Prism.fileHighlight is deprecated. Use `Prism.plugins.fileHighlight.highlight` instead."),A=!0),d.plugins.fileHighlight.highlight.apply(this,arguments)}})()});var Or={};Gt(Or,{BUILD_ID:()=>Dr,TempleComponent:()=>P.TempleComponent,TempleElement:()=>P.TempleElement,TempleEmitter:()=>P.TempleEmitter,TempleException:()=>P.TempleException,TempleRegistry:()=>P.TempleRegistry,children:()=>P.children,components:()=>Mr,data:()=>P.data,emitter:()=>P.emitter,props:()=>P.props,signal:()=>P.signal});var $=k(j());var Dt=k(j()),N=k(q()),ee=class extends Dt.TempleComponent{static component=["layout","Layout_9f3ab204ce271feaf6f7"];styles(){return""}template(){(0,N.classlist)().add("relative","w-full","vh","scroll-hidden");let e=(0,N.children)(),r=e.find(h=>h.nodeName.endsWith("PANEL-MAIN")),a=e.find(h=>h.nodeName.endsWith("PANEL-HEAD")),s=e.find(h=>h.nodeName.endsWith("PANEL-FOOT")),c=e.find(h=>h.nodeName.endsWith("PANEL-LEFT")),b=e.find(h=>h.nodeName.endsWith("PANEL-RIGHT")),g={head:!!a,foot:!!s,left:!!c,right:!!b},x=new Set,v={left:!1,right:!1,change:h=>x.add(h)};return r&&N.TempleRegistry.get(r).setAttribute("show",v).setAttribute("layout",g),a&&N.TempleRegistry.get(a).setAttribute("show",v).setAttribute("layout",g),s&&N.TempleRegistry.get(s).setAttribute("show",v).setAttribute("layout",g),c&&N.TempleRegistry.get(c).setAttribute("show",v).setAttribute("layout",g),b&&N.TempleRegistry.get(b).setAttribute("show",v).setAttribute("layout",g),this.toggle=h=>{v[h]=!v[h],x.forEach(A=>A())},()=>[N.TempleRegistry.createText(`
+`,!1),...this._toNodeList(e)]}};var ve=k(j()),qe=k(q()),te=class extends ve.TempleComponent{static component=["head","Head_2bf4dff19bc88ba4138b"];styles(){return""}template(){let{layout:e,show:r}=this.element.attributes,a=(0,qe.classlist)(),s=c=>{this.classList.add("absolute","top-0","right-0","h-60","transition-500"),e?.left?(this.classList.remove("left-0"),this.classList.add("left-226")):this.classList.add("left-0"),r.left?(this.classList.remove("md-left-0"),this.classList.add("md-left-226")):(this.classList.remove("md-left-226"),this.classList.add("md-left-0"))};return r.change(s),s(),()=>[ve.TempleRegistry.createText(`
+`,!1),ve.TempleRegistry.createElement("header",{class:"block w-full h-full relative"},[...this._toNodeList((0,qe.children)())]).element]}};var we=k(j()),Ie=k(q()),re=class extends we.TempleComponent{static component=["left","Left_f4ab589e043eee17d229"];styles(){return""}template(){let{layout:e,show:r}=this.element.attributes,a=(0,Ie.classlist)(),s=c=>{this.classList.add("w-226","absolute","bottom-0","left-0","top-0","transition-500"),r.left?(this.classList.remove("md-left--226"),this.classList.add("md-left-0")):this.classList.add("md-left--226")};return r.change(s),s(),()=>[we.TempleRegistry.createText(`
+`,!1),we.TempleRegistry.createElement("aside",{class:"block w-full h-full relative"},[...this._toNodeList((0,Ie.children)())]).element]}};var Ae=k(j()),He=k(q()),se=class extends Ae.TempleComponent{static component=["right","Right_4ce97029791442c57f8d"];styles(){return""}template(){let{layout:e,show:r}=this.element.attributes,a=(0,He.classlist)(),s=c=>{this.classList.add("w-200","absolute","right-0","transition-500"),e?.foot?(this.classList.remove("bottom-0"),this.classList.add("bottom-60")):this.classList.add("bottom-0"),e?.head?(this.classList.remove("top-0"),this.classList.add("top-60")):this.classList.add("top-0"),r.right?(this.classList.remove("md-right--200"),this.classList.add("md-right-0")):this.classList.add("md-right--200")};return r.change(s),s(),()=>[Ae.TempleRegistry.createText(`
+`,!1),Ae.TempleRegistry.createElement("aside",{class:"block w-full h-full relative"},[...this._toNodeList((0,He.children)())]).element]}};var Te=k(j()),ze=k(q()),ne=class extends Te.TempleComponent{static component=["main","Main_847772763f4518728ede"];styles(){return""}template(){let{layout:e,show:r}=this.element.attributes,a=(0,ze.classlist)(),s=c=>{this.classList.add("absolute","transition-500"),e?.head?(this.classList.remove("top-0"),this.classList.add("top-60")):this.classList.add("top-0"),e?.foot?(this.classList.remove("bottom-0"),this.classList.add("bottom-60")):this.classList.add("bottom-0"),e?.left?(this.classList.remove("left-0"),this.classList.add("left-226")):this.classList.add("left-0"),e?.right?(this.classList.remove("right-0"),this.classList.add("right-200")):this.classList.add("right-0"),r.left?(this.classList.remove("md-left-0"),this.classList.add("md-left-226")):(this.classList.remove("md-left-226"),this.classList.add("md-left-0")),r.right?(this.classList.remove("md-right-0"),this.classList.add("md-right-200")):(this.classList.remove("md-right-200"),this.classList.add("md-right-0"))};return r.change(s),s(),()=>[Te.TempleRegistry.createText(`
+`,!1),Te.TempleRegistry.createElement("main",{class:"block w-full h-full relative"},[...this._toNodeList((0,ze.children)())]).element]}};var Be=k(j()),ae=k(q()),ie=class extends Be.TempleComponent{static component=["alert","Alert_f0fe98801b4b833c4233"];styles(){return""}template(){let{curved:e,rounded:r,pill:a,info:s,warning:c,success:b,error:g,muted:x,primary:v,color:h,secondary:A,outline:T,transparent:_,solid:E,style:i,class:n,...o}=(0,ae.props)(),u=(0,ae.component)(),l=document.createElement("div");(0,ae.children)().forEach(y=>l.appendChild(y)),u.classList.add("block"),l.classList.add("block","p-16"),e?l.classList.add("curved"):r?l.classList.add("rounded"):a&&l.classList.add("pill");let p=T?"outline":_?"transparent":"solid";return p==="outline"||p==="transparent"?(l.classList.add("bd-solid","bd-thin"),p==="outline"&&l.classList.add("bg-white"),h?(l.style.color=h,l.style.borderColor=h):s?l.classList.add("bd-info","tx-info"):c?l.classList.add("bd-warning","tx-warning"):b?l.classList.add("bd-success","tx-success"):g?l.classList.add("bd-error","tx-error"):x?l.classList.add("bd-muted","tx-muted"):v?l.classList.add("bd-primary","tx-primary"):A&&l.classList.add("bd-secondary","tx-secondary")):(l.classList.add("tx-white"),h?l.style.backgroundColor=h:s?l.classList.add("bg-info"):c?l.classList.add("bg-warning"):b?l.classList.add("bg-success"):g?l.classList.add("bg-error"):x?l.classList.add("bg-muted"):v?l.classList.add("bg-primary"):A&&l.classList.add("bg-secondary")),()=>[Be.TempleRegistry.createText(`
+`,!1),...this._toNodeList([l])]}};var Ee=k(j()),We=k(q()),le=class extends Ee.TempleComponent{static component=["docs","Docs_40562a7bb56d70d971df"];styles(){return""}template(){return(0,We.classlist)().add("block","w-full","h-full","scroll-y-auto","scroll-x-hidden"),()=>[Ee.TempleRegistry.createText(`
+`,!1),Ee.TempleRegistry.createElement("article",{class:"block p-10 tx-t-1"},[...this._toNodeList((0,We.children)())]).element]}};var F=k(j()),Ue=k(q()),oe=class extends F.TempleComponent{static component=["app","App_381239c61b65b86a1c20"];styles(){return""}template(){let{title:e,height:r}=(0,Ue.props)(),a=r?`height:${r}px`:"";return()=>[F.TempleRegistry.createText(`
+`,!1),F.TempleRegistry.createElement("div",{class:"bd-rad-curved scroll-hidden shadow-0-0-10-0-0-0-5"},[F.TempleRegistry.createText(`
+  `,!1),F.TempleRegistry.createElement("div",{class:"relative flex flex-center-y gap-10 p-10 bg-t-1 tx-c-999999 tx-16"},[F.TempleRegistry.createText(`
+    `,!1),F.TempleRegistry.createElement("span",{class:"bg-h-999999 pill h-10 w-10"},[]).element,F.TempleRegistry.createText(`
+    `,!1),F.TempleRegistry.createElement("span",{class:"bg-h-999999 pill h-10 w-10"},[]).element,F.TempleRegistry.createText(`
+    `,!1),F.TempleRegistry.createElement("span",{class:"bg-h-999999 pill h-10 w-10"},[]).element,F.TempleRegistry.createText(`
+    `,!1),F.TempleRegistry.createElement("span",{class:"flex flex-center h-full w-full absolute top-0 left-0"},[F.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(e),F.TempleRegistry.createText(`
+    `,!1)]).element,F.TempleRegistry.createText(`
+  `,!1)]).element,F.TempleRegistry.createText(`
+  `,!1),F.TempleRegistry.createElement("div",{class:"bg-black tx-t-1 relative",style:a},[...this._toNodeList((0,Ue.children)())]).element,F.TempleRegistry.createText(`
+`,!1)]).element]}};var w=k(j()),lt=k(Ot()),jt=k(q()),ue=class extends w.TempleComponent{static component=["code","Code_5294df1c620ef5ddbd2f"];styles(){return`:host {
     display: block;
     font-size: 14px;
     line-height: 20px;
   }
   :host([inline]) {
-    display: inline;
+    display: inline !important;
   }
   :host([inline]),
   :host([inline]) > pre,
   :host([inline]) > pre > code {
-    display: inline;
+    display: inline !important;
   }
   .snippet {
     background-color: #000000;
     color: #ABB2BF;
+    height: 100%;
     margin: 0;
     padding: 0;
   }
@@ -73,154 +92,38 @@ var TempleAPI=(()=>{var At=Object.create;var he=Object.defineProperty;var Tt=Obj
 
   .terminal {
     background-color: #000000;
+    font-family: 'Courier New', Courier, monospace;
     font-size: 15px;
+    height: 100%;
     padding: 10px;
   }
   .terminal span {
     color: #00FF00;
-  }`}template(){let e=this.props,{lang:r="markup",numbers:a=!1,inline:i=!1,trim:p=!1,ltrim:h=!1,rtrim:g=!1,detab:v=0}=e,T=(0,_t.children)(),y=T[0]?.textContent||"";v&&(y=y.replace(new RegExp(`\\n {${v}}`,"g"),`
-`)),p?y=y.trim():h?y=y.replace(/^\s+/,""):g&&(y=y.replace(/\s+$/,""));let E=w=>{if(!y)return;let _=Ne.default.highlight(y,Ne.default.languages[r],r);if(w.detail.target.innerHTML=_,a){let x=_.match(/\n(?!$)/g),n=x?x.length+1:1,s=new Array(n+1).join(""),l=document.createElement("span");l.setAttribute("aria-hidden","true"),l.className="line-numbers-rows",l.innerHTML=s,w.detail.target.appendChild(l)}};return()=>[A.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism.min.css"}).element,A.TempleRegistry.createText(`
-`,!1),A.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism-tomorrow.min.css"}).element,A.TempleRegistry.createText(`
-`,!1),...r==="bash"?[A.TempleRegistry.createText(`
-  `,!1),A.TempleRegistry.createElement("div",{class:"terminal"},[A.TempleRegistry.createElement("span",{},[A.TempleRegistry.createText("$",!1)]).element,A.TempleRegistry.createText(" ",!1),...this._toNodeList(T)]).element,A.TempleRegistry.createText(`
-`,!1)]:y?[,A.TempleRegistry.createText(`
-  `,!1),...a?[A.TempleRegistry.createText(`
-    `,!1),A.TempleRegistry.createElement("pre",{class:"snippet line-numbers"},[A.TempleRegistry.createElement("code",{mount:E},[]).element]).element,A.TempleRegistry.createText(`
-  `,!1)]:[,A.TempleRegistry.createText(`
-    `,!1),A.TempleRegistry.createElement("pre",{class:"snippet pad"},[A.TempleRegistry.createElement("code",{mount:E},[]).element]).element,A.TempleRegistry.createText(`
-  `,!1)],A.TempleRegistry.createText(`
-`,!1)]:[]]}};var S=D(I()),Ee=D(ce()),V=class extends S.TempleComponent{static component=["app","App_05341fddbfd1fe4f273b"];styles(){return""}template(){let{title:e,panel:r}=(0,Ee.props)(),a=`body ${r?"panel":""}`,i=r?`height:${r}px`:"";return()=>[S.TempleRegistry.createText(`
-`,!1),S.TempleRegistry.createElement("div",{class:"window"},[S.TempleRegistry.createText(`
-  `,!1),S.TempleRegistry.createElement("div",{class:"head"},[S.TempleRegistry.createText(`
-    `,!1),S.TempleRegistry.createElement("span",{class:"dot"},[]).element,S.TempleRegistry.createText(`
-    `,!1),S.TempleRegistry.createElement("span",{class:"dot"},[]).element,S.TempleRegistry.createText(`
-    `,!1),S.TempleRegistry.createElement("span",{class:"dot"},[]).element,S.TempleRegistry.createText(`
-    `,!1),S.TempleRegistry.createElement("span",{class:"title"},[...this._toNodeList(e)]).element,S.TempleRegistry.createText(`
-  `,!1)]).element,S.TempleRegistry.createText(`
-  `,!1),S.TempleRegistry.createElement("div",{class:a,style:i},[...this._toNodeList((0,Ee.children)())]).element,S.TempleRegistry.createText(`
-`,!1)]).element]}};var z=D(I()),Y=D(ce()),X=class extends z.TempleComponent{static component=["alert","Alert_6b81bcb0566ce7f0cd2d"];styles(){return`:host {
-    --black: #222222;
-    --white: #FCFCFC;
-    --info: #1474FC;
-    --error: #DC3545;
-    --warning: #FF7B07;
-    --success: #28A745;
-    --muted: #999999;
-    --primary: #E49F1A;
-    --secondary: #DA532C;
-  }
-
-  /* Text Colors
-  ---------------------------------*/
-  .tx-white, .tx-white a {
-    color: var(--info);
-  }
-  .tx-white, .tx-white a {
-    color: var(--white);
-  }
-  .tx-error, .tx-error a {
-    color: var(--error);
-  }
-  .tx-warning, .tx-warning a {
-    color: var(--warning);
-  }
-  .tx-success, .tx-success a {
-    color: var(--success);
-  }
-  .tx-muted, .tx-muted a {
-    color: var(--muted);
-  }
-  .tx-primary, .tx-primary a {
-    color: var(--primary);
-  }
-  .tx-secondary, .tx-secondary a {
-    color: var(--secondary);
-  }
-
-  /* Borders
-  ---------------------------------*/
-  .curved {
-    border-radius: 5px;
-  }
-  .rounded {
-    border-radius:12px;
-  }
-  .pill {
-    border-radius: 10000px;
-  }
-  .solid {
-    border-style: solid;
-  }
-  .thin {
-    border-width: 1px;
-  }
-
-  .bd-info {
-    border-color: var(--info);
-  }
-  .bd-error {
-    border-color: var(--error);
-  }
-  .bd-warning {
-    border-color: var(--warning);
-  }
-  .bd-success {
-    border-color: var(--success);
-  }
-  .bd-muted {
-    border-color: var(--muted);
-  }
-  .bd-primary {
-    border-color: var(--primary);
-  }
-  .bd-secondary {
-    border-color: var(--secondary);
-  }
-
-  /* Backgrounds
-  ---------------------------------*/
-  .bg-white {
-    background-color: var(--white);
-  }
-  .bg-info {
-    background-color: var(--info);
-  }
-  .bg-error {
-    background-color: var(--error);
-  }
-  .bg-warning {
-    background-color: var(--warning);
-  }
-  .bg-success {
-    background-color: var(--success);
-  }
-  .bg-muted {
-    background-color: var(--muted);
-  }
-  .bg-primary {
-    background-color: var(--primary);
-  }
-  .bg-secondary {
-    background-color: var(--secondary);
-  }
+  }`}template(){let e=this.props,{lang:r="markup",numbers:a=!1,inline:s=!1,trim:c=!1,ltrim:b=!1,rtrim:g=!1,detab:x=0}=e,v=(0,jt.children)(),h=v[0]?.textContent||"";x&&(h=h.replace(new RegExp(`\\n {${x}}`,"g"),`
+`)),c?h=h.trim():b?h=h.replace(/^\s+/,""):g&&(h=h.replace(/\s+$/,""));let A=T=>{if(!h)return;let _=lt.default.highlight(h,lt.default.languages[r],r);if(T.detail.target.innerHTML=_,a){let E=_.match(/\n(?!$)/g),i=E?E.length+1:1,n=new Array(i+1).join(""),o=document.createElement("span");o.setAttribute("aria-hidden","true"),o.className="line-numbers-rows",o.innerHTML=n,T.detail.target.appendChild(o)}};return()=>[w.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism.min.css"}).element,w.TempleRegistry.createText(`
+`,!1),w.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism-tomorrow.min.css"}).element,w.TempleRegistry.createText(`
+`,!1),...r==="bash"?[w.TempleRegistry.createText(`
+  `,!1),w.TempleRegistry.createElement("div",{class:"terminal"},[w.TempleRegistry.createElement("span",{},[w.TempleRegistry.createText("$",!1)]).element,w.TempleRegistry.createText(" ",!1),...this._toNodeList(v)]).element,w.TempleRegistry.createText(`
+`,!1)]:h?[,w.TempleRegistry.createText(`
+  `,!1),...a?[w.TempleRegistry.createText(`
+    `,!1),w.TempleRegistry.createElement("pre",{class:"snippet line-numbers"},[w.TempleRegistry.createElement("code",{mount:A},[]).element]).element,w.TempleRegistry.createText(`
+  `,!1)]:[,w.TempleRegistry.createText(`
+    `,!1),w.TempleRegistry.createElement("pre",{class:"snippet pad"},[w.TempleRegistry.createElement("code",{mount:A},[]).element]).element,w.TempleRegistry.createText(`
+  `,!1)],w.TempleRegistry.createText(`
+`,!1)]:[,w.TempleRegistry.createText(`
+  `,!1),w.TempleRegistry.createElement("span",{},[w.TempleRegistry.createText("????",!1)]).element,w.TempleRegistry.createText(`
+`,!1)],w.TempleRegistry.createText(`
 
-  /* Alert
-  ---------------------------------*/
-  .alert {
-    padding: 16px;
-  }`}template(){let{color:e,info:r,warning:a,success:i,error:p,muted:h,primary:g,secondary:v,solid:T,outline:y,curved:E,rounded:w,pill:_,style:x}=(0,Y.props)(),n={classes:["alert"],styles:""},s=y?"outline":"solid";E?n.classes.push("curved"):w?n.classes.push("rounded"):_&&n.classes.push("pill"),s==="outline"?(n.classes.push("solid","thin"),e?(n.styles+=`border-color: ${e};`,n.styles+=`color: ${e};`):r?n.classes.push("bd-info","tx-info"):a?n.classes.push("bd-warning","tx-warning"):i?n.classes.push("bd-success","tx-success"):p?n.classes.push("bd-error","tx-error"):h?n.classes.push("bd-muted","tx-muted"):g?n.classes.push("bd-primary","tx-primary"):v&&n.classes.push("bd-secondary","tx-secondary")):(n.classes.push("tx-white"),e?n.styles+=`background-color: ${e};`:r?n.classes.push("bg-info"):a?n.classes.push("bg-warning"):i?n.classes.push("bg-success"):p?n.classes.push("bg-error"):h?n.classes.push("bg-muted"):g?n.classes.push("bg-primary"):v&&n.classes.push("bg-secondary"));let l={classes:[...n.classes,(0,Y.classnames)()].join(" "),styles:{...n.styles,...x}};return()=>[z.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/fontawesome/all.css"}).element,z.TempleRegistry.createText(`
-`,!1),z.TempleRegistry.createElement("div",{class:l.classes,style:l.styles},[z.TempleRegistry.createText(`
-  `,!1),...this._toNodeList((0,Y.children)()),z.TempleRegistry.createText(`
-`,!1)]).element]}};var O=D(I());var He=function(t,...e){let r=Be(t);for(let a=0;a[O.TempleRegistry.createText(`
+`,!1)]}};var O=k(j());var $t=function(t){return t};var Ze=k(q()),ce=class extends O.TempleComponent{static component=["translate","Translate_0014b007fc91289b2776"];styles(){return""}template(){let{trim:e=!1,p:r=!1,li:a=!1,div:s=!1}=(0,Ze.props)(),c=(0,Ze.children)(),b=[],g=[];for(let A of c)typeof A=="string"?b.push(A):A instanceof Node&&A.textContent?b.push(A.textContent):(b.push("%s"),g.push(A));let x=b.join("");e&&(x=x.replace(/\s+/," ").trim());let v=$t(x).split("%s"),h=[];for(let A=0;A[O.TempleRegistry.createText(`
     `,!1),...r?[O.TempleRegistry.createText(`
-      `,!1),O.TempleRegistry.createElement("p",{},[...this._toNodeList(y)]).element,O.TempleRegistry.createText(`
+      `,!1),O.TempleRegistry.createElement("p",{},[...this._toNodeList(h)]).element,O.TempleRegistry.createText(`
     `,!1)]:a?[,O.TempleRegistry.createText(`
-      `,!1),O.TempleRegistry.createElement("li",{},[...this._toNodeList(y)]).element,O.TempleRegistry.createText(`
-    `,!1)]:i?[,O.TempleRegistry.createText(`
-      `,!1),O.TempleRegistry.createElement("div",{},[...this._toNodeList(y)]).element,O.TempleRegistry.createText(`
+      `,!1),O.TempleRegistry.createElement("li",{},[...this._toNodeList(h)]).element,O.TempleRegistry.createText(`
+    `,!1)]:s?[,O.TempleRegistry.createText(`
+      `,!1),O.TempleRegistry.createElement("div",{},[...this._toNodeList(h)]).element,O.TempleRegistry.createText(`
     `,!1)]:[,O.TempleRegistry.createText(`
-      `,!1),...this._toNodeList(y),O.TempleRegistry.createText(`
-    `,!1)]]}};var k=D(I());j.emitter.once("ready",()=>{let t=document.querySelector("script[data-app]");if(!t)throw j.TempleException.for("APP_DATA not found");try{let h=atob(t.getAttribute("data-app"));window.__APP_DATA__=JSON.parse(h),Object.entries(window.__APP_DATA__).forEach(([g,v])=>{j.data.set(g,v)})}catch{throw j.TempleException.for("APP_DATA is not a valid JSON")}j.data.set("current","document");let e="/docs/markup-syntax.html",r=He("Markup Syntax - Temple reactive web component template engine."),a=He("Learn how to write markup in Temple."),i=h=>{document.body.classList.toggle("panel-left-open")};j.data.delete("current");let p={0:{class:"head panel-head"},1:{class:"menu fas fa-fw fa-bars",click:i},2:{href:"/temple"},3:{src:"/temple/temple-icon.png",alt:"Temple Logo"},5:{class:"tx-white",href:"/temple"},7:{class:"tx-white",href:"/temple/docs/index.html"},8:{class:"github",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},9:{class:"fab fa-github"},10:{class:"npm",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},11:{class:"fab fa-npm text-white"},12:{class:"discord",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},13:{class:"fab fa-discord text-white"},14:{class:"left panel-left"},16:{href:"/temple"},17:{src:"/temple/temple-icon.png",alt:"Temple Logo"},19:{class:"tx-white",href:"/temple"},20:{class:"toggle fas fa-fw fa-chevron-left",click:i},23:{href:"/temple/docs/index.html"},24:{href:"/temple/docs/getting-started.html"},26:{href:"/temple/docs/markup-syntax.html"},27:{href:"/temple/docs/state-management.html"},28:{href:"/temple/docs/component-strategy.html"},29:{href:"/temple/docs/compiler-api.html"},30:{href:"/temple/docs/client-api.html"},32:{href:"/temple/docs/template-engine.html"},33:{href:"/temple/docs/single-page.html"},34:{href:"/temple/docs/static-site.html"},35:{href:"/temple/docs/component-publisher.html"},36:{href:"/temple/docs/developer-tools.html"},37:{class:"panel-right right"},40:{href:"#imports"},41:{href:"#styles"},42:{href:"#scripts"},43:{href:"#markup"},45:{href:"#tagnames"},46:{href:"#attributes"},47:{href:"#conditionals"},48:{href:"#iterations"},49:{href:"#trycatch"},50:{class:"panel-main"},51:{class:"docs container"},53:{p:!0,trim:!0},54:{inline:!0},55:{inline:!0},56:{p:!0,trim:!0},57:{title:"Code Structure"},58:{numbers:!0,detab:12},59:{name:"imports"},61:{p:!0,trim:!0},62:{inline:!0},63:{inline:!0},64:{title:"Import Examples"},65:{numbers:!0,trim:!0,detab:12},66:{p:!0,trim:!0},67:{inline:!0},68:{inline:!0},69:{p:!0,trim:!0},70:{inline:!0},71:{inline:!0},72:{inline:!0},73:{p:!0,trim:!0},74:{inline:!0},75:{inline:!0},76:{name:"styles"},78:{p:!0,trim:!0},79:{inline:!0},80:{target:"_blank",href:"https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_shadow_DOM"},81:{p:!0,trim:!0},82:{inline:!0},83:{inline:!0},84:{p:!0,trim:!0},85:{inline:!0},86:{title:"Using :host"},87:{numbers:!0,trim:!0,detab:12},88:{p:!0,trim:!0},89:{inline:!0},90:{title:":host Conditionals"},91:{numbers:!0,trim:!0,detab:12},92:{name:"scripts"},94:{p:!0,trim:!0},95:{inline:!0},96:{title:"Top-Level Variables"},97:{numbers:!0,trim:!0,detab:12},98:{p:!0,trim:!0},99:{inline:!0},100:{title:"Importing Files"},101:{numbers:!0,trim:!0,detab:12},102:{p:!0,trim:!0},103:{inline:!0},104:{title:"@ Imports"},105:{numbers:!0,trim:!0,detab:12},106:{name:"markup"},108:{p:!0,trim:!0},109:{name:"tagnames"},111:{p:!0,trim:!0},112:{inline:!0},114:{li:!0,trim:!0},115:{li:!0,trim:!0},116:{li:!0,trim:!0},117:{inline:!0},118:{inline:!0},119:{inline:!0},120:{inline:!0},121:{inline:!0},122:{inline:!0},123:{inline:!0},124:{inline:!0},125:{li:!0,trim:!0},126:{li:!0,trim:!0},127:{li:!0,trim:!0},128:{p:!0,trim:!0},130:{li:!0,trim:!0},131:{inline:!0},132:{inline:!0},133:{inline:!0},134:{inline:!0},135:{li:!0,trim:!0},136:{inline:!0},137:{inline:!0},138:{inline:!0},139:{li:!0,trim:!0},140:{inline:!0},141:{inline:!0},142:{inline:!0},143:{solid:!0,curved:!0,secondary:!0},144:{class:"fas fa-exclamation-triangle"},146:{p:!0,trim:!0},147:{inline:!0},148:{inline:!0},149:{name:"attributes"},151:{title:"Markup Expressions"},152:{numbers:!0,trim:!0,detab:12},153:{p:!0,trim:!0},154:{inline:!0},155:{trim:!0,detab:10},156:{p:!0,trim:!0},157:{inline:!0},158:{trim:!0,detab:10},159:{p:!0,trim:!0},160:{trim:!0,detab:10},161:{p:!0,trim:!0},162:{inline:!0},163:{trim:!0,detab:10},164:{p:!0,trim:!0},165:{inline:!0},166:{trim:!0,detab:10},167:{p:!0,trim:!0},168:{numbers:!0,trim:!0,detab:10},169:{p:!0,trim:!0},170:{name:"conditionals"},172:{title:"Conditionals"},173:{numbers:!0,trim:!0,detab:12},174:{p:!0,trim:!0},175:{numbers:!0,trim:!0,detab:12},176:{p:!0,trim:!0},177:{inline:!0},178:{inline:!0},179:{numbers:!0,trim:!0,detab:12},180:{p:!0,trim:!0},181:{inline:!0},182:{numbers:!0,trim:!0,detab:12},183:{p:!0,trim:!0},184:{inline:!0},185:{numbers:!0,trim:!0,detab:12},186:{p:!0,trim:!0},187:{inline:!0},188:{name:"iterations"},190:{title:"Each"},191:{numbers:!0,trim:!0,detab:12},192:{p:!0,trim:!0},193:{inline:!0},194:{inline:!0},195:{inline:!0},196:{inline:!0},197:{numbers:!0,trim:!0,detab:12},198:{p:!0,trim:!0},199:{inline:!0},200:{inline:!0},201:{numbers:!0,trim:!0,detab:12},202:{p:!0,trim:!0},203:{inline:!0},204:{inline:!0},205:{name:"trycatch"},207:{title:"Try/Catch Example"},208:{numbers:!0,trim:!0,detab:12},209:{p:!0,trim:!0},210:{inline:!0},211:{inline:!0},212:{inline:!0},213:{inline:!0},214:{inline:!0},215:{lang:"js",inline:!0},216:{class:"pager"},217:{class:"prev",href:"/temple/docs/getting-started.html"},218:{class:"fas fa-fw fa-chevron-left"},219:{class:"next",href:"/temple/docs/state-management.html"},220:{class:"fas fa-fw fa-chevron-right"},221:{class:"foot"}};for(let h of document.body.querySelectorAll("*")){let g=Object.fromEntries(Array.from(h.attributes).map(T=>[T.nodeName,T.nodeValue.length>0?T.nodeValue:!0])),v=String(j.TempleRegistry.elements.size);p[v]&&(Object.assign(g,p[v]),h.TempleAttributes=p[v]),j.TempleRegistry.register(h,g)}customElements.define("panel-main",Z),customElements.define("ide-code",J),customElements.define("ide-app",V),customElements.define("tui-alert",X),customElements.define("i18n-translate",K),j.emitter.emit("mounted",document.body)});var ir={PanelMain_fd7f1af6410c5b5c8e1f:Z,IdeCode_6f36bc13bb6a166c7abc:J,IdeApp_05341fddbfd1fe4f273b:V,TuiAlert_6b81bcb0566ce7f0cd2d:X,I18nTranslate_7d25e372f5ffb5e39dad:K},sr="57e37fa233b38c87fe71";return Pt(ar);})();
+      `,!1),...this._toNodeList(h),O.TempleRegistry.createText(`
+    `,!1)]]}};var ot=function(t,...e){let r=Cr(t);for(let a=0;a{let t=document.querySelector("script[data-app]");if(!t)throw $.TempleException.for("APP_DATA not found");try{let b=atob(t.getAttribute("data-app"));window.__APP_DATA__=JSON.parse(b),Object.entries(window.__APP_DATA__).forEach(([g,x])=>{$.data.set(g,x)})}catch{throw $.TempleException.for("APP_DATA is not a valid JSON")}$.data.set("current","document");let e="/docs/markup-syntax.html",r=ot("Markup Syntax - Temple reactive web component template engine."),a=ot("Learn how to write markup in Temple."),s=()=>{document.getElementsByTagName("panel-layout")[0].toggle("left")};$.data.delete("current");let c={2:{class:"flex flex-center-y px-20 py-15 m-0 bg-t-1"},3:{class:"fas fa-fw fa-bars cursor-pointer py-5 pr-10 none md-inline-block tx-t-1",click:s},4:{class:"flex-grow"},5:{class:"flex flex-center-y"},6:{class:"tx-white",href:"/temple/docs/index.html"},7:{class:"tx-t-1 tx-5xl ml-10",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},8:{class:"fab fa-github"},9:{class:"bg-h-cb3837 pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},10:{class:"fab fa-npm text-white"},11:{class:"bg-h-7289da pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},12:{class:"fab fa-discord text-white"},14:{class:"flex flex-center-y bg-t-2 py-15 pr-5 pl-10"},15:{href:"/temple"},16:{class:"h-26 mr-10",src:"/temple/temple-icon.png",alt:"Temple Logo"},17:{class:"flex-grow m-0 tx-uppercase"},18:{class:"tx-white",href:"/temple"},19:{class:"fas fa-fw fa-chevron-left cursor-pointer none md-inline-block",click:s},20:{class:"bg-t-1 scroll-auto h-calc-full-60"},21:{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-0 pt-20 pb-10 pl-10 tx-uppercase"},22:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/index.html"},23:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/getting-started.html"},24:{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},25:{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/markup-syntax.html"},26:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/state-management.html"},27:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-strategy.html"},28:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/compiler-api.html"},29:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/client-api.html"},30:{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},31:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/template-engine.html"},32:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/single-page.html"},33:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/static-site.html"},34:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-publisher.html"},35:{class:"block tx-t-1 py-10 pl-10 mb-100",href:"/temple/docs/developer-tools.html"},37:{class:"m-0 px-10 py-20 h-calc-full-40 bg-t-2 scroll-auto"},38:{class:"tx-muted tx-14 mb-0 mt-0 pb-10 tx-uppercase"},39:{class:"tx-14 tx-lh-32"},40:{class:"block tx-t-0",href:"#imports"},41:{class:"block tx-t-0",href:"#styles"},42:{class:"block tx-t-0",href:"#scripts"},43:{class:"block tx-t-0",href:"#markup"},44:{class:"pl-20"},45:{class:"block tx-t-1",href:"#tagnames"},46:{class:"block tx-t-1",href:"#attributes"},47:{class:"block tx-t-1",href:"#conditionals"},48:{class:"block tx-t-1",href:"#iterations"},49:{class:"block tx-t-1",href:"#trycatch"},52:{class:"tx-primary tx-uppercase tx-30 py-20"},53:{p:!0,trim:!0,class:"tx-lh-36 py-20"},54:{inline:!0},55:{inline:!0},56:{p:!0,trim:!0,class:"tx-lh-36 py-20"},57:{title:"Code Structure",class:"py-20"},58:{numbers:!0,detab:14},59:{name:"imports"},60:{class:"tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0"},61:{p:!0,trim:!0,class:"tx-lh-36 py-20"},62:{inline:!0},63:{inline:!0},64:{title:"Import Examples",class:"py-20"},65:{class:"scroll-auto",numbers:!0,trim:!0,detab:14},66:{p:!0,trim:!0,class:"tx-lh-36 py-20"},67:{inline:!0},68:{inline:!0},69:{p:!0,trim:!0,class:"tx-lh-36 py-20"},70:{inline:!0},71:{inline:!0},72:{inline:!0},73:{p:!0,trim:!0,class:"tx-lh-36 py-20"},74:{inline:!0},75:{inline:!0},76:{name:"styles"},77:{class:"tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0"},78:{p:!0,trim:!0,class:"tx-lh-36 py-20"},79:{inline:!0},80:{target:"_blank",href:"https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_shadow_DOM"},81:{p:!0,trim:!0,class:"tx-lh-36 py-20"},82:{inline:!0},83:{inline:!0},84:{p:!0,trim:!0,class:"tx-lh-36 py-20"},85:{inline:!0},86:{title:"Using :host",class:"py-20"},87:{numbers:!0,trim:!0,detab:14},88:{p:!0,trim:!0,class:"tx-lh-36 py-20"},89:{inline:!0},90:{title:":host Conditionals",class:"py-20"},91:{numbers:!0,trim:!0,detab:14},92:{name:"scripts"},93:{class:"tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0"},94:{p:!0,trim:!0,class:"tx-lh-36 py-20"},95:{inline:!0},96:{title:"Top-Level Variables",class:"py-20"},97:{numbers:!0,trim:!0,detab:14},98:{p:!0,trim:!0,class:"tx-lh-36 py-20"},99:{inline:!0},100:{title:"Importing Files",class:"py-20"},101:{class:"scroll-auto",numbers:!0,trim:!0,detab:14},102:{p:!0,trim:!0,class:"tx-lh-36 py-20"},103:{inline:!0},104:{title:"@ Imports",class:"py-20"},105:{class:"scroll-auto",numbers:!0,trim:!0,detab:14},106:{name:"markup"},107:{class:"tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0"},108:{p:!0,trim:!0,class:"tx-lh-36 py-20"},109:{name:"tagnames"},110:{class:"tx-t-1 tx-uppercase tx-22 pt-40 pb-20"},111:{p:!0,trim:!0,class:"tx-lh-36 py-20"},112:{inline:!0},114:{li:!0,trim:!0,class:"my-10 tx-lh-24"},115:{li:!0,trim:!0,class:"my-10 tx-lh-24"},116:{li:!0,trim:!0,class:"my-10 tx-lh-24"},117:{inline:!0},118:{inline:!0},119:{inline:!0},120:{inline:!0},121:{inline:!0},122:{inline:!0},123:{inline:!0},124:{inline:!0},125:{li:!0,trim:!0,class:"my-10 tx-lh-24"},126:{li:!0,trim:!0,class:"my-10 tx-lh-24"},127:{li:!0,trim:!0,class:"my-10 tx-lh-24"},128:{p:!0,trim:!0,class:"tx-lh-36 py-20"},130:{li:!0,trim:!0,class:"my-10 tx-lh-24"},131:{inline:!0},132:{inline:!0},133:{inline:!0},134:{inline:!0},135:{li:!0,trim:!0,class:"my-10 tx-lh-24"},136:{inline:!0},137:{inline:!0},138:{inline:!0},139:{li:!0,trim:!0,class:"my-10 tx-lh-24"},140:{inline:!0},141:{inline:!0},142:{inline:!0},143:{solid:!0,curved:!0,secondary:!0,class:"py-20 tx-lh-24"},144:{class:"fas fa-exclamation-triangle"},146:{p:!0,trim:!0,class:"tx-lh-36 py-20"},147:{inline:!0},148:{inline:!0},149:{name:"attributes"},150:{class:"tx-t-1 tx-uppercase tx-22 pt-40 pb-20"},151:{title:"Markup Expressions"},152:{class:"scroll-auto",numbers:!0,trim:!0,detab:14},153:{p:!0,trim:!0,class:"tx-lh-36 py-20"},154:{inline:!0},155:{class:"scroll-auto bg-black"},156:{trim:!0},157:{p:!0,trim:!0,class:"tx-lh-36 py-20"},158:{inline:!0},159:{trim:!0},160:{p:!0,trim:!0,class:"tx-lh-36 py-20"},161:{trim:!0},162:{p:!0,trim:!0,class:"tx-lh-36 py-20"},163:{inline:!0},164:{trim:!0},165:{p:!0,trim:!0,class:"tx-lh-36 py-20"},166:{inline:!0},167:{class:"scroll-auto bg-black"},168:{trim:!0,detab:14},169:{p:!0,trim:!0,class:"tx-lh-36 py-20"},170:{class:"scroll-auto bg-black"},171:{numbers:!0,trim:!0,detab:14},172:{p:!0,trim:!0,class:"tx-lh-36 py-20"},173:{name:"conditionals"},174:{class:"tx-t-1 tx-uppercase tx-22 pt-40 pb-20"},175:{title:"Conditionals",class:"py-20"},176:{class:"scroll-auto",numbers:!0,trim:!0,detab:14},177:{p:!0,trim:!0,class:"tx-lh-36 py-20"},178:{class:"scroll-auto bg-black"},179:{numbers:!0,trim:!0,detab:14},180:{p:!0,trim:!0,class:"tx-lh-36 py-20"},181:{inline:!0},182:{inline:!0},183:{class:"scroll-auto bg-black"},184:{numbers:!0,trim:!0,detab:14},185:{p:!0,trim:!0,class:"tx-lh-36 py-20"},186:{inline:!0},187:{class:"scroll-auto bg-black"},188:{numbers:!0,trim:!0,detab:14},189:{p:!0,trim:!0,class:"tx-lh-36 py-20"},190:{inline:!0},191:{numbers:!0,trim:!0,detab:12},192:{p:!0,trim:!0,class:"tx-lh-36 py-20"},193:{inline:!0},194:{name:"iterations"},195:{class:"tx-t-1 tx-uppercase tx-22 pt-40 pb-20"},196:{title:"Each",class:"py-20"},197:{class:"scroll-auto",numbers:!0,trim:!0,detab:14},198:{p:!0,trim:!0,class:"tx-lh-36 py-20"},199:{inline:!0},200:{inline:!0},201:{inline:!0},202:{inline:!0},203:{class:"scroll-auto bg-black"},204:{numbers:!0,trim:!0,detab:14},205:{p:!0,trim:!0,class:"tx-lh-36 py-20"},206:{inline:!0},207:{inline:!0},208:{numbers:!0,trim:!0,detab:12},209:{p:!0,trim:!0,class:"tx-lh-36 py-20"},210:{inline:!0},211:{inline:!0},212:{name:"trycatch"},213:{class:"tx-t-1 tx-uppercase tx-22 pt-40 pb-20"},214:{title:"Try/Catch Example",class:"py-20"},215:{numbers:!0,trim:!0,detab:14},216:{p:!0,trim:!0,class:"tx-lh-36 py-20"},217:{inline:!0},218:{inline:!0},219:{inline:!0},220:{inline:!0},221:{inline:!0},222:{lang:"js",inline:!0},223:{class:"flex"},224:{class:"tx-primary py-40",href:"/temple/docs/getting-started.html"},225:{class:"fas fa-fw fa-chevron-left tx-t-1"},226:{class:"flex-grow tx-right tx-primary py-40",href:"/temple/docs/state-management.html"},227:{class:"fas fa-fw fa-chevron-right tx-t-1"},228:{class:"foot"}};for(let b of document.body.querySelectorAll("*")){let g=Object.fromEntries(Array.from(b.attributes).map(v=>[v.nodeName,v.nodeValue.length>0?v.nodeValue:!0])),x=String($.TempleRegistry.elements.size);c[x]&&(Object.assign(g,c[x]),b.TempleAttributes=c[x]),$.TempleRegistry.register(b,g)}customElements.define("panel-layout",ee),customElements.define("panel-head",te),customElements.define("panel-left",re),customElements.define("panel-right",se),customElements.define("panel-main",ne),customElements.define("tui-alert",ie),customElements.define("api-docs",le),customElements.define("ide-app",oe),customElements.define("ide-code",ue),customElements.define("i18n-translate",ce),$.emitter.emit("mounted",document.body)});var Mr={PanelLayout_9f3ab204ce271feaf6f7:ee,PanelHead_2bf4dff19bc88ba4138b:te,PanelLeft_f4ab589e043eee17d229:re,PanelRight_4ce97029791442c57f8d:se,PanelMain_847772763f4518728ede:ne,TuiAlert_f0fe98801b4b833c4233:ie,ApiDocs_40562a7bb56d70d971df:le,IdeApp_381239c61b65b86a1c20:oe,IdeCode_5294df1c620ef5ddbd2f:ue,I18nTranslate_0014b007fc91289b2776:ce},Dr="57e37fa233b38c87fe71";return Zt(Or);})();
 /*! Bundled license information:
 
 prismjs/prism.js:
diff --git a/docs/build/client/75ff7698b5db04ad540c.css b/docs/build/client/75ff7698b5db04ad540c.css
index e69de29..917bde1 100644
--- a/docs/build/client/75ff7698b5db04ad540c.css
+++ b/docs/build/client/75ff7698b5db04ad540c.css
@@ -0,0 +1,271 @@
+html, body {
+  height: 100%;
+  margin: 0;
+  padding: 0;
+  width: 100%;
+}
+
+h1, h2, h3, h4, h5, h6, p {
+  margin: 0;
+  padding: 0;
+}
+
+a {
+  text-decoration: none;
+}
+  html-head:not(:defined) { opacity: 0; }
+html-header:not(:defined) { opacity: 0; }
+html-aside:not(:defined) { opacity: 0; }
+panel-layout:not(:defined) { opacity: 0; }
+panel-head:not(:defined) { opacity: 0; }
+panel-left:not(:defined) { opacity: 0; }
+panel-right:not(:defined) { opacity: 0; }
+panel-main:not(:defined) { opacity: 0; }
+tui-alert:not(:defined) { opacity: 0; }
+tui-tab:not(:defined) { opacity: 0; }
+api-docs:not(:defined) { opacity: 0; }
+api-ui:not(:defined) { opacity: 0; }
+app-head:not(:defined) { opacity: 0; }
+app-left:not(:defined) { opacity: 0; }
+app-main:not(:defined) { opacity: 0; }
+ide-app:not(:defined) { opacity: 0; }
+ide-code:not(:defined) { opacity: 0; }
+i18n-translate:not(:defined) { opacity: 0; }
+  :root {
+  --black: #000000;
+  --white: #FFFFFF;
+  --info: #1474FC;
+  --error: #DC3545;
+  --warning: #FF7B07;
+  --success: #28A745;
+  --muted: #999999;
+}
+
+.light {
+  --bg-0: #EFEFEF;
+  --bg-1: #CFCFCF;
+  --bg-2: #AFAFAF;
+  --bg-3: #8F8F8F;
+  --bg-4: #6F6F6F;
+  --bd-0: #EFEFEF;
+  --bd-1: #CFCFCF;
+  --bd-2: #AFAFAF;
+  --bd-3: #8F8F8F;
+  --bd-4: #6F6F6F;
+  --bg-inverse: #242424;
+  --tx-0: #000000;
+  --tx-1: #242424;
+  --tx-inverse: #CFCFCF;
+}
+
+.dark {
+  --bg-0: #121212;
+  --bg-1: #222222;
+  --bg-2: #323232;
+  --bg-3: #424242;
+  --bg-4: #525252;
+  --bd-0: #121212;
+  --bd-1: #222222;
+  --bd-2: #323232;
+  --bd-3: #424242;
+  --bd-4: #525252;
+  --bg-inverse: #DBDBDB;
+  --tx-0: #FFFFFF;
+  --tx-1: #CFCFCF;
+  --tx-inverse: #222222;
+}
+  html-head { display: block; }
+html-header { display: block; }
+html-aside { display: block; }
+panel-layout { display: block; }
+panel-head { display: block; }
+panel-left { display: block; }
+panel-right { display: block; }
+panel-main { display: block; }
+tui-alert { display: block; }
+tui-tab { display: block; }
+api-docs { display: block; }
+api-ui { display: block; }
+api-ide-code { display: block; }
+app-head { display: block; }
+app-left { display: block; }
+app-main { display: block; }
+ide-app { display: block; }
+ide-code { display: block; }
+i18n-translate { display: block; }
+  .arial { font-family: Arial, sans-serif; }
+.none { display: none; }
+.block { display: block; }
+.flex { display: flex; }
+.inline { display: inline; }
+.transparent { opacity: 0; }
+.relative { position: relative; }
+.absolute { position: absolute; }
+.static { position: static; }
+.bottom-0 { bottom: 0px; }
+.bottom-60 { bottom: 60px; }
+.left-0 { left: 0px; }
+.left-226 { left: 226px; }
+.left-0 { left: 0px; }
+.left-226 { left: 226px; }
+.left--226 { left: -226px; }
+.left-170 { left: 170px; }
+.right-0 { right: 0px; }
+.right--200 { right: -200px; }
+.right-0 { right: 0px; }
+.right-200 { right: 200px; }
+.right-200 { right: 200px; }
+.top-0 { top: 0px; }
+.top-60 { top: 60px; }
+.top-45 { top: 45px; }
+.z-1 { z-index: 1; }
+.z-2 { z-index: 2; }
+.flex-grow { flex-grow: 1; }
+.flex-center { align-items: center; justify-content: center; }
+.flex-center-y { align-items: center; }
+.gap-10 { gap: 10px; }
+.scroll-auto { overflow: auto; }
+.scroll-hidden { overflow: hidden; }
+.scroll-x-auto { overflow-x: auto; }
+.scroll-x-hidden { overflow-x: hidden; }
+.scroll-y-auto { overflow-y: auto; }
+.h-full { height: 100%; }
+.h-26 { height: 26px; }
+.h-7289 { height: 7289px; }
+.h-905496362982981723 { height: 905496362982981723px; }
+.h-60 { height: 60px; }
+.h-24 { height: 24px; }
+.h-45 { height: 45px; }
+.h-000000 { height: 000000px; }
+.h-999999 { height: 999999px; }
+.h-10 { height: 10px; }
+.h-32 { height: 32px; }
+.h-36 { height: 36px; }
+.h-calc-full-60 { height: calc(100% - 60px); }
+.h-calc-full-40 { height: calc(100% - 40px); }
+.vh { height: 100vh; }
+.w-full { width: 100%; }
+.w-226 { width: 226px; }
+.w-200 { width: 200px; }
+.w-0 { width: 0px; }
+.w-170 { width: 170px; }
+.w-10 { width: 10px; }
+.bg-primary { background-color: var(--primary) !important; }
+.bg-secondary { background-color: var(--secondary) !important; }
+.bg-black { background-color: var(--black) !important; }
+.bg-white { background-color: var(--white) !important; }
+.bg-info { background-color: var(--info) !important; }
+.bg-error { background-color: var(--error) !important; }
+.bg-warning { background-color: var(--warning) !important; }
+.bg-success { background-color: var(--success) !important; }
+.bg-muted { background-color: var(--muted) !important; }
+.bg-t-1 { background-color: var(--bg-1) !important; }
+.bg-t-2 { background-color: var(--bg-2) !important; }
+.bg-t-0 { background-color: var(--bg-0) !important; }
+.bg-h-cb3837 { background-color: #cb3837; }
+.bg-h-7289da { background-color: #7289da; }
+.bg-h-000000 { background-color: #000000; }
+.bg-h-999999 { background-color: #999999; }
+.tx-5 { font-size: 5px; }
+.tx-14 { font-size: 14px; }
+.tx-16 { font-size: 16px; }
+.tx-30 { font-size: 30px; }
+.tx-26 { font-size: 26px; }
+.tx-22 { font-size: 22px; }
+.tx-lg { font-size: 16px; }
+.tx-5xl { font-size: 26px; }
+.tx-center { text-align: center; }
+.tx-left { text-align: left; }
+.tx-right { text-align: right; }
+.tx-bold { font-weight: bold; }
+.tx-uppercase { text-transform: uppercase; }
+.tx-nowrap { white-space: nowrap; }
+.tx-top { vertical-align: top; }
+.tx-lh-24 { line-height: 24px; }
+.tx-lh-32 { line-height: 32px; }
+.tx-lh-36 { line-height: 36px; }
+.tx-primary { color: var(--primary) !important; }
+.tx-secondary { color: var(--secondary) !important; }
+.tx-white { color: var(--white) !important; }
+.tx-info { color: var(--info) !important; }
+.tx-error { color: var(--error) !important; }
+.tx-warning { color: var(--warning) !important; }
+.tx-success { color: var(--success) !important; }
+.tx-muted { color: var(--muted) !important; }
+.tx-t-1 { color: var(--tx-1) !important; }
+.tx-t-0 { color: var(--tx-0) !important; }
+.bd-solid { border-style: solid; }
+.bd-collapse { border-collapse: collapse; }
+.bd-primary { border-color: var(--primary) !important; }
+.bd-secondary { border-color: var(--secondary) !important; }
+.bd-info { border-color: var(--info) !important; }
+.bd-error { border-color: var(--error) !important; }
+.bd-warning { border-color: var(--warning) !important; }
+.bd-success { border-color: var(--success) !important; }
+.bd-muted { border-color: var(--muted) !important; }
+.bd-t-2 { border-color: var(--bd-2) !important; }
+.bd-t-1 { border-color: var(--bd-1) !important; }
+.bdb-0 { border-bottom-width: 0px; }
+.bdb-1 { border-bottom-width: 1px; }
+.bdl-0 { border-left-width: 0px; }
+.bdr-1 { border-right-width: 1px; }
+.bdt-0 { border-top-width: 0px; }
+.bdt-1 { border-top-width: 1px; }
+.bdx-0 { border-left-width: 0px; border-right-width: 0px; }
+.bdx-1 { border-left-width: 1px; border-right-width: 1px; }
+.bdy-0 { border-top-width: 0px; border-bottom-width: 0px; }
+.curved { border-radius: 4px; }
+.rounded { border-radius: 12px; }
+.pill { border-radius: 10000px; }
+.curve-t-sm { border-radius: 4px 4px 0 0; }
+.m-0 { margin: 0px; }
+.m-0 { margin: 0px; }
+.m-60 { margin: 60px; }
+.mb-0 { margin-bottom: 0px; }
+.mb-100 { margin-bottom: 100px; }
+.mb-20 { margin-bottom: 20px; }
+.ml-10 { margin-left: 10px; }
+.ml-5 { margin-left: 5px; }
+.ml-2 { margin-left: 2px; }
+.mr-10 { margin-right: 10px; }
+.mt-0 { margin-top: 0px; }
+.mt-20 { margin-top: 20px; }
+.my-40 { margin-top: 40px; margin-bottom: 40px; }
+.p-5 { padding: 5px; }
+.p-0 { padding: 0px; }
+.p-60 { padding: 60px; }
+.p-16 { padding: 16px; }
+.p-10 { padding: 10px; }
+.p-45 { padding: 45px; }
+.p-10 { padding: 10px; }
+.pb-10 { padding-bottom: 10px; }
+.pb-20 { padding-bottom: 20px; }
+.pl-10 { padding-left: 10px; }
+.pl-20 { padding-left: 20px; }
+.pl-5 { padding-left: 5px; }
+.pl-15 { padding-left: 15px; }
+.pr-10 { padding-right: 10px; }
+.pr-5 { padding-right: 5px; }
+.pt-20 { padding-top: 20px; }
+.pt-40 { padding-top: 40px; }
+.pt-5 { padding-top: 5px; }
+.pt-10 { padding-top: 10px; }
+.px-20 { padding-left: 20px; padding-right: 20px; }
+.px-10 { padding-left: 10px; padding-right: 10px; }
+.py-15 { padding-top: 15px; padding-bottom: 15px; }
+.py-5 { padding-top: 5px; padding-bottom: 5px; }
+.py-10 { padding-top: 10px; padding-bottom: 10px; }
+.py-20 { padding-top: 20px; padding-bottom: 20px; }
+.py-40 { padding-top: 40px; padding-bottom: 40px; }
+.cursor-pointer { cursor: pointer; }
+.transition-500 { transition: 500ms; }
+.shadow-0-0-10-0-0-0-5 { box-shadow: 0px 0px 10px rgb(0, 0, 0, 0.5); }
+@media (max-width: 767px) {
+  .md-inline-block { display: inline-block; }
+  .md-left-0 { left: 0px; }
+  .md-left-226 { left: 226px; }
+  .md-left--226 { left: -226px; }
+  .md-right--200 { right: -200px; }
+  .md-right-0 { right: 0px; }
+  .md-right-200 { right: 200px; }
+}
\ No newline at end of file
diff --git a/docs/build/client/75ff7698b5db04ad540c.html b/docs/build/client/75ff7698b5db04ad540c.html
index 7033be5..2dcba3e 100644
--- a/docs/build/client/75ff7698b5db04ad540c.html
+++ b/docs/build/client/75ff7698b5db04ad540c.html
@@ -18,162 +18,223 @@
   
   
   
-  
+  
   
   
   
   
 
-  
-    

-  
-  
-    Temple Logo
-  
-  
Temple

-  
+      
+        
+          

+            On this page
+          

+          
+        
+      
+      
+        
+          

+            Component Strategy
+          

+
+          
+            There are three types of components in Temple: Document, 
+            Template, and Component. Each type of component has a 
+            different strategy for rendering and updating the DOM. The 
+            Document component is the root component of the application 
+            and is responsible for rendering the entire application. The 
+            Template component is a reusable component that can be used 
+            in multiple places in the application. The Component component 
+            is a custom component that can be used to create complex UI 
+            elements.
+          
+
+          
+          

+            Document
+          

+
+          
+            A document denoted by files with the 
+            .dtml extension, is the root of
+            each page view that should include the document markup 
+            starting with <html>. While 
+            it looks like another Temple component, there are some key 
+            differences in how it is used.
+          
+
+          
    
+            
  • 
+              
+                A document logic (<script>)
+                is executed on the client side but is not a 
+                TempleComponent, which means 
+                it cannot be re-rendered and does not have access to 
+                this context.
+              
+            
    • 
+            
  • 
+              
+                A document props() are the 
+                server props passed down to the client.
+              
+            
    • 
+            
  • 
+              
+                A document does not have access to NodeJS functionality. So 
+                things like fs are not available.
+              
+            
    • 
+          

+
+          
+            
+            Recommendation: You should do server related
+            logic on the server framework and pass the neccesary data 
+            to the client.
+          
+
+          
+            
+              

+                
+                  src/index.ts
+                
+                
+                  src/page.dtml
+                
+              

+            
+            
+              

+                
+                src
+              

+              
+                
+                index.ts
               
-              
-                src/page.dtml
+              
+                
+                page.dtml
               
-            
-          
-          

-            

-              
-              src
-            

-            
-              
-              index.ts
-            
-            
-              
-              page.dtml
-            
-          

-          

-            

-              
+            
+            
+              
                 import http from 'http';
                 import temple from '@ossph/temple/compiler';
 
@@ -185,7 +246,7 @@ 

                   }));
                 });
               
-              

-          

-        
-
-        
-        
Template

-
-        
-          A template is resuable partial markup that can be imported by 
-          a component, document or another template. A template is 
-          not is not a TempleComponent, but 
-          rather adds its markup to the parent component's final markup.
-          You will not see a template in the DOM, but rather the
-          markup it contains.
-        
-
-        
-          For example, consider a document that contains the following 
-          markup.
-        
-
-        
-          <script>
-            const title = 'Hello World';
-          </script>
-          <html>
-            <head>
-              <meta charset="utf-8" />
-              <title>{title}</title>
-            </head>
-            <body>
-              <h1>{title}</h1>
-            </body>
-          </html>
-        
-
-        
-          You can create a template for the head of your
-          document and then import it. This allows you to
-          reuse the head markup in multiple documents.
-        
-
-        
-          

-            

-              
-                src/page.dtml
+            
+          
+
+          
+          

+            Template
+          

+
+          
+            A template is resuable partial markup that can be imported by 
+            a component, document or another template. A template is 
+            not is not a TempleComponent, but 
+            rather adds its markup to the parent component's final markup.
+            You will not see a template in the DOM, but rather the
+            markup it contains.
+          
+
+          
+            For example, consider a document that contains the following 
+            markup.
+          
+
+          
+            <script>
+              const title = 'Hello World';
+            </script>
+            <html>
+              <head>
+                <meta charset="utf-8" />
+                <title>{title}</title>
+              </head>
+              <body>
+                <h1>{title}</h1>
+              </body>
+            </html>
+          
+
+          
+            You can create a template for the head of your
+            document and then import it. This allows you to
+            reuse the head markup in multiple documents.
+          
+
+          
+            
+              

+                
+                  src/page.dtml
+                
+                
+                  src/head.tml
+                
+              

+            
+            
+              

+                
+                src
+              

+              
+                
+                page.dtml
               
-              
-                src/head.tml
+              
+                
+                head.tml
               
-            

-          

-          

-            

-              
-              src
-            

-            
-              
-              page.dtml
-            
-            
-              
-              head.tml
-            
-          

-          

-            

-              
+            
+            
+              
                 <link rel="import" type="template" href="./head.tml" name="html-head" />
                 <script>
                   const title = 'Hello World';
@@ -278,98 +339,100 @@ 

                   </body>
                 </html>
               
-              

-          

-        
-
-        
-          
-          Note: Template partials do not process 
-          attributes or children if given.
-        
-
-        
-          Variables used in a template should be declared in the
-          parent component or document. This allows you to pass
-          data to the template from the parent.
-        
-
-        
-        
Component

-
-        
-          All temple components are 
-          TempleComponent that extends
-          HTMLElement and therefore is 
-          both a web component and element just like any other element 
-          in the browser DOM. Components that do not use the
-          <style> tag are affected by 
-          the global styles of the application. Components with the
-          <style> tag enable the 
-          component's shadow DOM and will encapsulate the styles within
-          the component and not be affected by global styles. With that 
-          said, there are several strategies that can be applied to 
-          Temple components.
-        
-
-        
-        
Strategy 1: No Components

-
-        
-          This strategy uses only documents and templates. This 
-          strategy is useful for simple applications that do not require 
-          complex UI elements. This is the best strategy for 
-          performant applications.
-        
-
-        
-          

-            

-              
-                src/page.dtml
+            
+          
+
+          
+            
+            Note: Template partials do not process 
+            attributes or children if given.
+          
+
+          
+            Variables used in a template should be declared in the
+            parent component or document. This allows you to pass
+            data to the template from the parent.
+          
+
+          
+          

+            Component
+          

+
+          
+            All temple components are 
+            TempleComponent that extends
+            HTMLElement and therefore is 
+            both a web component and element just like any other element 
+            in the browser DOM. Components that do not use the
+            <style> tag are affected by 
+            the global styles of the application. Components with the
+            <style> tag enable the 
+            component's shadow DOM and will encapsulate the styles within
+            the component and not be affected by global styles. With that 
+            said, there are several strategies that can be applied to 
+            Temple components.
+          
+
+          
+          

+            Strategy 1: No Components
+          

+
+          
+            This strategy uses only documents and templates. This 
+            strategy is useful for simple applications that do not require 
+            complex UI elements. This is the best strategy for 
+            performant applications.
+          
+
+          
+            
+              

+                
+                  src/page.dtml
+                
+                
+                  src/head.tml
+                
+                
+                  src/header.tml
+                
+                
+                  src/footer.tml
+                
+              

+            
+            
+              

+                
+                src
+              

+              
+                
+                page.dtml
               
-              
-                src/head.tml
+              
+                
+                head.tml
               
-              
-                src/header.tml
+              
+                
+                header.tml
               
-              
-                src/footer.tml
+              
+                
+                footer.tml
               
-            

-          

-          

-            

-              
-              src
-            

-            
-              
-              page.dtml
-            
-            
-              
-              head.tml
-            
-            
-              
-              header.tml
-            
-            
-              
-              footer.tml
-            
-          

-          

-            

-              
+            
+            
+              
                 <link rel="import" type="template" href="./head.tml" name="html-head" />
                 <link rel="import" type="template" href="./header.tml" name="page-header" />
                 <link rel="import" type="template" href="./footer.tml" name="page-footer" />
@@ -389,7 +452,7 @@ 

                   </body>
                 </html>
               
-              

-          

-        
-
-        
-        
Strategy 2: Shallow Components

-
-        
-          This strategy uses components that do not have a 
-          <style> tag and is useful for 
-          applications that require complex logic in components but 
-          using a shared global stylesheet.
-        
-
-        
-          

-            

-              
-                src/page.dtml
+            
+          
+
+          
+          

+            Strategy 2: Shallow Components
+          

+
+          
+            This strategy uses components that do not have a 
+            <style> tag and is useful for 
+            applications that require complex logic in components but 
+            using a shared global stylesheet.
+          
+
+          
+            
+              

+                
+                  src/page.dtml
+                
+                
+                  src/header.tml
+                
+                
+                  src/footer.tml
+                
+              

+            
+            
+              

+                
+                src
+              

+              
+                
+                page.dtml
               
-              
-                src/header.tml
+              
+                
+                header.tml
               
-              
-                src/footer.tml
+              
+                
+                footer.tml
               
-            

-          

-          

-            

-              
-              src
-            

-            
-              
-              page.dtml
-            
-            
-              
-              header.tml
-            
-            
-              
-              footer.tml
-            
-          

-          

-            

-              
+            
+            
+              
                 <link rel="import" type="component" href="./header.tml" name="page-header" />
                 <link rel="import" type="component" href="./footer.tml" name="page-footer" />
                 <script>
@@ -486,7 +549,7 @@ 

                   </body>
                 </html>
               
-              

-          

-        
-
-        
-        
Strategy 3: Partial Styling

-
-        
-          This strategy uses components that do not have a 
-          <style> tag,
-          but imports style via the 
-          <link> tag to utilize both 
-          global styles and specific styles that are needed for the
-          component. 
-        
-
-        
-          

-            

-              
-                src/page.dtml
+            
+          
+
+          
+          

+            Strategy 3: Partial Styling
+          

+
+          
+            This strategy uses components that do not have a 
+            <style> tag,
+            but imports style via the 
+            <link> tag to utilize both 
+            global styles and specific styles that are needed for the
+            component. 
+          
+
+          
+            
+              

+                
+                  src/page.dtml
+                
+                
+                  src/header.tml
+                
+                
+                  src/footer.tml
+                
+              

+            
+            
+              

+                
+                src
+              

+              
+                
+                page.dtml
               
-              
-                src/header.tml
+              
+                
+                header.tml
               
-              
-                src/footer.tml
+              
+                
+                footer.tml
               
-            

-          

-          

-            

-              
-              src
-            

-            
-              
-              page.dtml
-            
-            
-              
-              header.tml
-            
-            
-              
-              footer.tml
-            
-          

-          

-            

-              

-          

-        
-
-        
-        
Strategy 4: Encapulation

-
-        
-          This strategy uses components that have a
-          <style> tag and encapsulates
-          the styles within the component. This strategy is useful for
-          applications that require complex UI elements that need to be
-          styled in a specific way. This is also useful for components 
-          that are designed to be used in multiple projects.
-        
-
-        
-          

-            

-              
-                src/page.dtml
+            
+          
+
+          
+          

+            Strategy 4: Encapulation
+          

+
+          
+            This strategy uses components that have a
+            <style> tag and encapsulates
+            the styles within the component. This strategy is useful for
+            applications that require complex UI elements that need to be
+            styled in a specific way. This is also useful for components 
+            that are designed to be used in multiple projects.
+          
+
+          
+            
+              

+                
+                  src/page.dtml
+                
+                
+                  src/header.tml
+                
+                
+                  src/footer.tml
+                
+              

+            
+            
+              

+                
+                src
+              

+              
+                
+                page.dtml
               
-              
-                src/header.tml
+              
+                
+                header.tml
               
-              
-                src/footer.tml
+              
+                
+                footer.tml
               
-            

-          

-          

-            

-              
-              src
-            

-            
-              
-              page.dtml
-            
-            
-              
-              header.tml
-            
-            
-              
-              footer.tml
-            
-          

-          

-            

-              

-          

-        
-
-        
-        
Flash of Unstyled Content

-
-        
-          Web Components (custom elements) are 100% defined in 
-          JavaScript. That includes their HTML and CSS. Those are 
-          programmatically added to the DOM through APIs. By the time 
-          the browser has interpreted and executed that code, there is 
-          a good chance that the rendering pipeline has already put the 
-          custom element on the screen. Since the browser doesn't know 
-          about the element the first time around it will render it 
-          without the intended styling. After the JavaScript of the 
-          custom element definition is executed and the browser, 
-          therefore, knows about the CSS rules that apply to that 
-          element it can update the view.
-        
-
-        
-          A flash of unstyled content (FOUC) can cause irritating layout 
-          shifts as well as reveal content that should have been 
-          progressively disclosed. In order to prevent a reflow of other 
-          content you can add the following general solution to your 
-          global stylesheet.
-        
-
-        
-          *:not(:defined) {
-            opacity: 0;
-          }
-        
-
-        
-          This style will apply to all elements that are not defined,
-          which are usually web components and will hide the content 
-          until the browser has fully rendered the component.
-        
-        
-        
-      
-      

-    
+            
+          
+
+          
+          
Flash of Unstyled Content

+
+          
+            Web Components (custom elements) are 100% defined in 
+            JavaScript. That includes their HTML and CSS. Those are 
+            programmatically added to the DOM through APIs. By the time 
+            the browser has interpreted and executed that code, there is 
+            a good chance that the rendering pipeline has already put the 
+            custom element on the screen. Since the browser doesn't know 
+            about the element the first time around it will render it 
+            without the intended styling. After the JavaScript of the 
+            custom element definition is executed and the browser, 
+            therefore, knows about the CSS rules that apply to that 
+            element it can update the view.
+          
+
+          
+            A flash of unstyled content (FOUC) can cause irritating layout 
+            shifts as well as reveal content that should have been 
+            progressively disclosed. In order to prevent a reflow of other 
+            content you can add the following general solution to your 
+            global stylesheet.
+          
+
+          
+            *:not(:defined) {
+              opacity: 0;
+            }
+          
+
+          
+            This style will apply to all elements that are not defined,
+            which are usually web components and will hide the content 
+            until the browser has fully rendered the component.
+          
+
+          
+          

+        
+      
+    
   
 
\ No newline at end of file
diff --git a/docs/build/client/75ff7698b5db04ad540c.js b/docs/build/client/75ff7698b5db04ad540c.js
index 3a851a2..acbc552 100644
--- a/docs/build/client/75ff7698b5db04ad540c.js
+++ b/docs/build/client/75ff7698b5db04ad540c.js
@@ -1,21 +1,33 @@
-var TempleAPI=(()=>{var kt=Object.create;var be=Object.defineProperty;var Ft=Object.getOwnPropertyDescriptor;var St=Object.getOwnPropertyNames;var Pt=Object.getPrototypeOf,Ct=Object.prototype.hasOwnProperty;var O=(t,e)=>()=>(e||t((e={exports:{}}).exports,e),e.exports),Ot=(t,e)=>{for(var r in e)be(t,r,{get:e[r],enumerable:!0})},Ve=(t,e,r,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let a of St(e))!Ct.call(t,a)&&a!==r&&be(t,a,{get:()=>e[a],enumerable:!(i=Ft(e,a))||i.enumerable});return t};var $=(t,e,r)=>(r=t!=null?kt(Pt(t)):{},Ve(e||!t||!t.__esModule?be(r,"default",{value:t,enumerable:!0}):r,t)),jt=t=>Ve(be({},"__esModule",{value:!0}),t);var Me=O(De=>{"use strict";Object.defineProperty(De,"__esModule",{value:!0});var $e=class extends Error{static for(e,...r){return r.forEach(function(i){e=e.replace("%s",i)}),new this(e)}static forErrorsFound(e){let r=new this("Invalid Parameters");return r.errors=e,r}static require(e,r,...i){if(!e){for(let a of i)r=r.replace("%s",a);throw new this(r)}}constructor(e,r=500){super(),this.errors={},this.start=0,this.end=0,this.message=e,this.name=this.constructor.name,this.code=r}withCode(e){return this.code=e,this}withPosition(e,r){return this.start=e,this.end=r,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};De.default=$e});var se=O(re=>{"use strict";Object.defineProperty(re,"__esModule",{value:!0});re.TempleEmitter=void 0;var ve=class extends EventTarget{emit(e,r){return this.dispatchEvent(new CustomEvent(e,{detail:r})),this}on(e,r){if(e==="ready"&&document.readyState!=="loading"){let i=new CustomEvent("ready");return setTimeout(()=>r(i),1),this}return this.addEventListener(e,r),this}once(e,r){let i=a=>{this.unbind(e,i),r(a)};return this.on(e,i),this}unbind(e,r){return this.removeEventListener(e,r),this}};re.TempleEmitter=ve;var Ke=new ve;document.onreadystatechange=()=>{document.readyState!=="loading"&&Ke.emit("ready")};re.default=Ke});var Re=O(ae=>{"use strict";var $t=ae&&ae.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ae,"__esModule",{value:!0});var Le=$t(se()),qe=class{get attributes(){return Object.assign({},this._attributes)}get element(){return this._element}constructor(e,r){this._element=e,this._attributes=r}hasAttribute(e){return e in this._attributes}getAttribute(e){return this._attributes[e]}removeAttribute(e,r=!1){let i=this.getAttribute(e);return typeof i>"u"?this:(delete this._attributes[e],this._element.removeAttribute(e),r||Le.default.emit("attribute-remove",{element:this,key:e,previous:i}),this)}setAttribute(e,r,i=!1){if(typeof r>"u")return this.removeAttribute(e,i);let a=this.getAttribute(e);return a===r?this:(this._attributes[e]=r,typeof r=="string"&&this._element.setAttribute(e,r),i||(typeof a>"u"?Le.default.emit("attribute-create",{element:this,key:e,value:r}):Le.default.emit("attribute-update",{element:this,key:e,value:r,previous:a})),this)}setAttributes(e,r=!1){for(let[a,p]of Object.entries(e))this.setAttribute(a,p,r);let i=Object.keys(e);for(let a of Object.keys(this._attributes))i.includes(a)||this.removeAttribute(a,r);return this}};ae.default=qe});var _e=O(ne=>{"use strict";var Dt=ne&&ne.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ne,"__esModule",{value:!0});var Mt=Dt(Re()),ye=class{static get elements(){return this._elements}static createComponent(e,r,i,a=[]){let p=document.createElement("template");p.innerHTML=`<${e}>`;let m=p.content.querySelector(`${e}`);Object.setPrototypeOf(m,r.prototype),m.constructor=r.constructor,m.constructor.component=r.component;for(let[v,_]of Object.entries(i))typeof _=="string"?m.setAttribute(v,_):_===!0&&m.setAttribute(v,v);return m._TempleAttributes=i,m.props=i,a.forEach(v=>m.appendChild(v)),m.register(),customElements.get(e)||m.connectedCallback(),this.register(m,i)}static createElement(e,r,i=[]){let a=document.createElement(e);for(let[p,g]of Object.entries(r))typeof g=="string"?a.setAttribute(p,g):g===!0&&a.setAttribute(p,p);return i.filter(p=>typeof p<"u").forEach(p=>a.appendChild(p)),this.register(a,r)}static createText(e,r=!1){return document.createTextNode(e)}static filter(e){let r=[];return this._elements.forEach((i,a)=>{e(i,a)&&r.push(i)}),r}static get(e){return this._elements.get(e)||null}static has(e){return this._elements.has(e)}static map(e){let r=[];return this._elements.forEach((i,a)=>{r.push(e(i,a))}),r}static register(e,r){if(this.has(e))return this.get(e);let i=new Mt.default(e,r||{});return this._elements.set(e,i),i}};ye._elements=new Map;ne.default=ye});var z=O(ie=>{"use strict";Object.defineProperty(ie,"__esModule",{value:!0});ie.TempleDataMap=void 0;var we=class{constructor(){window.__APP_DATA__||(window.__APP_DATA__={})}clear(){return window.__APP_DATA__={},this}delete(e){return this.has(e)?(delete window.__APP_DATA__[e],!0):!1}entries(){return Object.entries(window.__APP_DATA__)}has(e){return e in window.__APP_DATA__}get(e){return window.__APP_DATA__[e]}keys(){return Object.keys(window.__APP_DATA__)}set(e,r){return window.__APP_DATA__[e]=r,this}values(){return Object.values(window.__APP_DATA__)}};ie.TempleDataMap=we;var Lt=new we;ie.default=Lt});var et=O(oe=>{"use strict";var Ne=oe&&oe.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(oe,"__esModule",{value:!0});var le=Ne(_e()),xe=Ne(se()),Qe=Ne(z()),Ie=class t extends HTMLElement{constructor(){super(...arguments),this._initiated=!1,this._template=null,this._attributes={},this._props={},this._children=void 0,this._rendering=!1}static register(){customElements.define(this.component[0],this)}get attr(){return this._attributes}get element(){return le.default.has(this)?le.default.get(this):le.default.register(this,this._TempleAttributes||{})}get metadata(){let[e,r]=this.constructor.component;return{tagname:e,classname:r}}get originalChildren(){return this._children}get initiated(){return this._initiated}get props(){return this._props}set props(e){this._props=Object.assign({},e),this._attributes=Object.fromEntries(Object.entries(e).filter(r=>typeof r[1]=="string"||r[1]===!0))}adoptedCallback(){this.render()}attributeChangedCallback(e,r,i){this.props=Object.assign(Object.assign({},this.props),{[e]:i}),this.render()}connectedCallback(){this.wait()}disconnectedCallback(){}getParentComponent(){let e=this.parentElement;for(;e;){if(e instanceof t)return e;e=e.parentElement}return null}register(){le.default.register(this,this._props)}render(){let e=this.getParentComponent();if(e&&!e.initiated)return;if(this._rendering)return;this._rendering=!0,Qe.default.set("current",this);let r=this.styles();this._template?xe.default.emit("unmounted",this):this._template=this.template();let i=this._template().filter(Boolean);if(r.length===0)this.textContent="",i.forEach(a=>this.appendChild(a));else{this.shadowRoot||this.attachShadow({mode:"open"});let a=this.shadowRoot;this.textContent="",a.textContent="";let p=document.createElement("style");p.innerText=r,a.appendChild(p),i.forEach(g=>{var m;return(m=this.shadowRoot)===null||m===void 0?void 0:m.appendChild(g)})}return Qe.default.delete("current"),this._initiated=!0,xe.default.emit("mounted",this),this._rendering=!1,this.shadowRoot?this.shadowRoot.innerHTML:this.innerHTML}wait(){if(document.readyState!=="loading")this._update();else{let e=()=>{this._update(),xe.default.unbind("ready",e)};xe.default.on("ready",e)}}_toNodeList(e){return e instanceof Node?[e]:Array.isArray(e)&&e.every(r=>r instanceof Node)?e:[le.default.createText(String(e))]}_update(){typeof this._children>"u"&&(this._children=Array.from(this.childNodes||[]));let e=this.element;e&&(this.props=Object.assign({},e.attributes),this.render()),this._initiated||this.render()}};oe.default=Ie});var tt=O(ue=>{"use strict";var qt=ue&&ue.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ue,"__esModule",{value:!0});var Rt=qt(z());function It(t){let e=Rt.default.get("env")||{};return t?e[t]||null:e}ue.default=It});var ze=O(ce=>{"use strict";var Nt=ce&&ce.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ce,"__esModule",{value:!0});ce.default=zt;var rt=Nt(z());function zt(t=null){return t||(t=rt.default.get("current")||null),t?t==="document"?rt.default.get("props")||{}:t.props:{}}});var st=O(de=>{"use strict";var Ht=de&&de.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(de,"__esModule",{value:!0});de.default=Gt;var Bt=Ht(ze());function Gt(t=null){return(0,Bt.default)(t).class}});var nt=O(U=>{"use strict";var Ut=U&&U.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(U,"__esModule",{value:!0});U.innerHTML=Wt;U.default=at;var Zt=Ut(z());function Wt(t=null){let e=at(t),r=document.createElement("template");return r.append(...e),r.innerHTML}function at(t=null){return t||(t=Zt.default.get("current")||null),t?t.originalChildren||[]:[]}});var ot=O(H=>{"use strict";var lt=H&&H.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(H,"__esModule",{value:!0});H.SignalRegistry=void 0;H.default=Xt;var it=lt(Me()),Jt=lt(z()),Z=class t{static observe(e,r){let i={getter:()=>a.raw,setter:g=>g},a={raw:r,getter(g){return i.getter=g,a},setter(g){return i.setter=g,a}};Object.defineProperty(a,"value",{get(){return i.getter()},set(g){let m=i.setter(g),v=t.serialize(m)!==t.serialize(a.raw);a.raw=m,v&&e.render()}});let p=this._observers.get(e);return p?(p.observed++,p.values.push(a)):this._observers.set(e,{observed:1,values:[a]}),a}static observer(e){return this._observers.get(e)||null}static serialize(e){return JSON.stringify(e)}};H.SignalRegistry=Z;Z._observers=new Map;function Xt(t,e=null){if(e||(e=Jt.default.get("current")||null),!e)throw it.default.for("Signals can only be created within a Temple component");if(!e.initiated)return Z.observe(e,t);let r=Z.observer(e);if(!r)throw it.default.for("State mismatch");return r.values[r.observed++%r.values.length]}});var pt=O(Ae=>{"use strict";var ct=Ae&&Ae.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Ae,"__esModule",{value:!0});var ut=ct(_e()),dt=ct(se()),ft=(t,e)=>Array.from(t.querySelectorAll("*")).filter(r=>{let i=ut.default.get(r);return i&&i.hasAttribute(e)}).map(r=>ut.default.get(r));function He(t,e){dt.default.on("mounted",r=>{if(!r.detail)return;let i=r.detail;ft(i.shadowRoot||i,t).forEach(e)})}function Yt(t,e){dt.default.on("unmounted",r=>{if(!r.detail)return;let i=r.detail;ft(i.shadowRoot||i,t).forEach(e)})}He("mount",t=>{let e=t.getAttribute("mount");if(typeof e=="function"){let r=new CustomEvent("mount",{detail:{node:t,target:t.element}});e(r)}});Yt("unmount",t=>{let e=t.getAttribute("unmount");if(typeof e=="function"){let r=new CustomEvent("unmount",{detail:{node:t,target:t.element}});e(r)}});He("if",t=>{let e=t.getAttribute("if");(e===!1||e==="false"||typeof e=="function"&&!e())&&t.element.remove()});["click","dblclick","mousedown","mouseup","mousemove","mouseover","mouseout","wheel","keydown","keypress","keyup","blur","change","contextmenu","focus","input","submit","invalid","reset","search","select","copy","cut","paste","drag","dragstart","dragend","dragover","dragenter","dragleave","drop","scroll","durationchange","ended","error","loadeddata","loadedmetadata","loadstart","pause","play","playing","progress","ratechange","seeked","seeking","stalled","suspend","timeupdate","volumechange","waiting","animationstart","animationend","animationiteration","transitionend","toggle"].forEach(t=>He(t,e=>{let r=e.getAttribute(t);typeof r=="function"&&(e.element.removeEventListener(t,r),e.element.addEventListener(t,r))}))});var Be=O(h=>{"use strict";var Vt=h&&h.__createBinding||(Object.create?function(t,e,r,i){i===void 0&&(i=r);var a=Object.getOwnPropertyDescriptor(e,r);(!a||("get"in a?!e.__esModule:a.writable||a.configurable))&&(a={enumerable:!0,get:function(){return e[r]}}),Object.defineProperty(t,i,a)}:function(t,e,r,i){i===void 0&&(i=r),t[i]=e[r]}),Kt=h&&h.__setModuleDefault||(Object.create?function(t,e){Object.defineProperty(t,"default",{enumerable:!0,value:e})}:function(t,e){t.default=e}),Te=h&&h.__importStar||function(t){if(t&&t.__esModule)return t;var e={};if(t!=null)for(var r in t)r!=="default"&&Object.prototype.hasOwnProperty.call(t,r)&&Vt(e,t,r);return Kt(e,t),e},B=h&&h.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(h,"__esModule",{value:!0});h.SignalRegistry=h.TempleException=h.TempleEmitter=h.TempleElement=h.TempleRegistry=h.TempleComponent=h.TempleDataMap=h.emitter=h.signal=h.innerHTML=h.children=h.classnames=h.props=h.env=h.data=void 0;var Qt=B(Me());h.TempleException=Qt.default;var er=B(et());h.TempleComponent=er.default;var tr=B(_e());h.TempleRegistry=tr.default;var rr=B(Re());h.TempleElement=rr.default;var mt=Te(se());h.emitter=mt.default;Object.defineProperty(h,"TempleEmitter",{enumerable:!0,get:function(){return mt.TempleEmitter}});var gt=Te(z());h.data=gt.default;Object.defineProperty(h,"TempleDataMap",{enumerable:!0,get:function(){return gt.TempleDataMap}});var sr=B(tt());h.env=sr.default;var ar=B(ze());h.props=ar.default;var nr=B(st());h.classnames=nr.default;var ht=Te(nt());h.children=ht.default;Object.defineProperty(h,"innerHTML",{enumerable:!0,get:function(){return ht.innerHTML}});var bt=Te(ot());h.signal=bt.default;Object.defineProperty(h,"SignalRegistry",{enumerable:!0,get:function(){return bt.SignalRegistry}});pt()});var q=O((Tr,vt)=>{vt.exports={...Be()}});var yt=O((kr,ke)=>{var ir=typeof window<"u"?window:typeof WorkerGlobalScope<"u"&&self instanceof WorkerGlobalScope?self:{};var c=function(t){var e=/(?:^|\s)lang(?:uage)?-([\w-]+)(?=\s|$)/i,r=0,i={},a={manual:t.Prism&&t.Prism.manual,disableWorkerMessageHandler:t.Prism&&t.Prism.disableWorkerMessageHandler,util:{encode:function s(n){return n instanceof p?new p(n.type,s(n.content),n.alias):Array.isArray(n)?n.map(s):n.replace(/&/g,"&").replace(/"u")return null;if("currentScript"in document)return document.currentScript;try{throw new Error}catch(o){var s=(/at [^(\r\n]*\((.*):[^:]+:[^:]+\)$/i.exec(o.stack)||[])[1];if(s){var n=document.getElementsByTagName("script");for(var l in n)if(n[l].src==s)return n[l]}return null}},isActive:function(s,n,l){for(var o="no-"+n;s;){var u=s.classList;if(u.contains(n))return!0;if(u.contains(o))return!1;s=s.parentElement}return!!l}},languages:{plain:i,plaintext:i,text:i,txt:i,extend:function(s,n){var l=a.util.clone(a.languages[s]);for(var o in n)l[o]=n[o];return l},insertBefore:function(s,n,l,o){o=o||a.languages;var u=o[s],f={};for(var b in u)if(u.hasOwnProperty(b)){if(b==n)for(var d in l)l.hasOwnProperty(d)&&(f[d]=l[d]);l.hasOwnProperty(b)||(f[b]=u[b])}var k=o[s];return o[s]=f,a.languages.DFS(a.languages,function(P,R){R===k&&P!=s&&(this[P]=f)}),f},DFS:function s(n,l,o,u){u=u||{};var f=a.util.objId;for(var b in n)if(n.hasOwnProperty(b)){l.call(n,b,n[b],o||b);var d=n[b],k=a.util.type(d);k==="Object"&&!u[f(d)]?(u[f(d)]=!0,s(d,l,null,u)):k==="Array"&&!u[f(d)]&&(u[f(d)]=!0,s(d,l,b,u))}}},plugins:{},highlightAll:function(s,n){a.highlightAllUnder(document,s,n)},highlightAllUnder:function(s,n,l){var o={callback:l,container:s,selector:'code[class*="language-"], [class*="language-"] code, code[class*="lang-"], [class*="lang-"] code'};a.hooks.run("before-highlightall",o),o.elements=Array.prototype.slice.apply(o.container.querySelectorAll(o.selector)),a.hooks.run("before-all-elements-highlight",o);for(var u=0,f;f=o.elements[u++];)a.highlightElement(f,n===!0,o.callback)},highlightElement:function(s,n,l){var o=a.util.getLanguage(s),u=a.languages[o];a.util.setLanguage(s,o);var f=s.parentElement;f&&f.nodeName.toLowerCase()==="pre"&&a.util.setLanguage(f,o);var b=s.textContent,d={element:s,language:o,grammar:u,code:b};function k(R){d.highlightedCode=R,a.hooks.run("before-insert",d),d.element.innerHTML=d.highlightedCode,a.hooks.run("after-highlight",d),a.hooks.run("complete",d),l&&l.call(d.element)}if(a.hooks.run("before-sanity-check",d),f=d.element.parentElement,f&&f.nodeName.toLowerCase()==="pre"&&!f.hasAttribute("tabindex")&&f.setAttribute("tabindex","0"),!d.code){a.hooks.run("complete",d),l&&l.call(d.element);return}if(a.hooks.run("before-highlight",d),!d.grammar){k(a.util.encode(d.code));return}if(n&&t.Worker){var P=new Worker(a.filename);P.onmessage=function(R){k(R.data)},P.postMessage(JSON.stringify({language:d.language,code:d.code,immediateClose:!0}))}else k(a.highlight(d.code,d.grammar,d.language))},highlight:function(s,n,l){var o={code:s,grammar:n,language:l};if(a.hooks.run("before-tokenize",o),!o.grammar)throw new Error('The language "'+o.language+'" has no grammar.');return o.tokens=a.tokenize(o.code,o.grammar),a.hooks.run("after-tokenize",o),p.stringify(a.util.encode(o.tokens),o.language)},tokenize:function(s,n){var l=n.rest;if(l){for(var o in l)n[o]=l[o];delete n.rest}var u=new v;return _(u,u.head,s),m(s,u,n,u.head,0),E(u)},hooks:{all:{},add:function(s,n){var l=a.hooks.all;l[s]=l[s]||[],l[s].push(n)},run:function(s,n){var l=a.hooks.all[s];if(!(!l||!l.length))for(var o=0,u;u=l[o++];)u(n)}},Token:p};t.Prism=a;function p(s,n,l,o){this.type=s,this.content=n,this.alias=l,this.length=(o||"").length|0}p.stringify=function s(n,l){if(typeof n=="string")return n;if(Array.isArray(n)){var o="";return n.forEach(function(k){o+=s(k,l)}),o}var u={type:n.type,content:s(n.content,l),tag:"span",classes:["token",n.type],attributes:{},language:l},f=n.alias;f&&(Array.isArray(f)?Array.prototype.push.apply(u.classes,f):u.classes.push(f)),a.hooks.run("wrap",u);var b="";for(var d in u.attributes)b+=" "+d+'="'+(u.attributes[d]||"").replace(/"/g,""")+'"';return"<"+u.tag+' class="'+u.classes.join(" ")+'"'+b+">"+u.content+""};function g(s,n,l,o){s.lastIndex=n;var u=s.exec(l);if(u&&o&&u[1]){var f=u[1].length;u.index+=f,u[0]=u[0].slice(f)}return u}function m(s,n,l,o,u,f){for(var b in l)if(!(!l.hasOwnProperty(b)||!l[b])){var d=l[b];d=Array.isArray(d)?d:[d];for(var k=0;k=f.reach);L+=C.value.length,C=C.next){var G=C.value;if(n.length>s.length)return;if(!(G instanceof p)){var pe=1,M;if(Je){if(M=g(Xe,L,s,We),!M||M.index>=s.length)break;var me=M.index,Tt=M.index+M[0].length,I=L;for(I+=C.value.length;me>=I;)C=C.next,I+=C.value.length;if(I-=C.value.length,L=I,C.value instanceof p)continue;for(var te=C;te!==n.tail&&(If.reach&&(f.reach=Oe);var he=C.prev;Ce&&(he=_(n,he,Ce),L+=Ce.length),w(n,he,pe);var Et=new p(b,R?a.tokenize(ge,R):ge,xt,ge);if(C=_(n,he,Et),Ye&&_(n,C,Ye),pe>1){var je={cause:b+","+k,reach:Oe};m(s,n,l,C.prev,L,je),f&&je.reach>f.reach&&(f.reach=je.reach)}}}}}}function v(){var s={value:null,prev:null,next:null},n={value:null,prev:s,next:null};s.next=n,this.head=s,this.tail=n,this.length=0}function _(s,n,l){var o=n.next,u={value:l,prev:n,next:o};return n.next=u,o.prev=u,s.length++,u}function w(s,n,l){for(var o=n.next,u=0;u/,greedy:!0},prolog:{pattern:/<\?[\s\S]+?\?>/,greedy:!0},doctype:{pattern:/"'[\]]|"[^"]*"|'[^']*')+(?:\[(?:[^<"'\]]|"[^"]*"|'[^']*'|<(?!!--)|)*\]\s*)?>/i,greedy:!0,inside:{"internal-subset":{pattern:/(^[^\[]*\[)[\s\S]+(?=\]>$)/,lookbehind:!0,greedy:!0,inside:null},string:{pattern:/"[^"]*"|'[^']*'/,greedy:!0},punctuation:/^$|[[\]]/,"doctype-tag":/^DOCTYPE/i,name:/[^\s<>'"]+/}},cdata:{pattern://i,greedy:!0},tag:{pattern:/<\/?(?!\d)[^\s>\/=$<%]+(?:\s(?:\s*[^\s>\/=]+(?:\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))|(?=[\s/>])))+)?\s*\/?>/,greedy:!0,inside:{tag:{pattern:/^<\/?[^\s>\/]+/,inside:{punctuation:/^<\/?/,namespace:/^[^\s>\/:]+:/}},"special-attr":[],"attr-value":{pattern:/=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+)/,inside:{punctuation:[{pattern:/^=/,alias:"attr-equals"},{pattern:/^(\s*)["']|["']$/,lookbehind:!0}]}},punctuation:/\/?>/,"attr-name":{pattern:/[^\s>\/]+/,inside:{namespace:/^[^\s>\/:]+:/}}}},entity:[{pattern:/&[\da-z]{1,8};/i,alias:"named-entity"},/&#x?[\da-f]{1,8};/i]};c.languages.markup.tag.inside["attr-value"].inside.entity=c.languages.markup.entity;c.languages.markup.doctype.inside["internal-subset"].inside=c.languages.markup;c.hooks.add("wrap",function(t){t.type==="entity"&&(t.attributes.title=t.content.replace(/&/,"&"))});Object.defineProperty(c.languages.markup.tag,"addInlined",{value:function(e,r){var i={};i["language-"+r]={pattern:/(^$)/i,lookbehind:!0,inside:c.languages[r]},i.cdata=/^$/i;var a={"included-cdata":{pattern://i,inside:i}};a["language-"+r]={pattern:/[\s\S]+/,inside:c.languages[r]};var p={};p[e]={pattern:RegExp(/(<__[^>]*>)(?:))*\]\]>|(?!)/.source.replace(/__/g,function(){return e}),"i"),lookbehind:!0,greedy:!0,inside:a},c.languages.insertBefore("markup","cdata",p)}});Object.defineProperty(c.languages.markup.tag,"addAttribute",{value:function(t,e){c.languages.markup.tag.inside["special-attr"].push({pattern:RegExp(/(^|["'\s])/.source+"(?:"+t+")"+/\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))/.source,"i"),lookbehind:!0,inside:{"attr-name":/^[^\s=]+/,"attr-value":{pattern:/=[\s\S]+/,inside:{value:{pattern:/(^=\s*(["']|(?!["'])))\S[\s\S]*(?=\2$)/,lookbehind:!0,alias:[e,"language-"+e],inside:c.languages[e]},punctuation:[{pattern:/^=/,alias:"attr-equals"},/"|'/]}}}})}});c.languages.html=c.languages.markup;c.languages.mathml=c.languages.markup;c.languages.svg=c.languages.markup;c.languages.xml=c.languages.extend("markup",{});c.languages.ssml=c.languages.xml;c.languages.atom=c.languages.xml;c.languages.rss=c.languages.xml;(function(t){var e=/(?:"(?:\\(?:\r\n|[\s\S])|[^"\\\r\n])*"|'(?:\\(?:\r\n|[\s\S])|[^'\\\r\n])*')/;t.languages.css={comment:/\/\*[\s\S]*?\*\//,atrule:{pattern:RegExp("@[\\w-](?:"+/[^;{\s"']|\s+(?!\s)/.source+"|"+e.source+")*?"+/(?:;|(?=\s*\{))/.source),inside:{rule:/^@[\w-]+/,"selector-function-argument":{pattern:/(\bselector\s*\(\s*(?![\s)]))(?:[^()\s]|\s+(?![\s)])|\((?:[^()]|\([^()]*\))*\))+(?=\s*\))/,lookbehind:!0,alias:"selector"},keyword:{pattern:/(^|[^\w-])(?:and|not|only|or)(?![\w-])/,lookbehind:!0}}},url:{pattern:RegExp("\\burl\\((?:"+e.source+"|"+/(?:[^\\\r\n()"']|\\[\s\S])*/.source+")\\)","i"),greedy:!0,inside:{function:/^url/i,punctuation:/^\(|\)$/,string:{pattern:RegExp("^"+e.source+"$"),alias:"url"}}},selector:{pattern:RegExp(`(^|[{}\\s])[^{}\\s](?:[^{};"'\\s]|\\s+(?![\\s{])|`+e.source+")*(?=\\s*\\{)"),lookbehind:!0},string:{pattern:e,greedy:!0},property:{pattern:/(^|[^-\w\xA0-\uFFFF])(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*(?=\s*:)/i,lookbehind:!0},important:/!important\b/i,function:{pattern:/(^|[^-a-z0-9])[-a-z0-9]+(?=\()/i,lookbehind:!0},punctuation:/[(){};:,]/},t.languages.css.atrule.inside.rest=t.languages.css;var r=t.languages.markup;r&&(r.tag.addInlined("style","css"),r.tag.addAttribute("style","css"))})(c);c.languages.clike={comment:[{pattern:/(^|[^\\])\/\*[\s\S]*?(?:\*\/|$)/,lookbehind:!0,greedy:!0},{pattern:/(^|[^\\:])\/\/.*/,lookbehind:!0,greedy:!0}],string:{pattern:/(["'])(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/,greedy:!0},"class-name":{pattern:/(\b(?:class|extends|implements|instanceof|interface|new|trait)\s+|\bcatch\s+\()[\w.\\]+/i,lookbehind:!0,inside:{punctuation:/[.\\]/}},keyword:/\b(?:break|catch|continue|do|else|finally|for|function|if|in|instanceof|new|null|return|throw|try|while)\b/,boolean:/\b(?:false|true)\b/,function:/\b\w+(?=\()/,number:/\b0x[\da-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:e[+-]?\d+)?/i,operator:/[<>]=?|[!=]=?=?|--?|\+\+?|&&?|\|\|?|[?*/~^%]/,punctuation:/[{}[\];(),.:]/};c.languages.javascript=c.languages.extend("clike",{"class-name":[c.languages.clike["class-name"],{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$A-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\.(?:constructor|prototype))/,lookbehind:!0}],keyword:[{pattern:/((?:^|\})\s*)catch\b/,lookbehind:!0},{pattern:/(^|[^.]|\.\.\.\s*)\b(?:as|assert(?=\s*\{)|async(?=\s*(?:function\b|\(|[$\w\xA0-\uFFFF]|$))|await|break|case|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally(?=\s*(?:\{|$))|for|from(?=\s*(?:['"]|$))|function|(?:get|set)(?=\s*(?:[#\[$\w\xA0-\uFFFF]|$))|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)\b/,lookbehind:!0}],function:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*(?:\.\s*(?:apply|bind|call)\s*)?\()/,number:{pattern:RegExp(/(^|[^\w$])/.source+"(?:"+(/NaN|Infinity/.source+"|"+/0[bB][01]+(?:_[01]+)*n?/.source+"|"+/0[oO][0-7]+(?:_[0-7]+)*n?/.source+"|"+/0[xX][\dA-Fa-f]+(?:_[\dA-Fa-f]+)*n?/.source+"|"+/\d+(?:_\d+)*n/.source+"|"+/(?:\d+(?:_\d+)*(?:\.(?:\d+(?:_\d+)*)?)?|\.\d+(?:_\d+)*)(?:[Ee][+-]?\d+(?:_\d+)*)?/.source)+")"+/(?![\w$])/.source),lookbehind:!0},operator:/--|\+\+|\*\*=?|=>|&&=?|\|\|=?|[!=]==|<<=?|>>>?=?|[-+*/%&|^!=<>]=?|\.{3}|\?\?=?|\?\.?|[~:]/});c.languages.javascript["class-name"][0].pattern=/(\b(?:class|extends|implements|instanceof|interface|new)\s+)[\w.\\]+/;c.languages.insertBefore("javascript","keyword",{regex:{pattern:RegExp(/((?:^|[^$\w\xA0-\uFFFF."'\])\s]|\b(?:return|yield))\s*)/.source+/\//.source+"(?:"+/(?:\[(?:[^\]\\\r\n]|\\.)*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}/.source+"|"+/(?:\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.)*\])*\])*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}v[dgimyus]{0,7}/.source+")"+/(?=(?:\s|\/\*(?:[^*]|\*(?!\/))*\*\/)*(?:$|[\r\n,.;:})\]]|\/\/))/.source),lookbehind:!0,greedy:!0,inside:{"regex-source":{pattern:/^(\/)[\s\S]+(?=\/[a-z]*$)/,lookbehind:!0,alias:"language-regex",inside:c.languages.regex},"regex-delimiter":/^\/|\/$/,"regex-flags":/^[a-z]+$/}},"function-variable":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*[=:]\s*(?:async\s*)?(?:\bfunction\b|(?:\((?:[^()]|\([^()]*\))*\)|(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)\s*=>))/,alias:"function"},parameter:[{pattern:/(function(?:\s+(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)?\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\))/,lookbehind:!0,inside:c.languages.javascript},{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$a-z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*=>)/i,lookbehind:!0,inside:c.languages.javascript},{pattern:/(\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*=>)/,lookbehind:!0,inside:c.languages.javascript},{pattern:/((?:\b|\s|^)(?!(?:as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)(?![$\w\xA0-\uFFFF]))(?:(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*)\(\s*|\]\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*\{)/,lookbehind:!0,inside:c.languages.javascript}],constant:/\b[A-Z](?:[A-Z_]|\dx?)*\b/});c.languages.insertBefore("javascript","string",{hashbang:{pattern:/^#!.*/,greedy:!0,alias:"comment"},"template-string":{pattern:/`(?:\\[\s\S]|\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}|(?!\$\{)[^\\`])*`/,greedy:!0,inside:{"template-punctuation":{pattern:/^`|`$/,alias:"string"},interpolation:{pattern:/((?:^|[^\\])(?:\\{2})*)\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}/,lookbehind:!0,inside:{"interpolation-punctuation":{pattern:/^\$\{|\}$/,alias:"punctuation"},rest:c.languages.javascript}},string:/[\s\S]+/}},"string-property":{pattern:/((?:^|[,{])[ \t]*)(["'])(?:\\(?:\r\n|[\s\S])|(?!\2)[^\\\r\n])*\2(?=\s*:)/m,lookbehind:!0,greedy:!0,alias:"property"}});c.languages.insertBefore("javascript","operator",{"literal-property":{pattern:/((?:^|[,{])[ \t]*)(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*:)/m,lookbehind:!0,alias:"property"}});c.languages.markup&&(c.languages.markup.tag.addInlined("script","javascript"),c.languages.markup.tag.addAttribute(/on(?:abort|blur|change|click|composition(?:end|start|update)|dblclick|error|focus(?:in|out)?|key(?:down|up)|load|mouse(?:down|enter|leave|move|out|over|up)|reset|resize|scroll|select|slotchange|submit|unload|wheel)/.source,"javascript"));c.languages.js=c.languages.javascript;(function(){if(typeof c>"u"||typeof document>"u")return;Element.prototype.matches||(Element.prototype.matches=Element.prototype.msMatchesSelector||Element.prototype.webkitMatchesSelector);var t="Loading\u2026",e=function(x,y){return"\u2716 Error "+x+" while fetching file: "+y},r="\u2716 Error: File does not exist or is empty",i={js:"javascript",py:"python",rb:"ruby",ps1:"powershell",psm1:"powershell",sh:"bash",bat:"batch",h:"c",tex:"latex"},a="data-src-status",p="loading",g="loaded",m="failed",v="pre[data-src]:not(["+a+'="'+g+'"]):not(['+a+'="'+p+'"])';function _(x,y,A){var s=new XMLHttpRequest;s.open("GET",x,!0),s.onreadystatechange=function(){s.readyState==4&&(s.status<400&&s.responseText?y(s.responseText):s.status>=400?A(e(s.status,s.statusText)):A(r))},s.send(null)}function w(x){var y=/^\s*(\d+)\s*(?:(,)\s*(?:(\d+)\s*)?)?$/.exec(x||"");if(y){var A=Number(y[1]),s=y[2],n=y[3];return s?n?[A,Number(n)]:[A,void 0]:[A,A]}}c.hooks.add("before-highlightall",function(x){x.selector+=", "+v}),c.hooks.add("before-sanity-check",function(x){var y=x.element;if(y.matches(v)){x.code="",y.setAttribute(a,p);var A=y.appendChild(document.createElement("CODE"));A.textContent=t;var s=y.getAttribute("data-src"),n=x.language;if(n==="none"){var l=(/\.(\w+)$/.exec(s)||[,"none"])[1];n=i[l]||l}c.util.setLanguage(A,n),c.util.setLanguage(y,n);var o=c.plugins.autoloader;o&&o.loadLanguages(n),_(s,function(u){y.setAttribute(a,g);var f=w(y.getAttribute("data-range"));if(f){var b=u.split(/\r\n?|\n/g),d=f[0],k=f[1]==null?b.length:f[1];d<0&&(d+=b.length),d=Math.max(0,Math.min(d-1,b.length)),k<0&&(k+=b.length),k=Math.max(0,Math.min(k,b.length)),u=b.slice(d,k).join(`
-`),y.hasAttribute("data-start")||y.setAttribute("data-start",String(d+1))}A.textContent=u,c.highlightElement(A)},function(u){y.setAttribute(a,m),A.textContent=u})}}),c.plugins.fileHighlight={highlight:function(y){for(var A=(y||document).querySelectorAll(v),s=0,n;n=A[s++];)c.highlightElement(n)}};var E=!1;c.fileHighlight=function(){E||(console.warn("Prism.fileHighlight is deprecated. Use `Prism.plugins.fileHighlight.highlight` instead."),E=!0),c.plugins.fileHighlight.highlight.apply(this,arguments)}})()});var J=O((Fr,_t)=>{_t.exports={...Be()}});var ur={};Ot(ur,{BUILD_ID:()=>or,TempleComponent:()=>F.TempleComponent,TempleElement:()=>F.TempleElement,TempleEmitter:()=>F.TempleEmitter,TempleException:()=>F.TempleException,TempleRegistry:()=>F.TempleRegistry,children:()=>F.children,components:()=>lr,data:()=>F.data,emitter:()=>F.emitter,props:()=>F.props,signal:()=>F.signal});var D=$(q());var Ee=$(q()),W=class extends Ee.TempleComponent{static component=["main","Main_fd7f1af6410c5b5c8e1f"];styles(){return""}template(){let e=this.props,r=()=>this.originalChildren;return()=>[Ee.TempleRegistry.createElement("main",{},[...this._toNodeList(r())]).element]}};var T=$(q()),Ge=$(yt()),wt=$(J()),X=class extends T.TempleComponent{static component=["code","Code_6f36bc13bb6a166c7abc"];styles(){return`:host {
+var TempleAPI=(()=>{var lr=Object.create;var Ge=Object.defineProperty;var or=Object.getOwnPropertyDescriptor;var pr=Object.getOwnPropertyNames;var cr=Object.getPrototypeOf,dr=Object.prototype.hasOwnProperty;var N=(t,e)=>()=>(e||t((e={exports:{}}).exports,e),e.exports),ur=(t,e)=>{for(var r in e)Ge(t,r,{get:e[r],enumerable:!0})},Pt=(t,e,r,n)=>{if(e&&typeof e=="object"||typeof e=="function")for(let s of pr(e))!dr.call(t,s)&&s!==r&&Ge(t,s,{get:()=>e[s],enumerable:!(n=or(e,s))||n.enumerable});return t};var T=(t,e,r)=>(r=t!=null?lr(cr(t)):{},Pt(e||!t||!t.__esModule?Ge(r,"default",{value:t,enumerable:!0}):r,t)),mr=t=>Pt(Ge({},"__esModule",{value:!0}),t);var Ee=N(gt=>{"use strict";Object.defineProperty(gt,"__esModule",{value:!0});var ht=class extends Error{static for(e,...r){return r.forEach(function(n){e=e.replace("%s",n)}),new this(e)}static forErrorsFound(e){let r=new this("Invalid Parameters");return r.errors=e,r}static require(e,r,...n){if(!e){for(let s of n)r=r.replace("%s",s);throw new this(r)}}constructor(e,r=500){super(),this.errors={},this.start=0,this.end=0,this.message=e,this.name=this.constructor.name,this.code=r}withCode(e){return this.code=e,this}withPosition(e,r){return this.start=e,this.end=r,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};gt.default=ht});var Ze=N(I=>{"use strict";var fr=I&&I.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(I,"__esModule",{value:!0});I.match=I.TempleEmitter=I.events=void 0;I.bindAttribute=G;I.unbindAttribute=Mt;var jt=fr(Xe());I.events=["click","dblclick","mousedown","mouseup","mousemove","mouseover","mouseout","wheel","keydown","keypress","keyup","blur","change","contextmenu","focus","input","submit","invalid","reset","search","select","copy","cut","paste","drag","dragstart","dragend","dragover","dragenter","dragleave","drop","scroll","durationchange","ended","error","loadeddata","loadedmetadata","loadstart","pause","play","playing","progress","ratechange","seeked","seeking","stalled","suspend","timeupdate","volumechange","waiting","animationstart","animationend","animationiteration","transitionend","toggle"];var We=class extends EventTarget{emit(e,r){return this.dispatchEvent(new CustomEvent(e,{detail:r})),this}on(e,r){if(e==="ready"&&document.readyState!=="loading"){let n=new CustomEvent("ready");return setTimeout(()=>r(n),1),this}return this.addEventListener(e,r),this}once(e,r){let n=s=>{this.unbind(e,n),r(s)};return this.on(e,n),this}unbind(e,r){return this.removeEventListener(e,r),this}};I.TempleEmitter=We;var hr=(t,e)=>Array.from(t.querySelectorAll("*")).filter(r=>{let n=jt.default.get(r),s=n&&n.hasAttribute(e)&&!n.hasEvent(e);return s&&n.addEvent(e),s}).map(r=>jt.default.get(r));I.match=hr;function G(t,e){Ue.on("mounted",r=>{if(!r.detail)return;let n=r.detail;(0,I.match)(n.shadowRoot||n,t).forEach(e)})}function Mt(t,e){Ue.on("unmounted",r=>{if(!r.detail)return;let n=r.detail;(0,I.match)(n.shadowRoot||n,t).forEach(e)})}var Ue=new We;I.default=(document.onreadystatechange=()=>{document.readyState!=="loading"&&Ue.emit("ready")},G("mount",t=>{let e=t.getAttribute("mount");if(typeof e=="function"){let r=new CustomEvent("mount",{detail:{node:t,target:t.element}});e(r)}}),Mt("unmount",t=>{let e=t.getAttribute("unmount");if(typeof e=="function"){let r=new CustomEvent("unmount",{detail:{node:t,target:t.element}});e(r)}}),G("connect",t=>{let e=t.getAttribute("connect");if(typeof e=="function"){let r=new CustomEvent("connect",{detail:{node:t,target:t.element}});e(r)}}),G("disconnect",t=>{let e=t.getAttribute("disconnect");if(typeof e=="function"){let r=new CustomEvent("disconnect",{detail:{node:t,target:t.element}});e(r)}}),G("adopt",t=>{let e=t.getAttribute("adopt");if(typeof e=="function"){let r=new CustomEvent("adopt",{detail:{node:t,target:t.element}});e(r)}}),G("if",t=>{let e=t.getAttribute("if");(e===!1||e==="false"||typeof e=="function"&&!e())&&t.element.remove()}),I.events.forEach(t=>G(t,e=>{let r=e.getAttribute(t);typeof r=="function"&&(e.element.removeEventListener(t,r),e.element.addEventListener(t,r))})),Ue)});var xt=N(Le=>{"use strict";var gr=Le&&Le.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Le,"__esModule",{value:!0});var yt=gr(Ze()),bt=class{get attributes(){return Object.assign({},this._attributes)}get element(){return this._element}get events(){return this._events}constructor(e,r){this._events=new Set,this._element=e,this._attributes=r}addEvent(e){return this._events.add(e),this}getAttribute(e){return this._attributes[e]}hasAttribute(e){return e in this._attributes}hasEvent(e){return this._events.has(e)}removeAttribute(e,r=!1){let n=this.getAttribute(e);return typeof n>"u"?this:(delete this._attributes[e],this._element.removeAttribute(e),r||yt.default.emit("attribute-remove",{element:this,key:e,previous:n}),this)}setAttribute(e,r,n=!1){if(typeof r>"u")return this.removeAttribute(e,n);let s=this.getAttribute(e);return s===r?this:(this._attributes[e]=r,typeof r=="string"&&this._element.setAttribute(e,r),n||(typeof s>"u"?yt.default.emit("attribute-create",{element:this,key:e,value:r}):yt.default.emit("attribute-update",{element:this,key:e,value:r,previous:s})),this)}setAttributes(e,r=!1){for(let[s,u]of Object.entries(e))this.setAttribute(s,u,r);let n=Object.keys(e);for(let s of Object.keys(this._attributes))n.includes(s)||this.removeAttribute(s,r);return this}};Le.default=bt});var Xe=N(Re=>{"use strict";var yr=Re&&Re.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Re,"__esModule",{value:!0});var br=yr(xt()),Nt=document.createElement("textarea"),xr=t=>(Nt.innerHTML=t,Nt.value),Ye=class{static get elements(){return this._elements}static createComponent(e,r,n,s=[]){let u=document.createElement("template");u.innerHTML=`<${e}>`;let d=u.content.querySelector(`${e}`);return Object.setPrototypeOf(d,r.prototype),d.constructor=r.constructor,d.constructor.component=r.component,d.register(n,s),d.element}static createElement(e,r,n=[]){let s=document.createElement(e);for(let[u,y]of Object.entries(r))typeof y=="string"?s.setAttribute(u,y):y===!0&&s.setAttribute(u,u);return n.filter(u=>typeof u<"u").forEach(u=>s.appendChild(u)),this.register(s,r)}static createText(e,r=!0){return document.createTextNode(xr(e))}static filter(e){let r=[];return this._elements.forEach((n,s)=>{e(n,s)&&r.push(n)}),r}static get(e){return this._elements.get(e)||null}static has(e){return this._elements.has(e)}static map(e){let r=[];return this._elements.forEach((n,s)=>{r.push(e(n,s))}),r}static register(e,r){if(this.has(e))return this.get(e);let n=new br.default(e,r||{});return this._elements.set(e,n),n}};Ye._elements=new Map;Re.default=Ye});var ne=N(Fe=>{"use strict";Object.defineProperty(Fe,"__esModule",{value:!0});Fe.TempleDataMap=void 0;var Ve=class{constructor(){window.__APP_DATA__||(window.__APP_DATA__={})}clear(){return window.__APP_DATA__={},this}delete(e){return this.has(e)?(delete window.__APP_DATA__[e],!0):!1}entries(){return Object.entries(window.__APP_DATA__)}has(e){return e in window.__APP_DATA__}get(e){return window.__APP_DATA__[e]}keys(){return Object.keys(window.__APP_DATA__)}set(e,r){return window.__APP_DATA__[e]=r,this}values(){return Object.values(window.__APP_DATA__)}};Fe.TempleDataMap=Ve;var vr=new Ve;Fe.default=vr});var Ot=N(Se=>{"use strict";var Qe=Se&&Se.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Se,"__esModule",{value:!0});var It=Qe(Ee()),W=Qe(Xe()),U=Qe(Ze()),Ke=Qe(ne()),vt=class t extends HTMLElement{static register(){customElements.define(this.component[0],this)}get attr(){return Object.fromEntries(Array.from(this.attributes).map(e=>[e.name,e.value]))}get element(){if(!W.default.has(this))throw It.default.for("Component not mapped.");return W.default.get(this)}get metadata(){let[e,r]=this.constructor.component;return{tagname:e,classname:r}}get originalChildren(){return this._children}get initiated(){return this._initiated}get props(){return this.getAttributes()}get virtual(){return this._virtual}set props(e){this.setAttributes(e)}constructor(){if(super(),this._initiated=!1,this._template=null,this._children=void 0,this._rendering=!1,this._observer=null,this._virtual=!1,!W.default.has(this))throw It.default.for("Component not mapped.")}adoptedCallback(){this.render(),U.default.emit("adopt",this)}connectedCallback(){this.wait(),U.default.emit("connect",this)}disconnectedCallback(){U.default.emit("disconnect",this)}getAttribute(e){return this.element.getAttribute(e)}getAttributes(){return Object.assign({},this.element.attributes)}getParentComponent(){let e=this.parentElement;for(;e;){if(e instanceof t)return e;e=e.parentElement}return null}hasAttribute(e){return this.element.hasAttribute(e)}register(e={},r=[]){W.default.has(this)?W.default.get(this).setAttributes(e):W.default.register(this,e);for(let[n,s]of Object.entries(e))typeof s=="string"?super.setAttribute(n,s):s===!0&&super.setAttribute(n,n);this._children=r,this._virtual=!0,this.connectedCallback()}removeAttribute(e){this.hasAttribute(e)&&this.element.removeAttribute(e),super.hasAttribute(e)&&super.removeAttribute(e)}render(){let e=this.getParentComponent();if(e&&!e.initiated)return;if(this._rendering)return;this._rendering=!0;let r=Ke.default.get("current");Ke.default.set("current",this);let n=this.styles();this._template?U.default.emit("unmounted",this):this._template=this.template();let s=this._template().filter(Boolean);if(n.length===0)this.textContent="",s.forEach(u=>this.appendChild(u));else{this.shadowRoot||this.attachShadow({mode:"open"});let u=this.shadowRoot;this.textContent="",u.textContent="";let y=document.createElement("style");y.innerText=n,u.appendChild(y),s.forEach(d=>{var k;return(k=this.shadowRoot)===null||k===void 0?void 0:k.appendChild(d)})}return r?Ke.default.set("current",r):Ke.default.delete("current"),this._initiated=!0,this._rendering=!1,U.default.emit("mounted",this),this.shadowRoot?this.shadowRoot.innerHTML:this.innerHTML}setAttribute(e,r){this.element.setAttribute(e,r),(typeof r=="string"||r===!0)&&super.setAttribute(e,r)}setAttributes(e){this.element.setAttributes(e)}wait(){if(document.readyState!=="loading")this._update();else{let e=()=>{this._update(),U.default.unbind("ready",e)};U.default.on("ready",e)}}_toNodeList(e){return e instanceof Node?[e]:Array.isArray(e)&&e.every(r=>r instanceof Node)?e:[W.default.createText(String(e))]}_update(){typeof this._children>"u"&&(this._children=Array.from(this.childNodes||[])),this._initiated||this.render()}};Se.default=vt});var ie=N(Ce=>{"use strict";var $t=Ce&&Ce.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Ce,"__esModule",{value:!0});Ce.default=wr;var kr=$t(Ee()),Tr=$t(ne());function wr(t=null,e=!1){if(!t&&(t=Tr.default.get("current"),!t)){if(!e)throw kr.default.for("Not called within a Temple component");return null}return t}});var Ht=N(De=>{"use strict";var _r=De&&De.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(De,"__esModule",{value:!0});var Ar=_r(ne());function Er(t){let e=Ar.default.get("env")||{};return t?e[t]||null:e}De.default=Er});var kt=N(Pe=>{"use strict";var Bt=Pe&&Pe.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Pe,"__esModule",{value:!0});Pe.default=Fr;var Lr=Bt(ie()),Rr=Bt(ne());function Fr(t=null){let e=(0,Lr.default)(t,!0);return typeof e=="string"?Rr.default.get("props")||{}:e?e.props:{}}});var zt=N(ae=>{"use strict";var qt=ae&&ae.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ae,"__esModule",{value:!0});ae.classlist=Dr;ae.default=Pr;var Sr=qt(ie()),Cr=qt(kt());function Dr(t=null){var e;if(t==="body")return document.body.classList;if(t==="head")return document.head.classList;if(t==="document")return(e=document.body.parentElement)===null||e===void 0?void 0:e.classList;let r=(0,Sr.default)(t);return r?.classList}function Pr(t=null){return(0,Cr.default)(t).class}});var Jt=N(Z=>{"use strict";var jr=Z&&Z.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Z,"__esModule",{value:!0});Z.innerHTML=Nr;Z.innerText=Ir;Z.default=Tt;var Mr=jr(ie());function Nr(t=null){let e=Tt(t),r=document.createElement("template");return r.append(...e.map(n=>n.cloneNode(!0))),r.innerHTML}function Ir(t=null){let e=Tt(t),r=document.createElement("template");return r.append(...e.map(n=>n.cloneNode(!0))),r.innerText}function Tt(t=null){let e=(0,Mr.default)(t,!0);return typeof e!="string"&&e?e.originalChildren||[]:[]}});var Wt=N(X=>{"use strict";var Gt=X&&X.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(X,"__esModule",{value:!0});X.SignalRegistry=void 0;X.default=Hr;var Or=Gt(ie()),$r=Gt(Ee()),le=class t{static observe(e,r){let n={getter:()=>u.raw,setter:d=>d},s=new Set,u={raw:r,change(d){s.add(d)},getter(d){return n.getter=d,u},setter(d){return n.setter=d,u}};Object.defineProperty(u,"value",{get(){return n.getter()},set(d){let k=n.setter(d),v=t.serialize(k)!==t.serialize(u.raw);u.raw=k,v&&(s.forEach(m=>m(k)),e.render())}});let y=this._observers.get(e);return y?(y.observed++,y.values.push(u)):this._observers.set(e,{observed:1,values:[u]}),u}static observer(e){return this._observers.get(e)||null}static serialize(e){return JSON.stringify(e)}};X.SignalRegistry=le;le._observers=new Map;function Hr(t,e=null){let r=(0,Or.default)(e);if(!r.initiated)return le.observe(r,t);let n=le.observer(r);if(!n)throw $r.default.for("Signal state mismatch");return n.values[n.observed++%n.values.length]}});var _t=N(x=>{"use strict";var Br=x&&x.__createBinding||(Object.create?function(t,e,r,n){n===void 0&&(n=r);var s=Object.getOwnPropertyDescriptor(e,r);(!s||("get"in s?!e.__esModule:s.writable||s.configurable))&&(s={enumerable:!0,get:function(){return e[r]}}),Object.defineProperty(t,n,s)}:function(t,e,r,n){n===void 0&&(n=r),t[n]=e[r]}),qr=x&&x.__setModuleDefault||(Object.create?function(t,e){Object.defineProperty(t,"default",{enumerable:!0,value:e})}:function(t,e){t.default=e}),je=x&&x.__importStar||function(t){if(t&&t.__esModule)return t;var e={};if(t!=null)for(var r in t)r!=="default"&&Object.prototype.hasOwnProperty.call(t,r)&&Br(e,t,r);return qr(e,t),e},Y=x&&x.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(x,"__esModule",{value:!0});x.SignalRegistry=x.TempleException=x.TempleEmitter=x.TempleElement=x.TempleRegistry=x.TempleComponent=x.TempleDataMap=x.emitter=x.signal=x.innerHTML=x.innerText=x.children=x.classnames=x.classlist=x.props=x.env=x.data=x.component=void 0;var zr=Y(Ee());x.TempleException=zr.default;var Jr=Y(Ot());x.TempleComponent=Jr.default;var Gr=Y(Xe());x.TempleRegistry=Gr.default;var Wr=Y(xt());x.TempleElement=Wr.default;var Ut=je(Ze());x.emitter=Ut.default;Object.defineProperty(x,"TempleEmitter",{enumerable:!0,get:function(){return Ut.TempleEmitter}});var Ur=Y(ie());x.component=Ur.default;var Zt=je(ne());x.data=Zt.default;Object.defineProperty(x,"TempleDataMap",{enumerable:!0,get:function(){return Zt.TempleDataMap}});var Zr=Y(Ht());x.env=Zr.default;var Xr=Y(kt());x.props=Xr.default;var Xt=je(zt());x.classnames=Xt.default;Object.defineProperty(x,"classlist",{enumerable:!0,get:function(){return Xt.classlist}});var wt=je(Jt());x.children=wt.default;Object.defineProperty(x,"innerHTML",{enumerable:!0,get:function(){return wt.innerHTML}});Object.defineProperty(x,"innerText",{enumerable:!0,get:function(){return wt.innerText}});var Yt=je(Wt());x.signal=Yt.default;Object.defineProperty(x,"SignalRegistry",{enumerable:!0,get:function(){return Yt.SignalRegistry}})});var D=N((gs,Vt)=>{Vt.exports={..._t()}});var P=N((ys,Kt)=>{Kt.exports={..._t()}});var At=N((Es,at)=>{var Yr=typeof window<"u"?window:typeof WorkerGlobalScope<"u"&&self instanceof WorkerGlobalScope?self:{};var f=function(t){var e=/(?:^|\s)lang(?:uage)?-([\w-]+)(?=\s|$)/i,r=0,n={},s={manual:t.Prism&&t.Prism.manual,disableWorkerMessageHandler:t.Prism&&t.Prism.disableWorkerMessageHandler,util:{encode:function a(l){return l instanceof u?new u(l.type,a(l.content),l.alias):Array.isArray(l)?l.map(a):l.replace(/&/g,"&").replace(/"u")return null;if("currentScript"in document)return document.currentScript;try{throw new Error}catch(c){var a=(/at [^(\r\n]*\((.*):[^:]+:[^:]+\)$/i.exec(c.stack)||[])[1];if(a){var l=document.getElementsByTagName("script");for(var p in l)if(l[p].src==a)return l[p]}return null}},isActive:function(a,l,p){for(var c="no-"+l;a;){var o=a.classList;if(o.contains(l))return!0;if(o.contains(c))return!1;a=a.parentElement}return!!p}},languages:{plain:n,plaintext:n,text:n,txt:n,extend:function(a,l){var p=s.util.clone(s.languages[a]);for(var c in l)p[c]=l[c];return p},insertBefore:function(a,l,p,c){c=c||s.languages;var o=c[a],h={};for(var w in o)if(o.hasOwnProperty(w)){if(w==l)for(var g in p)p.hasOwnProperty(g)&&(h[g]=p[g]);p.hasOwnProperty(w)||(h[w]=o[w])}var F=c[a];return c[a]=h,s.languages.DFS(s.languages,function(j,z){z===F&&j!=a&&(this[j]=h)}),h},DFS:function a(l,p,c,o){o=o||{};var h=s.util.objId;for(var w in l)if(l.hasOwnProperty(w)){p.call(l,w,l[w],c||w);var g=l[w],F=s.util.type(g);F==="Object"&&!o[h(g)]?(o[h(g)]=!0,a(g,p,null,o)):F==="Array"&&!o[h(g)]&&(o[h(g)]=!0,a(g,p,w,o))}}},plugins:{},highlightAll:function(a,l){s.highlightAllUnder(document,a,l)},highlightAllUnder:function(a,l,p){var c={callback:p,container:a,selector:'code[class*="language-"], [class*="language-"] code, code[class*="lang-"], [class*="lang-"] code'};s.hooks.run("before-highlightall",c),c.elements=Array.prototype.slice.apply(c.container.querySelectorAll(c.selector)),s.hooks.run("before-all-elements-highlight",c);for(var o=0,h;h=c.elements[o++];)s.highlightElement(h,l===!0,c.callback)},highlightElement:function(a,l,p){var c=s.util.getLanguage(a),o=s.languages[c];s.util.setLanguage(a,c);var h=a.parentElement;h&&h.nodeName.toLowerCase()==="pre"&&s.util.setLanguage(h,c);var w=a.textContent,g={element:a,language:c,grammar:o,code:w};function F(z){g.highlightedCode=z,s.hooks.run("before-insert",g),g.element.innerHTML=g.highlightedCode,s.hooks.run("after-highlight",g),s.hooks.run("complete",g),p&&p.call(g.element)}if(s.hooks.run("before-sanity-check",g),h=g.element.parentElement,h&&h.nodeName.toLowerCase()==="pre"&&!h.hasAttribute("tabindex")&&h.setAttribute("tabindex","0"),!g.code){s.hooks.run("complete",g),p&&p.call(g.element);return}if(s.hooks.run("before-highlight",g),!g.grammar){F(s.util.encode(g.code));return}if(l&&t.Worker){var j=new Worker(s.filename);j.onmessage=function(z){F(z.data)},j.postMessage(JSON.stringify({language:g.language,code:g.code,immediateClose:!0}))}else F(s.highlight(g.code,g.grammar,g.language))},highlight:function(a,l,p){var c={code:a,grammar:l,language:p};if(s.hooks.run("before-tokenize",c),!c.grammar)throw new Error('The language "'+c.language+'" has no grammar.');return c.tokens=s.tokenize(c.code,c.grammar),s.hooks.run("after-tokenize",c),u.stringify(s.util.encode(c.tokens),c.language)},tokenize:function(a,l){var p=l.rest;if(p){for(var c in p)l[c]=p[c];delete l.rest}var o=new k;return v(o,o.head,a),d(a,o,l,o.head,0),A(o)},hooks:{all:{},add:function(a,l){var p=s.hooks.all;p[a]=p[a]||[],p[a].push(l)},run:function(a,l){var p=s.hooks.all[a];if(!(!p||!p.length))for(var c=0,o;o=p[c++];)o(l)}},Token:u};t.Prism=s;function u(a,l,p,c){this.type=a,this.content=l,this.alias=p,this.length=(c||"").length|0}u.stringify=function a(l,p){if(typeof l=="string")return l;if(Array.isArray(l)){var c="";return l.forEach(function(F){c+=a(F,p)}),c}var o={type:l.type,content:a(l.content,p),tag:"span",classes:["token",l.type],attributes:{},language:p},h=l.alias;h&&(Array.isArray(h)?Array.prototype.push.apply(o.classes,h):o.classes.push(h)),s.hooks.run("wrap",o);var w="";for(var g in o.attributes)w+=" "+g+'="'+(o.attributes[g]||"").replace(/"/g,""")+'"';return"<"+o.tag+' class="'+o.classes.join(" ")+'"'+w+">"+o.content+""};function y(a,l,p,c){a.lastIndex=l;var o=a.exec(p);if(o&&c&&o[1]){var h=o[1].length;o.index+=h,o[0]=o[0].slice(h)}return o}function d(a,l,p,c,o,h){for(var w in p)if(!(!p.hasOwnProperty(w)||!p[w])){var g=p[w];g=Array.isArray(g)?g:[g];for(var F=0;F=h.reach);q+=M.value.length,M=M.next){var se=M.value;if(l.length>a.length)return;if(!(se instanceof u)){var Be=1,B;if(St){if(B=y(Ct,q,a,Ft),!B||B.index>=a.length)break;var qe=B.index,ir=B.index+B[0].length,J=q;for(J+=M.value.length;qe>=J;)M=M.next,J+=M.value.length;if(J-=M.value.length,q=J,M.value instanceof u)continue;for(var Ae=M;Ae!==l.tail&&(Jh.reach&&(h.reach=mt);var Je=M.prev;ut&&(Je=v(l,Je,ut),q+=ut.length),m(l,Je,Be);var ar=new u(w,z?s.tokenize(ze,z):ze,sr,ze);if(M=v(l,Je,ar),Dt&&v(l,M,Dt),Be>1){var ft={cause:w+","+F,reach:mt};d(a,l,p,M.prev,q,ft),h&&ft.reach>h.reach&&(h.reach=ft.reach)}}}}}}function k(){var a={value:null,prev:null,next:null},l={value:null,prev:a,next:null};a.next=l,this.head=a,this.tail=l,this.length=0}function v(a,l,p){var c=l.next,o={value:p,prev:l,next:c};return l.next=o,c.prev=o,a.length++,o}function m(a,l,p){for(var c=l.next,o=0;o/,greedy:!0},prolog:{pattern:/<\?[\s\S]+?\?>/,greedy:!0},doctype:{pattern:/"'[\]]|"[^"]*"|'[^']*')+(?:\[(?:[^<"'\]]|"[^"]*"|'[^']*'|<(?!!--)|)*\]\s*)?>/i,greedy:!0,inside:{"internal-subset":{pattern:/(^[^\[]*\[)[\s\S]+(?=\]>$)/,lookbehind:!0,greedy:!0,inside:null},string:{pattern:/"[^"]*"|'[^']*'/,greedy:!0},punctuation:/^$|[[\]]/,"doctype-tag":/^DOCTYPE/i,name:/[^\s<>'"]+/}},cdata:{pattern://i,greedy:!0},tag:{pattern:/<\/?(?!\d)[^\s>\/=$<%]+(?:\s(?:\s*[^\s>\/=]+(?:\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))|(?=[\s/>])))+)?\s*\/?>/,greedy:!0,inside:{tag:{pattern:/^<\/?[^\s>\/]+/,inside:{punctuation:/^<\/?/,namespace:/^[^\s>\/:]+:/}},"special-attr":[],"attr-value":{pattern:/=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+)/,inside:{punctuation:[{pattern:/^=/,alias:"attr-equals"},{pattern:/^(\s*)["']|["']$/,lookbehind:!0}]}},punctuation:/\/?>/,"attr-name":{pattern:/[^\s>\/]+/,inside:{namespace:/^[^\s>\/:]+:/}}}},entity:[{pattern:/&[\da-z]{1,8};/i,alias:"named-entity"},/&#x?[\da-f]{1,8};/i]};f.languages.markup.tag.inside["attr-value"].inside.entity=f.languages.markup.entity;f.languages.markup.doctype.inside["internal-subset"].inside=f.languages.markup;f.hooks.add("wrap",function(t){t.type==="entity"&&(t.attributes.title=t.content.replace(/&/,"&"))});Object.defineProperty(f.languages.markup.tag,"addInlined",{value:function(e,r){var n={};n["language-"+r]={pattern:/(^$)/i,lookbehind:!0,inside:f.languages[r]},n.cdata=/^$/i;var s={"included-cdata":{pattern://i,inside:n}};s["language-"+r]={pattern:/[\s\S]+/,inside:f.languages[r]};var u={};u[e]={pattern:RegExp(/(<__[^>]*>)(?:))*\]\]>|(?!)/.source.replace(/__/g,function(){return e}),"i"),lookbehind:!0,greedy:!0,inside:s},f.languages.insertBefore("markup","cdata",u)}});Object.defineProperty(f.languages.markup.tag,"addAttribute",{value:function(t,e){f.languages.markup.tag.inside["special-attr"].push({pattern:RegExp(/(^|["'\s])/.source+"(?:"+t+")"+/\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))/.source,"i"),lookbehind:!0,inside:{"attr-name":/^[^\s=]+/,"attr-value":{pattern:/=[\s\S]+/,inside:{value:{pattern:/(^=\s*(["']|(?!["'])))\S[\s\S]*(?=\2$)/,lookbehind:!0,alias:[e,"language-"+e],inside:f.languages[e]},punctuation:[{pattern:/^=/,alias:"attr-equals"},/"|'/]}}}})}});f.languages.html=f.languages.markup;f.languages.mathml=f.languages.markup;f.languages.svg=f.languages.markup;f.languages.xml=f.languages.extend("markup",{});f.languages.ssml=f.languages.xml;f.languages.atom=f.languages.xml;f.languages.rss=f.languages.xml;(function(t){var e=/(?:"(?:\\(?:\r\n|[\s\S])|[^"\\\r\n])*"|'(?:\\(?:\r\n|[\s\S])|[^'\\\r\n])*')/;t.languages.css={comment:/\/\*[\s\S]*?\*\//,atrule:{pattern:RegExp("@[\\w-](?:"+/[^;{\s"']|\s+(?!\s)/.source+"|"+e.source+")*?"+/(?:;|(?=\s*\{))/.source),inside:{rule:/^@[\w-]+/,"selector-function-argument":{pattern:/(\bselector\s*\(\s*(?![\s)]))(?:[^()\s]|\s+(?![\s)])|\((?:[^()]|\([^()]*\))*\))+(?=\s*\))/,lookbehind:!0,alias:"selector"},keyword:{pattern:/(^|[^\w-])(?:and|not|only|or)(?![\w-])/,lookbehind:!0}}},url:{pattern:RegExp("\\burl\\((?:"+e.source+"|"+/(?:[^\\\r\n()"']|\\[\s\S])*/.source+")\\)","i"),greedy:!0,inside:{function:/^url/i,punctuation:/^\(|\)$/,string:{pattern:RegExp("^"+e.source+"$"),alias:"url"}}},selector:{pattern:RegExp(`(^|[{}\\s])[^{}\\s](?:[^{};"'\\s]|\\s+(?![\\s{])|`+e.source+")*(?=\\s*\\{)"),lookbehind:!0},string:{pattern:e,greedy:!0},property:{pattern:/(^|[^-\w\xA0-\uFFFF])(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*(?=\s*:)/i,lookbehind:!0},important:/!important\b/i,function:{pattern:/(^|[^-a-z0-9])[-a-z0-9]+(?=\()/i,lookbehind:!0},punctuation:/[(){};:,]/},t.languages.css.atrule.inside.rest=t.languages.css;var r=t.languages.markup;r&&(r.tag.addInlined("style","css"),r.tag.addAttribute("style","css"))})(f);f.languages.clike={comment:[{pattern:/(^|[^\\])\/\*[\s\S]*?(?:\*\/|$)/,lookbehind:!0,greedy:!0},{pattern:/(^|[^\\:])\/\/.*/,lookbehind:!0,greedy:!0}],string:{pattern:/(["'])(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/,greedy:!0},"class-name":{pattern:/(\b(?:class|extends|implements|instanceof|interface|new|trait)\s+|\bcatch\s+\()[\w.\\]+/i,lookbehind:!0,inside:{punctuation:/[.\\]/}},keyword:/\b(?:break|catch|continue|do|else|finally|for|function|if|in|instanceof|new|null|return|throw|try|while)\b/,boolean:/\b(?:false|true)\b/,function:/\b\w+(?=\()/,number:/\b0x[\da-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:e[+-]?\d+)?/i,operator:/[<>]=?|[!=]=?=?|--?|\+\+?|&&?|\|\|?|[?*/~^%]/,punctuation:/[{}[\];(),.:]/};f.languages.javascript=f.languages.extend("clike",{"class-name":[f.languages.clike["class-name"],{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$A-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\.(?:constructor|prototype))/,lookbehind:!0}],keyword:[{pattern:/((?:^|\})\s*)catch\b/,lookbehind:!0},{pattern:/(^|[^.]|\.\.\.\s*)\b(?:as|assert(?=\s*\{)|async(?=\s*(?:function\b|\(|[$\w\xA0-\uFFFF]|$))|await|break|case|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally(?=\s*(?:\{|$))|for|from(?=\s*(?:['"]|$))|function|(?:get|set)(?=\s*(?:[#\[$\w\xA0-\uFFFF]|$))|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)\b/,lookbehind:!0}],function:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*(?:\.\s*(?:apply|bind|call)\s*)?\()/,number:{pattern:RegExp(/(^|[^\w$])/.source+"(?:"+(/NaN|Infinity/.source+"|"+/0[bB][01]+(?:_[01]+)*n?/.source+"|"+/0[oO][0-7]+(?:_[0-7]+)*n?/.source+"|"+/0[xX][\dA-Fa-f]+(?:_[\dA-Fa-f]+)*n?/.source+"|"+/\d+(?:_\d+)*n/.source+"|"+/(?:\d+(?:_\d+)*(?:\.(?:\d+(?:_\d+)*)?)?|\.\d+(?:_\d+)*)(?:[Ee][+-]?\d+(?:_\d+)*)?/.source)+")"+/(?![\w$])/.source),lookbehind:!0},operator:/--|\+\+|\*\*=?|=>|&&=?|\|\|=?|[!=]==|<<=?|>>>?=?|[-+*/%&|^!=<>]=?|\.{3}|\?\?=?|\?\.?|[~:]/});f.languages.javascript["class-name"][0].pattern=/(\b(?:class|extends|implements|instanceof|interface|new)\s+)[\w.\\]+/;f.languages.insertBefore("javascript","keyword",{regex:{pattern:RegExp(/((?:^|[^$\w\xA0-\uFFFF."'\])\s]|\b(?:return|yield))\s*)/.source+/\//.source+"(?:"+/(?:\[(?:[^\]\\\r\n]|\\.)*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}/.source+"|"+/(?:\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.)*\])*\])*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}v[dgimyus]{0,7}/.source+")"+/(?=(?:\s|\/\*(?:[^*]|\*(?!\/))*\*\/)*(?:$|[\r\n,.;:})\]]|\/\/))/.source),lookbehind:!0,greedy:!0,inside:{"regex-source":{pattern:/^(\/)[\s\S]+(?=\/[a-z]*$)/,lookbehind:!0,alias:"language-regex",inside:f.languages.regex},"regex-delimiter":/^\/|\/$/,"regex-flags":/^[a-z]+$/}},"function-variable":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*[=:]\s*(?:async\s*)?(?:\bfunction\b|(?:\((?:[^()]|\([^()]*\))*\)|(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)\s*=>))/,alias:"function"},parameter:[{pattern:/(function(?:\s+(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)?\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\))/,lookbehind:!0,inside:f.languages.javascript},{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$a-z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*=>)/i,lookbehind:!0,inside:f.languages.javascript},{pattern:/(\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*=>)/,lookbehind:!0,inside:f.languages.javascript},{pattern:/((?:\b|\s|^)(?!(?:as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)(?![$\w\xA0-\uFFFF]))(?:(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*)\(\s*|\]\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*\{)/,lookbehind:!0,inside:f.languages.javascript}],constant:/\b[A-Z](?:[A-Z_]|\dx?)*\b/});f.languages.insertBefore("javascript","string",{hashbang:{pattern:/^#!.*/,greedy:!0,alias:"comment"},"template-string":{pattern:/`(?:\\[\s\S]|\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}|(?!\$\{)[^\\`])*`/,greedy:!0,inside:{"template-punctuation":{pattern:/^`|`$/,alias:"string"},interpolation:{pattern:/((?:^|[^\\])(?:\\{2})*)\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}/,lookbehind:!0,inside:{"interpolation-punctuation":{pattern:/^\$\{|\}$/,alias:"punctuation"},rest:f.languages.javascript}},string:/[\s\S]+/}},"string-property":{pattern:/((?:^|[,{])[ \t]*)(["'])(?:\\(?:\r\n|[\s\S])|(?!\2)[^\\\r\n])*\2(?=\s*:)/m,lookbehind:!0,greedy:!0,alias:"property"}});f.languages.insertBefore("javascript","operator",{"literal-property":{pattern:/((?:^|[,{])[ \t]*)(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*:)/m,lookbehind:!0,alias:"property"}});f.languages.markup&&(f.languages.markup.tag.addInlined("script","javascript"),f.languages.markup.tag.addAttribute(/on(?:abort|blur|change|click|composition(?:end|start|update)|dblclick|error|focus(?:in|out)?|key(?:down|up)|load|mouse(?:down|enter|leave|move|out|over|up)|reset|resize|scroll|select|slotchange|submit|unload|wheel)/.source,"javascript"));f.languages.js=f.languages.javascript;(function(){if(typeof f>"u"||typeof document>"u")return;Element.prototype.matches||(Element.prototype.matches=Element.prototype.msMatchesSelector||Element.prototype.webkitMatchesSelector);var t="Loading\u2026",e=function(E,b){return"\u2716 Error "+E+" while fetching file: "+b},r="\u2716 Error: File does not exist or is empty",n={js:"javascript",py:"python",rb:"ruby",ps1:"powershell",psm1:"powershell",sh:"bash",bat:"batch",h:"c",tex:"latex"},s="data-src-status",u="loading",y="loaded",d="failed",k="pre[data-src]:not(["+s+'="'+y+'"]):not(['+s+'="'+u+'"])';function v(E,b,_){var a=new XMLHttpRequest;a.open("GET",E,!0),a.onreadystatechange=function(){a.readyState==4&&(a.status<400&&a.responseText?b(a.responseText):a.status>=400?_(e(a.status,a.statusText)):_(r))},a.send(null)}function m(E){var b=/^\s*(\d+)\s*(?:(,)\s*(?:(\d+)\s*)?)?$/.exec(E||"");if(b){var _=Number(b[1]),a=b[2],l=b[3];return a?l?[_,Number(l)]:[_,void 0]:[_,_]}}f.hooks.add("before-highlightall",function(E){E.selector+=", "+k}),f.hooks.add("before-sanity-check",function(E){var b=E.element;if(b.matches(k)){E.code="",b.setAttribute(s,u);var _=b.appendChild(document.createElement("CODE"));_.textContent=t;var a=b.getAttribute("data-src"),l=E.language;if(l==="none"){var p=(/\.(\w+)$/.exec(a)||[,"none"])[1];l=n[p]||p}f.util.setLanguage(_,l),f.util.setLanguage(b,l);var c=f.plugins.autoloader;c&&c.loadLanguages(l),v(a,function(o){b.setAttribute(s,y);var h=m(b.getAttribute("data-range"));if(h){var w=o.split(/\r\n?|\n/g),g=h[0],F=h[1]==null?w.length:h[1];g<0&&(g+=w.length),g=Math.max(0,Math.min(g-1,w.length)),F<0&&(F+=w.length),F=Math.max(0,Math.min(F,w.length)),o=w.slice(g,F).join(`
+`),b.hasAttribute("data-start")||b.setAttribute("data-start",String(g+1))}_.textContent=o,f.highlightElement(_)},function(o){b.setAttribute(s,d),_.textContent=o})}}),f.plugins.fileHighlight={highlight:function(b){for(var _=(b||document).querySelectorAll(k),a=0,l;l=_[a++];)f.highlightElement(l)}};var A=!1;f.fileHighlight=function(){A||(console.warn("Prism.fileHighlight is deprecated. Use `Prism.plugins.fileHighlight.highlight` instead."),A=!0),f.plugins.fileHighlight.highlight.apply(this,arguments)}})()});var ts={};ur(ts,{BUILD_ID:()=>es,TempleComponent:()=>C.TempleComponent,TempleElement:()=>C.TempleElement,TempleEmitter:()=>C.TempleEmitter,TempleException:()=>C.TempleException,TempleRegistry:()=>C.TempleRegistry,children:()=>C.children,components:()=>Qr,data:()=>C.data,emitter:()=>C.emitter,props:()=>C.props,signal:()=>C.signal});var $=T(D());var Qt=T(D()),H=T(P()),oe=class extends Qt.TempleComponent{static component=["layout","Layout_9f3ab204ce271feaf6f7"];styles(){return""}template(){(0,H.classlist)().add("relative","w-full","vh","scroll-hidden");let e=(0,H.children)(),r=e.find(m=>m.nodeName.endsWith("PANEL-MAIN")),n=e.find(m=>m.nodeName.endsWith("PANEL-HEAD")),s=e.find(m=>m.nodeName.endsWith("PANEL-FOOT")),u=e.find(m=>m.nodeName.endsWith("PANEL-LEFT")),y=e.find(m=>m.nodeName.endsWith("PANEL-RIGHT")),d={head:!!n,foot:!!s,left:!!u,right:!!y},k=new Set,v={left:!1,right:!1,change:m=>k.add(m)};return r&&H.TempleRegistry.get(r).setAttribute("show",v).setAttribute("layout",d),n&&H.TempleRegistry.get(n).setAttribute("show",v).setAttribute("layout",d),s&&H.TempleRegistry.get(s).setAttribute("show",v).setAttribute("layout",d),u&&H.TempleRegistry.get(u).setAttribute("show",v).setAttribute("layout",d),y&&H.TempleRegistry.get(y).setAttribute("show",v).setAttribute("layout",d),this.toggle=m=>{v[m]=!v[m],k.forEach(A=>A())},()=>[H.TempleRegistry.createText(`
+`,!1),...this._toNodeList(e)]}};var Me=T(D()),et=T(P()),pe=class extends Me.TempleComponent{static component=["head","Head_2bf4dff19bc88ba4138b"];styles(){return""}template(){let{layout:e,show:r}=this.element.attributes,n=(0,et.classlist)(),s=u=>{this.classList.add("absolute","top-0","right-0","h-60","transition-500"),e?.left?(this.classList.remove("left-0"),this.classList.add("left-226")):this.classList.add("left-0"),r.left?(this.classList.remove("md-left-0"),this.classList.add("md-left-226")):(this.classList.remove("md-left-226"),this.classList.add("md-left-0"))};return r.change(s),s(),()=>[Me.TempleRegistry.createText(`
+`,!1),Me.TempleRegistry.createElement("header",{class:"block w-full h-full relative"},[...this._toNodeList((0,et.children)())]).element]}};var Ne=T(D()),tt=T(P()),ce=class extends Ne.TempleComponent{static component=["left","Left_f4ab589e043eee17d229"];styles(){return""}template(){let{layout:e,show:r}=this.element.attributes,n=(0,tt.classlist)(),s=u=>{this.classList.add("w-226","absolute","bottom-0","left-0","top-0","transition-500"),r.left?(this.classList.remove("md-left--226"),this.classList.add("md-left-0")):this.classList.add("md-left--226")};return r.change(s),s(),()=>[Ne.TempleRegistry.createText(`
+`,!1),Ne.TempleRegistry.createElement("aside",{class:"block w-full h-full relative"},[...this._toNodeList((0,tt.children)())]).element]}};var Ie=T(D()),rt=T(P()),de=class extends Ie.TempleComponent{static component=["right","Right_4ce97029791442c57f8d"];styles(){return""}template(){let{layout:e,show:r}=this.element.attributes,n=(0,rt.classlist)(),s=u=>{this.classList.add("w-200","absolute","right-0","transition-500"),e?.foot?(this.classList.remove("bottom-0"),this.classList.add("bottom-60")):this.classList.add("bottom-0"),e?.head?(this.classList.remove("top-0"),this.classList.add("top-60")):this.classList.add("top-0"),r.right?(this.classList.remove("md-right--200"),this.classList.add("md-right-0")):this.classList.add("md-right--200")};return r.change(s),s(),()=>[Ie.TempleRegistry.createText(`
+`,!1),Ie.TempleRegistry.createElement("aside",{class:"block w-full h-full relative"},[...this._toNodeList((0,rt.children)())]).element]}};var Oe=T(D()),st=T(P()),ue=class extends Oe.TempleComponent{static component=["main","Main_847772763f4518728ede"];styles(){return""}template(){let{layout:e,show:r}=this.element.attributes,n=(0,st.classlist)(),s=u=>{this.classList.add("absolute","transition-500"),e?.head?(this.classList.remove("top-0"),this.classList.add("top-60")):this.classList.add("top-0"),e?.foot?(this.classList.remove("bottom-0"),this.classList.add("bottom-60")):this.classList.add("bottom-0"),e?.left?(this.classList.remove("left-0"),this.classList.add("left-226")):this.classList.add("left-0"),e?.right?(this.classList.remove("right-0"),this.classList.add("right-200")):this.classList.add("right-0"),r.left?(this.classList.remove("md-left-0"),this.classList.add("md-left-226")):(this.classList.remove("md-left-226"),this.classList.add("md-left-0")),r.right?(this.classList.remove("md-right-0"),this.classList.add("md-right-200")):(this.classList.remove("md-right-200"),this.classList.add("md-right-0"))};return r.change(s),s(),()=>[Oe.TempleRegistry.createText(`
+`,!1),Oe.TempleRegistry.createElement("main",{class:"block w-full h-full relative"},[...this._toNodeList((0,st.children)())]).element]}};var nt=T(D()),fe=T(P()),me=class extends nt.TempleComponent{static component=["alert","Alert_f0fe98801b4b833c4233"];styles(){return""}template(){let{curved:e,rounded:r,pill:n,info:s,warning:u,success:y,error:d,muted:k,primary:v,color:m,secondary:A,outline:E,transparent:b,solid:_,style:a,class:l,...p}=(0,fe.props)(),c=(0,fe.component)(),o=document.createElement("div");(0,fe.children)().forEach(w=>o.appendChild(w)),c.classList.add("block"),o.classList.add("block","p-16"),e?o.classList.add("curved"):r?o.classList.add("rounded"):n&&o.classList.add("pill");let h=E?"outline":b?"transparent":"solid";return h==="outline"||h==="transparent"?(o.classList.add("bd-solid","bd-thin"),h==="outline"&&o.classList.add("bg-white"),m?(o.style.color=m,o.style.borderColor=m):s?o.classList.add("bd-info","tx-info"):u?o.classList.add("bd-warning","tx-warning"):y?o.classList.add("bd-success","tx-success"):d?o.classList.add("bd-error","tx-error"):k?o.classList.add("bd-muted","tx-muted"):v?o.classList.add("bd-primary","tx-primary"):A&&o.classList.add("bd-secondary","tx-secondary")):(o.classList.add("tx-white"),m?o.style.backgroundColor=m:s?o.classList.add("bg-info"):u?o.classList.add("bg-warning"):y?o.classList.add("bg-success"):d?o.classList.add("bg-error"):k?o.classList.add("bg-muted"):v?o.classList.add("bg-primary"):A&&o.classList.add("bg-secondary")),()=>[nt.TempleRegistry.createText(`
+`,!1),...this._toNodeList([o])]}};var V=T(D()),ge=T(P()),he=class extends V.TempleComponent{static component=["tab","Tab_5a341768ef0a010965e3"];styles(){return""}template(){let{group:e,selector:r="",active:n="",inactive:s="",style:u,class:y,...d}=(0,ge.props)(),k=(0,ge.component)(),v=n.split(" "),m=s.split(" ");k.classList.add("cursor-pointer");let A=()=>{let b=k.hasAttribute("on");k.classList.remove(...b?m:v),k.classList.add(...b?v:m),Array.from(document.querySelectorAll(r)).forEach(_=>{_.style.display=b?"block":"none"})},E=()=>{Array.from(document.querySelectorAll(`[group="${e}"]`)).forEach(b=>{let _=b.getAttribute("selector");r===_&&!b.hasAttribute("on")?(b.setAttribute("on",""),Array.from(document.querySelectorAll(r)).forEach(a=>{a.style.display="block"}),typeof b.render=="function"&&b.render()):r!==_&&b.hasAttribute("on")&&(b.removeAttribute("on"),Array.from(document.querySelectorAll(_)).forEach(a=>{a.style.display="none"}),typeof b.render=="function"&&b.render())})};return()=>[V.TempleRegistry.createText(`
+`,!1),V.TempleRegistry.createElement("a",{...d,class:"block h-full w-full",click:E,mount:A},[V.TempleRegistry.createText(`
+  `,!1),...this._toNodeList((0,ge.children)()),V.TempleRegistry.createText(`
+`,!1)]).element]}};var $e=T(D()),it=T(P()),ye=class extends $e.TempleComponent{static component=["docs","Docs_40562a7bb56d70d971df"];styles(){return""}template(){return(0,it.classlist)().add("block","w-full","h-full","scroll-y-auto","scroll-x-hidden"),()=>[$e.TempleRegistry.createText(`
+`,!1),$e.TempleRegistry.createElement("article",{class:"block p-10 tx-t-1"},[...this._toNodeList((0,it.children)())]).element]}};var i=T(D());var L=T(D()),Et=T(At()),er=T(P()),K=class extends L.TempleComponent{static component=["code","Code_6f36bc13bb6a166c7abc"];styles(){return`:host {
     display: block;
     font-size: 14px;
     line-height: 20px;
   }
   :host([inline]) {
-    display: inline;
+    display: inline !important;
   }
   :host([inline]),
   :host([inline]) > pre,
   :host([inline]) > pre > code {
-    display: inline;
+    display: inline !important;
   }
   .snippet {
     background-color: #000000;
     color: #ABB2BF;
+    height: 100%;
     margin: 0;
+    overflow: auto;
     padding: 0;
   }
 
@@ -73,155 +85,332 @@ var TempleAPI=(()=>{var kt=Object.create;var be=Object.defineProperty;var Ft=Obj
 
   .terminal {
     background-color: #000000;
+    font-family: 'Courier New', Courier, monospace;
     font-size: 15px;
+    height: 100%;
+    overflow: auto;
     padding: 10px;
   }
   .terminal span {
     color: #00FF00;
-  }`}template(){let e=this.props,{lang:r="markup",numbers:i=!1,inline:a=!1,trim:p=!1,ltrim:g=!1,rtrim:m=!1,detab:v=0}=e,_=(0,wt.children)(),w=_[0]?.textContent||"";v&&(w=w.replace(new RegExp(`\\n {${v}}`,"g"),`
-`)),p?w=w.trim():g?w=w.replace(/^\s+/,""):m&&(w=w.replace(/\s+$/,""));let E=x=>{if(!w)return;let y=Ge.default.highlight(w,Ge.default.languages[r],r);if(x.detail.target.innerHTML=y,i){let A=y.match(/\n(?!$)/g),s=A?A.length+1:1,n=new Array(s+1).join(""),l=document.createElement("span");l.setAttribute("aria-hidden","true"),l.className="line-numbers-rows",l.innerHTML=n,x.detail.target.appendChild(l)}};return()=>[T.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism.min.css"}).element,T.TempleRegistry.createText(`
-`,!1),T.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism-tomorrow.min.css"}).element,T.TempleRegistry.createText(`
-`,!1),...r==="bash"?[T.TempleRegistry.createText(`
-  `,!1),T.TempleRegistry.createElement("div",{class:"terminal"},[T.TempleRegistry.createElement("span",{},[T.TempleRegistry.createText("$",!1)]).element,T.TempleRegistry.createText(" ",!1),...this._toNodeList(_)]).element,T.TempleRegistry.createText(`
-`,!1)]:w?[,T.TempleRegistry.createText(`
-  `,!1),...i?[T.TempleRegistry.createText(`
-    `,!1),T.TempleRegistry.createElement("pre",{class:"snippet line-numbers"},[T.TempleRegistry.createElement("code",{mount:E},[]).element]).element,T.TempleRegistry.createText(`
-  `,!1)]:[,T.TempleRegistry.createText(`
-    `,!1),T.TempleRegistry.createElement("pre",{class:"snippet pad"},[T.TempleRegistry.createElement("code",{mount:E},[]).element]).element,T.TempleRegistry.createText(`
-  `,!1)],T.TempleRegistry.createText(`
-`,!1)]:[]]}};var S=$(q()),Fe=$(J()),Y=class extends S.TempleComponent{static component=["app","App_05341fddbfd1fe4f273b"];styles(){return""}template(){let{title:e,panel:r}=(0,Fe.props)(),i=`body ${r?"panel":""}`,a=r?`height:${r}px`:"";return()=>[S.TempleRegistry.createText(`
-`,!1),S.TempleRegistry.createElement("div",{class:"window"},[S.TempleRegistry.createText(`
-  `,!1),S.TempleRegistry.createElement("div",{class:"head"},[S.TempleRegistry.createText(`
-    `,!1),S.TempleRegistry.createElement("span",{class:"dot"},[]).element,S.TempleRegistry.createText(`
-    `,!1),S.TempleRegistry.createElement("span",{class:"dot"},[]).element,S.TempleRegistry.createText(`
-    `,!1),S.TempleRegistry.createElement("span",{class:"dot"},[]).element,S.TempleRegistry.createText(`
-    `,!1),S.TempleRegistry.createElement("span",{class:"title"},[...this._toNodeList(e)]).element,S.TempleRegistry.createText(`
-  `,!1)]).element,S.TempleRegistry.createText(`
-  `,!1),S.TempleRegistry.createElement("div",{class:i,style:a},[...this._toNodeList((0,Fe.children)())]).element,S.TempleRegistry.createText(`
-`,!1)]).element]}};var fe=$(q()),Se=$(J()),V=class extends fe.TempleComponent{static component=["tab","Tab_dd9d261e4f37efc3079c"];styles(){return""}template(){let{group:e,selector:r,class:i,...a}=(0,Se.props)(),p=()=>{Array.from(document.querySelectorAll(r)).forEach(m=>{m.style.display=i.indexOf("active")>-1?"block":"none"})},g=()=>{Array.from(document.querySelectorAll(`[group="${e}"]`)).forEach(m=>{let v=m.props.selector;r===v?(m.classList.add("active"),Array.from(document.querySelectorAll(r)).forEach(_=>{_.style.display="block"})):(m.classList.remove("active"),Array.from(document.querySelectorAll(v)).forEach(_=>{_.style.display="none"}))})};return()=>[fe.TempleRegistry.createText(`
-`,!1),fe.TempleRegistry.createElement("a",{...a,click:g,mount:p},[...this._toNodeList((0,Se.children)())]).element]}};var N=$(q()),Q=$(J()),K=class extends N.TempleComponent{static component=["alert","Alert_6b81bcb0566ce7f0cd2d"];styles(){return`:host {
-    --black: #222222;
-    --white: #FCFCFC;
-    --info: #1474FC;
-    --error: #DC3545;
-    --warning: #FF7B07;
-    --success: #28A745;
-    --muted: #999999;
-    --primary: #E49F1A;
-    --secondary: #DA532C;
-  }
+  }`}template(){let e=this.props,{lang:r="markup",numbers:n=!1,inline:s=!1,trim:u=!1,ltrim:y=!1,rtrim:d=!1,detab:k=0}=e,v=(0,er.children)(),m=v[0]?.textContent||"";k&&(m=m.replace(new RegExp(`\\n {${k}}`,"g"),`
+`)),u?m=m.trim():y?m=m.replace(/^\s+/,""):d&&(m=m.replace(/\s+$/,""));let A=E=>{if(!m)return;let b=Et.default.highlight(m,Et.default.languages[r],r);if(E.detail.target.innerHTML=b,n){let _=b.match(/\n(?!$)/g),a=_?_.length+1:1,l=new Array(a+1).join(""),p=document.createElement("span");p.setAttribute("aria-hidden","true"),p.className="line-numbers-rows",p.innerHTML=l,E.detail.target.appendChild(p)}};return()=>[L.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism.min.css"}).element,L.TempleRegistry.createText(`
+`,!1),L.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism-tomorrow.min.css"}).element,L.TempleRegistry.createText(`
+`,!1),...r==="bash"?[L.TempleRegistry.createText(`
+  `,!1),L.TempleRegistry.createElement("div",{class:"terminal"},[L.TempleRegistry.createElement("span",{},[L.TempleRegistry.createText("$",!1)]).element,L.TempleRegistry.createText(" ",!1),...this._toNodeList(v)]).element,L.TempleRegistry.createText(`
+`,!1)]:m?[,L.TempleRegistry.createText(`
+  `,!1),...n?[L.TempleRegistry.createText(`
+    `,!1),L.TempleRegistry.createElement("pre",{class:"snippet line-numbers"},[L.TempleRegistry.createElement("code",{mount:A},[]).element]).element,L.TempleRegistry.createText(`
+  `,!1)]:[,L.TempleRegistry.createText(`
+    `,!1),L.TempleRegistry.createElement("pre",{class:"snippet pad"},[L.TempleRegistry.createElement("code",{mount:A},[]).element]).element,L.TempleRegistry.createText(`
+  `,!1)],L.TempleRegistry.createText(`
+`,!1)]:[,L.TempleRegistry.createText(`
+  `,!1),L.TempleRegistry.createElement("span",{},[L.TempleRegistry.createText("????",!1)]).element,L.TempleRegistry.createText(`
+`,!1)],L.TempleRegistry.createText(`
 
-  /* Text Colors
-  ---------------------------------*/
-  .tx-white, .tx-white a {
-    color: var(--info);
-  }
-  .tx-white, .tx-white a {
-    color: var(--white);
-  }
-  .tx-error, .tx-error a {
-    color: var(--error);
-  }
-  .tx-warning, .tx-warning a {
-    color: var(--warning);
-  }
-  .tx-success, .tx-success a {
-    color: var(--success);
-  }
-  .tx-muted, .tx-muted a {
-    color: var(--muted);
-  }
-  .tx-primary, .tx-primary a {
-    color: var(--primary);
-  }
-  .tx-secondary, .tx-secondary a {
-    color: var(--secondary);
-  }
+`,!1)]}};var Q=T(P());var He={Asset:{type:{kind:"property",list:!1,type:["text/html","text/javascript","text/css","text/plain"],description:"The MIME type of the build file asset"},content:{kind:"property",list:!1,type:"string",description:"The source code of the build file asset."}},Path:{path:{kind:"property",list:!1,type:"string",description:"The file path",example:"'/path/to/file'"},type:{kind:"property",list:!1,type:"string",description:"The type of path.",example:"'file'"}},Config:{brand:{kind:"property",list:!1,type:"string",description:"The brand prefixed before the component tag name.",example:"'temple'"},cwd:{kind:"property",list:!1,type:"string",description:"The project's current working directory (cwd).",example:"'/path/to/project'"},fs:{kind:"property",list:!1,type:"FileSystem",description:"The file system being used to read/write files.",example:`import fs from 'fs';
 
-  /* Borders
-  ---------------------------------*/
-  .curved {
-    border-radius: 5px;
-  }
-  .rounded {
-    border-radius:12px;
-  }
-  .pill {
-    border-radius: 10000px;
-  }
-  .solid {
-    border-style: solid;
-  }
-  .thin {
-    border-width: 1px;
-  }
+fs`},emitter:{kind:"property",list:!1,type:"EventEmitter",description:"The NodeJS EventEmitter instance being used.",example:`import EventEmitter from 'events';
 
-  .bd-info {
-    border-color: var(--info);
-  }
-  .bd-error {
-    border-color: var(--error);
+new EventEmitter();`},"name?":{kind:"property",list:!1,type:"string",description:"Custom name of component."},"type?":{kind:"property",list:!1,type:["document","component","template"],description:"Type of component"},"minify?":{kind:"property",list:!1,type:"boolean",description:"Whether to minify the generated JavaScript code."},"tsconfig?":{kind:"property",list:!1,type:"string",description:"The location of the used tsconfig.json.",example:"'/path/to/tsconfig.json'"},"component_extname?":{kind:"property",list:!1,type:"string",description:"The component file extension.",example:"'.tml'"},"document_extname?":{kind:"property",list:!1,type:"string",description:"The document file extension.",example:"'.dtml'"}},Import:{typeOnly:{kind:"property",list:!1,type:"boolean",description:"Should import as type only.",example:"import type { Foo } from 'bar';"},"names?":{kind:"property",list:!0,type:"string",description:"All the names imported",example:"import { Foo, Bar } from 'foobar';"},default:{kind:"property",list:!1,type:"string",description:"The default import name",example:"import foo from 'bar';"},source:{kind:"property",list:!1,type:"string",description:"The file path where names are imported from.",example:"import * from 'foobar';"}},Build:{source:{kind:"property",list:!1,type:"string",description:"Returns the generated JavaScript source code.",example:"compiler.import('./docs/api.dtml').source; //server js code"},TempleDocument:{kind:"property",list:!1,type:"ServerDocumentClass",description:"Returns a server document class that can be instantiated.",example:"new (compiler.import('./docs/api.dtml').TempleDocument);"},document:{kind:"property",list:!1,type:"ServerDocument",description:"Returns the default instantiated document used to render the final HTML markup.",example:"compiler.import('./docs/api.dtml').document.render(); //..."}},CacheOptions:{buildPath:{kind:"property",list:!1,type:"string",description:"The absolute path the build directory",example:"'/path/to/build'"},"manifestFile?":{kind:"property",list:!1,type:"string",description:"The name of the manifest file.",example:"'manifest.json'"},"environment?":{kind:"property",list:!1,type:"string",description:"The environment mode that will determine the cache strategy.",example:"'production' | 'development'"}},Component:{ast:{kind:"property",list:!1,type:"AST",description:"Returns an abstract syntax tree (AST) interpretation of the component.",example:"component.ast.markup;"},brand:{kind:"property",list:!1,type:"string",description:"Returns the brand prefixed before the component tag name.",example:"component.brand; //--> 'temple'"},classname:{kind:"property",list:!1,type:"string",description:"Returns the suggested class name of the component.",example:"component.classname; //--> 'Button_abc123'"},components:{kind:"property",list:!0,type:"Component",description:"Returns a list of child components imported by this component.",example:"component.components[0].brand; //--> 'temple'"},contents:{kind:"property",list:!1,type:"string",description:"Returns the raw temple source code.",example:"component.contents;"},cwd:{kind:"property",list:!1,type:"string",description:"Returns the project's current working directory (cwd).",example:"component.cwd; //--> '/path/to/project'"},dependencies:{kind:"property",list:!0,type:"{ path: string, type: string }",description:"Returns all the files this component imports sorted by type.",example:"component.dependencies; //--> [{ type: 'file', path: './random/file' }, ...]"},dirname:{kind:"property",list:!1,type:"string",description:"Returns the directory name where this component file exists.",example:"component.dirname;"},fs:{kind:"property",list:!1,type:"FileSystem",description:"Returns the file system being used to read/write files.",example:"component.fs;"},id:{kind:"property",list:!1,type:"string",description:"Returns a unique component ID used for build files.",example:"component.id;"},imports:{kind:"property",list:!0,type:"Import",description:"Returns the files imported by this component. This does not include any component files.",example:"component.imports;"},markup:{kind:"property",list:!0,type:"Token",description:"Returns the markup abstract syntax tree.",example:"component.markup;"},loader:{kind:"property",list:!1,type:"FileLoader",description:"Returns the file loader used to resolve paths of imported files.",example:"component.loader.absolute('./path/to/some/file');"},parent:{kind:"property",list:!1,type:"Component|null",description:"Returns the parent component, if any.",example:"component.parent;"},registry:{kind:"property",list:!1,type:"Record",description:"Returns all child components and sub-child components.",example:"component.registry;"},relative:{kind:"property",list:!1,type:"string",description:"Returns the source file path relative to the current working directory (cwd).",example:"component.contents;"},source:{kind:"property",list:!1,type:"string",description:"Returns the source file path. This may or may not be the absolute path.",example:"component.source;"},scripts:{kind:"property",list:!0,type:"string",description:"Returns all the collective JavaScript in the temple source file.",example:"component.scripts;"},styles:{kind:"property",list:!0,type:"string",description:"Returns all the collective CSS styles in the temple source file.",example:"component.styles;"},tagname:{kind:"property",list:!1,type:"string",description:"Returns the suggested HTML tag name.",example:"component.tagname;"},type:{kind:"property",list:!1,type:["document","component","template"],description:"Returns type of component. Will transpile depending on the type.",example:"component.type;"}},EventEmitter:{render:{kind:"event",params:{builder:{kind:"property",list:!1,type:"DocumentBuilder"},build:{kind:"property",list:!1,type:"Build"},props:{kind:"property",list:!1,type:"Hash"}},data:{kind:"property",list:!1,type:"string"},description:"Triggers before the document is rendered.",example:`compiler.emitter.on('render', e => {
+  const { builder, build, props } = e.params;
+  //...
+  e.data = 'new html...';
+});`},rendered:{kind:"event",params:{builder:{kind:"property",list:!1,type:"DocumentBuilder"},build:{kind:"property",list:!1,type:"Build"},props:{kind:"property",list:!1,type:"Hash"},html:{kind:"property",list:!1,type:"string"}},data:{kind:"property",list:!1,type:"string"},description:"Triggers after the document is rendered.",example:`compiler.emitter.on('rendered', e => {
+  const { builder, build, props, html } = e.params;
+  //...
+  e.data = 'new html...';
+});`},build:{kind:"event",params:{builder:{kind:"property",list:!1,type:"DocumentBuilder"}},data:{kind:"property",list:!1,type:"string"},description:"Triggers before the document is built.",example:`compiler.emitter.on('build', e => {
+  const { builder } = e.params;
+  //...
+  e.data = 'new temple source...';
+});`},built:{kind:"event",params:{builder:{kind:"property",list:!1,type:"DocumentBuilder"},build:{kind:"property",list:!1,type:"Build"}},data:{kind:"property",list:!1,type:"Build"},description:"Triggers after the document is built.",example:`compiler.emitter.on('built', e => {
+  const { builder, build } = e.params;
+  //...
+  e.data = { ...build };
+});`},"build-client":{kind:"event",params:{builder:{kind:"property",list:!1,type:"DocumentBuilder"}},data:{kind:"property",list:!1,type:"string"},description:"Triggers before the client js is rendered.",example:`compiler.emitter.on('build-client', e => {
+  const { builder } = e.params;
+  //...
+  e.data = 'new temple source...';
+});`},"built-client":{kind:"event",params:{builder:{kind:"property",list:!1,type:"DocumentBuilder"},build:{kind:"property",list:!1,type:"Build"}},data:{kind:"property",list:!1,type:"string"},description:"Triggers after the client js is rendered.",example:`compiler.emitter.on('built-client', e => {
+  const { builder, build } = e.params;
+  //...
+  e.data = 'new client js...';
+});`},"build-markup":{kind:"event",params:{builder:{kind:"property",list:!1,type:"DocumentBuilder"}},data:{kind:"property",list:!1,type:"string"},description:"Triggers before markup is rendered.",example:`compiler.emitter.on('build-markup', e => {
+  const { builder } = e.params;
+  //...
+  e.data = 'new temple source...';
+});`},"built-markup":{kind:"event",params:{builder:{kind:"property",list:!1,type:"DocumentBuilder"},build:{kind:"property",list:!1,type:"Build"}},data:{kind:"property",list:!1,type:"string"},description:"Triggers after markup is rendered.",example:`compiler.emitter.on('built-markup', e => {
+  const { builder, build } = e.params;
+  //...
+  e.data = 'new markup...';
+});`},"build-server":{kind:"event",params:{builder:{kind:"property",list:!1,type:"DocumentBuilder"}},data:{kind:"property",list:!1,type:"string"},description:"Triggers before the server js is rendered.",example:`compiler.emitter.on('build-server', e => {
+  const { builder } = e.params;
+  //...
+  e.data = 'new temple source...';
+});`},"built-server":{kind:"event",params:{builder:{kind:"property",list:!1,type:"DocumentBuilder"},build:{kind:"property",list:!1,type:"Build"}},data:{kind:"property",list:!1,type:"string"},description:"Triggers after the server js is rendered.",example:`compiler.emitter.on('built-server', e => {
+  const { builder, build } = e.params;
+  //...
+  e.data = 'new server js...';
+});`},"build-styles":{kind:"event",params:{builder:{kind:"property",list:!1,type:"DocumentBuilder"}},data:{kind:"property",list:!1,type:"string"},description:"Triggers before the css styles are rendered.",example:`compiler.emitter.on('build-styles', e => {
+  const { builder } = e.params;
+  //...
+  e.data = 'new temple source...';
+});`},"built-styles":{kind:"event",params:{builder:{kind:"property",list:!1,type:"DocumentBuilder"},build:{kind:"property",list:!1,type:"Build"}},data:{kind:"property",list:!1,type:"string"},description:"Triggers after the css styles is rendered.",example:`compiler.emitter.on('built-styles', e => {
+  const { builder, build } = e.params;
+  //...
+  e.data = 'new css...';
+});`},"manifest-load":{kind:"event",params:{manifest:{kind:"property",list:!1,type:"DocumentManifest"},map:{kind:"property",list:!1,type:"Map"}},data:{kind:"property",list:!1,type:"Map"},description:"Triggers before the manifest is loaded.",example:`compiler.emitter.on('manifest-load', e => {
+  const { manifest, map } = e.params;
+  //...
+  e.data = new Map();
+});`},"manifest-resolve":{kind:"event",params:{manifest:{kind:"property",list:!1,type:"DocumentManifest"},id:{kind:"property",list:!1,type:"string"}},description:"Triggers before a build ID is resolved.",example:`compiler.emitter.on('manifest-resolve', e => {
+  const { manifest, id } = e.params;
+  //...
+});`},"manifest-resolved":{kind:"event",params:{manifest:{kind:"property",list:!1,type:"DocumentManifest"},id:{kind:"property",list:!1,type:"string"},path:{kind:"property",list:!1,type:"string"}},data:{kind:"property",list:!1,type:"Map"},description:"Triggers after a build ID/entry is set.",example:`compiler.emitter.on('manifest-resolved', e => {
+  const { manifest, id, path } = e.params;
+  //...
+});`},"manifest-unresolved":{kind:"event",params:{manifest:{kind:"property",list:!1,type:"DocumentManifest"},id:{kind:"property",list:!1,type:"string"},path:{kind:"property",list:!1,type:"string|undefined"}},data:{kind:"property",list:!1,type:"Map"},description:"Triggers after a build ID is deleted.",example:`compiler.emitter.on('manifest-unresolved', e => {
+  const { manifest, id, path } = e.params;
+  //...
+});`}},DocumentManifest:{emitter:{kind:"property",list:!1,type:"EventEmitter",description:"The NodeJS EventEmitter instance being used.",example:`compiler.manifest.emitter.on('render', e => {
+  console.log(e.params);
+});`},registry:{kind:"property",list:!1,type:"Map",description:"The manifest registry used to map build IDs to document entry files.",example:"compiler.manifest.registry.entries();"},builder:{kind:"function",async:!1,args:[{kind:"property",list:!1,name:"id",type:"string"}],returns:{kind:"property",list:!1,type:"DocumentBuilder"},description:"Returns a document builder given the build id.",example:"compiler.manifest.builder('abc123');"},delete:{kind:"function",async:!1,args:[{kind:"property",list:!1,name:"id",type:"string"}],returns:{kind:"property",list:!1,type:"DocumentManifest"},description:"Removes an entry file from the manifest given the build id.",example:"compiler.manifest.delete('abc123');"},entries:{kind:"function",async:!1,args:[],returns:{kind:"property",list:!0,type:"[ string, string ]"},description:"Returns an array of build IDs and entry file paths.",example:"compiler.manifest.entries();"},get:{kind:"function",async:!1,args:[{kind:"property",name:"id",type:"string"}],returns:{kind:"property",list:!1,type:"string"},description:"Returns the entry file path given the build id.",example:"compiler.manifest.get('abc123');"},has:{kind:"function",async:!1,args:[{kind:"property",name:"id",type:"string"}],returns:{kind:"property",list:!1,type:"boolean"},description:"Returns true if the build id exists in the manifest.",example:"compiler.manifest.has('abc123');"},load:{kind:"function",async:!1,args:[{kind:"property",name:"manifest",type:"Record"}],returns:{kind:"property",list:!1,type:"DocumentManifest"},description:"Loads an entire manifest object to the registry.",example:"compiler.manifest.load({ abc123: '/path/to/entry.dtml' });"},keys:{kind:"function",async:!1,args:[],returns:{kind:"property",list:!0,type:"string"},description:"Returns an array of build IDs.",example:"compiler.manifest.keys();"},set:{kind:"function",async:!1,args:[{kind:"property",name:"id",type:"string"},{kind:"property",name:"path",type:"string"}],returns:{kind:"property",list:!1,type:"DocumentManifest"},description:"Sets an entry file path to the manifest given the build id.",example:"compiler.manifest.set('abc123', '/path/to/entry.dtml');"},toJson:{kind:"function",async:!1,args:[],returns:{kind:"property",list:!1,type:"string"},description:"Returns the manifest as a JSON string.",example:"compiler.manifest.toJson();"},values:{kind:"function",async:!1,args:[],returns:{kind:"property",list:!0,type:"string"},description:"Returns an array of entry file paths.",example:"compiler.manifest.values();"}},DocumentTranspiler:{directive:{kind:"function",async:!1,args:[{kind:"property",name:"directive",type:"DirectiveInterface"}],returns:{kind:"property",list:!1,type:"DocumentTranspiler"},description:"Adds a directive that transpiles custom markup tags like if/elif/else, each, try/catch.",example:"compiler.fromSource('./docs/api.dtml').transpiler.directive(CustomDirective);"},transpile:{kind:"function",args:[],returns:{kind:"property",list:!1,type:"SourceFile"}},description:"Converts a temple file to server-side JavaScript.",example:"compiler.fromSource('./docs/api.dtml').transpiler.transpile();"},DocumentBuilder:{document:{kind:"property",list:!1,type:"Component",description:"Returns a document component with various meta information, used for transpilation.",example:"compiler.fromSource('./docs/api.dtml').document.classname; //--> 'Index_abc123'"},emitter:{kind:"property",list:!1,type:"EventEmitter",description:"The NodeJS EventEmitter instance being used.",example:`compiler.fromSource('./docs/api.dtml').emitter.on('render', e => {
+  console.log(e.params);
+});`},extnames:{kind:"property",list:!0,type:"string",description:"Returns the file extensions that are recognized to parse as Temple components.",example:"compiler.fromSource('./docs/api.dtml').extnames; //--> [ 'tml', 'dtml' ]"},transpiler:{kind:"property",list:!1,type:"DocumentTranspiler",description:"Returns a transpiler used to convert a temple file to server-side JavaScript.",example:"compiler.fromSource('./docs/api.dtml').transpiler.transpile();"},tsconfig:{kind:"property",list:!1,type:"string",description:"Returns the location of the used tsconfig.json.",example:"compiler.fromSource('./docs/api.dtml').tsconfig; //--> /path/to/tsconfig.json"},build:{kind:"function",async:!0,args:[],returns:{kind:"property",list:!1,type:"Build"},description:"Generates the server-side component and brings it into the runtime.",example:"compiler.fromSource('./docs/api.dtml').build();"},client:{kind:"function",async:!0,args:[],returns:{kind:"property",list:!1,type:"string"},description:"Generates the browser-side JavaScript.",example:"compiler.fromSource('./docs/api.dtml').client(); //client js code"},component:{kind:"function",async:!0,args:[],returns:{kind:"property",list:!1,type:"string"},description:"Generates the source file as an independent component.",example:"compiler.fromSource('./docs/my-button.tml').component(); //component js code"},markup:{kind:"function",async:!0,args:[],returns:{kind:"property",list:!1,type:"string"},description:"Generates the html markup.",example:"compiler.fromSource('./docs/api.dtml').markup(); //..."},server:{kind:"function",async:!0,args:[],returns:{kind:"property",list:!1,type:"string"},description:"Generates the server-side JavaScript.",example:"compiler.fromSource('./docs/api.dtml').markup(); //server js code"},styles:{kind:"function",async:!0,args:[],returns:{kind:"property",list:!1,type:"string"},description:"Generates the css styles.",example:"compiler.fromSource('./docs/api.dtml').styles(); //css code"}},ServerDocumentClass:{component:{kind:"property",list:!1,type:"[ string, string ]",description:"Returns the component tag name and class name.",example:"compiler.import('./docs/api.dtml').TempleDocument.component; //--> [ 'tui-button', 'TuiButton_abc123' ]"},new:{kind:"function",args:[],returns:{kind:"property",list:!1,type:"ServerDocument"},description:"Instantiates the server document class on the server-side used to render the final HTML.",example:"new (compiler.import('./docs/api.dtml').TempleDocument);"}},ServerDocument:{id:{kind:"function",args:[],returns:{kind:"property",list:!1,type:"string"},description:"Returns a unique document ID used to map the build cache.",example:"compiler.import('./docs/api.dtml').document.id(); //--> 'abc123'"},styles:{kind:"function",args:[],returns:{kind:"property",list:!1,type:"string"},description:"Returns the css styles for this document.",example:"compiler.import('./docs/api.dtml').document.styles(); //css styles"},template:{template:"function",args:[],returns:{kind:"property",list:!0,type:"Element"},description:"Returns an array of Element children and sub-children.",example:"compiler.import('./docs/api.dtml').document.template();"},render:{kind:"function",args:[{kind:"property",name:"props",type:"Record"}],returns:{kind:"property",list:!1,type:"string"},description:"Returns the final document HTML markup.",example:"compiler.import('./docs/api.dtml').document.render();"}},TempleOptions:{"brand?":{kind:"property",list:!1,type:"string",description:"The brand prefixed before the component tag name.",example:"const compiler = temple({ brand: 'temple' });"},"cwd?":{kind:"property",list:!1,type:"string",description:"The project's current working directory (cwd).",example:"const compiler = temple({ cwd: '/path/to/project' });'"},"fs?":{kind:"property",list:!1,type:"FileSystem",description:"The file system being used to read/write files.",example:`import fs from 'fs';
+
+const compiler = temple({ fs });'`},"emitter?":{kind:"property",list:!1,type:"EventEmitter",description:"The NodeJS EventEmitter instance being used.",example:`import emitter from 'events';
+
+const compiler = temple({ emitter });'`},"minify?":{kind:"property",list:!1,type:"boolean",description:"Whether to minify the generated JavaScript code.",example:"const compiler = temple({ minify: true });'"},"tsconfig?":{kind:"property",list:!1,type:"string",description:"The location of the used tsconfig.json.",example:"const compiler = temple({ tsconfig: '/path/to/tsconfig.json' });'"},"component_extname?":{kind:"property",list:!1,type:"string",description:"The component file extension.",example:"const compiler = temple({ component_extname: '.tml' });'"},"document_extname?":{kind:"property",list:!1,type:"string",description:"The document file extension.",example:"const compiler = temple({ document_extname: '.dtml' });'"}},TempleCompiler:{config:{kind:"property",list:!1,type:"Config",description:"The Temple configuration",example:"compiler.config.brand; //--> 'temple'"},fs:{kind:"property",list:!1,type:"FileSystem",description:"The file system being used.",example:"compiler.fs.readFileSync('some/file', 'utf8');"},emitter:{kind:"property",list:!1,type:"EventEmitter",description:"The NodeJS EventEmitter instance being used.",example:`compiler.emitter.on('render', e => {
+  console.log(e.params);
+});`},manifest:{kind:"property",list:!1,type:"DocumentManifest",description:"The manifest registry used to map build IDs to document entry files.",example:"compiler.manifest.entries();"},component:{kind:"function",args:[],returns:{kind:"property",list:!1,type:"Component"}},fromId:{kind:"function",args:[{kind:"property",list:!1,name:"id",type:"string"}],returns:{kind:"property",list:!1,type:"DocumentBuilder"},description:"Returns a new DocumentBuilder instance given a build ID.",example:"compiler.fromId('abc123').build();"},fromCache:{kind:"function",args:[{kind:"property",list:!1,name:"cacheFile",type:"string"}],returns:{kind:"property",list:!1,type:"Build"},description:"Returns build information from a compiled template.",example:"compiler.fromCache('/path/to/build/abc123.js').document.render();"},fromSource:{kind:"function",args:[{kind:"property",list:!1,name:"sourceFile",type:"string"}],returns:{kind:"property",list:!1,type:"DocumentBuilder"},description:"Returns a new DocumentBuilder instance given a template source file.",example:"compiler.fromSource('./docs/api.dtml').build();"},use:{kind:"function",args:[{kind:"property",list:!1,name:"options",type:"Function"}],returns:{kind:"property",list:!1,type:"TempleCompiler"},description:"Enables a default build cache strategy.",example:"compiler.use(plugin)"},asset:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"assetFile",type:"string"}],returns:{kind:"property",list:!1,type:"Asset"},description:"Returns a compiled build asset, given an asset file name.",example:"compiler.asset('abc123.css'); //--> { type: 'text/css', content: '...' }"},client:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"sourceFile",type:"string"}],returns:{kind:"property",list:!1,type:"string"},description:"Returns a compiled client script, given the the template source file.",example:"compiler.client('./docs/api.dtml'); //client script"},import:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"sourceFile",type:"string"}],returns:{kind:"property",list:!1,type:"Build"},description:"Returns build information, given the the template source file.",example:"compiler.import('/path/to/build/abc123.js').document.render();"},markup:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"sourceFile",type:"string"}],returns:{kind:"property",list:!1,type:"string"},description:"Returns a compiled markup, given the the template source file.",example:"compiler.markup('./docs/api.dtml'); //--> ..."},render:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"sourceFile",type:"string"},{kind:"property",list:!1,name:"props",type:"Hash"}],returns:{kind:"property",list:!1,type:"string"},description:"Returns the final HTML markup, given the the template source file.",example:`compiler.render('./docs/api.dtml', {
+  title: 'API Documentation'
+});`},server:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"sourceFile",type:"string"}],returns:{kind:"property",list:!1,type:"string"},description:"Returns compiled server code, given the the template source file.",example:"compiler.server('./docs/api.dtml'); // server script"},styles:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"sourceFile",type:"string"}],returns:{kind:"property",list:!1,type:"string"},description:"Returns compiled css styles, given the the template source file.",example:"compiler.styles('./docs/api.dtml'); //css styles"}},TempleComponent:{attr:{kind:"property",list:!1,type:"Hash",description:"Returns only the valid HTML tag attributes (string and true).",example:"this.attr; //--> { disabled: true, type: 'button' }"},props:{kind:"property",list:!1,type:"Hash",description:"Returns all the attributes assigned to the component.",example:"this.props; //--> { disabled: true, count: 4, click: handleClick }"},metadata:{kind:"property",list:!1,type:"[ string, string ]",description:"Returns the tag and class name of the component.",example:"this.metadata; //--> [ 'fancy-button', 'FancyButton_abc123' ]"},styles:{kind:"function",args:[],returns:{kind:"property",list:!1,type:"string"},description:"Returns the css styles used in the component.",example:"this.styles(); //css styles"},template:{kind:"function",args:[],returns:{kind:"property",list:!1,type:"Node[]"},description:"Returns a function that returns an array of elements, text nodes and web components",example:"this.template(); //--> () => [ Element, Text, Element, ... ]"},render:{kind:"function",args:[],returns:{kind:"property",list:!1,type:"string"},description:"Renders the children and returns the final HTML markup.",example:"this.render(); //--> '
...
'"}},TempleRegistry:{elements:{kind:"property",list:!1,type:"Map",description:"Returns a map of elements used in the DOM.",example:"TempleAPI.TempleRegistry.elements.get(component);"},createComponent:{kind:"function",args:[{kind:"property",list:!1,name:"tagname",type:"string"},{kind:"property",list:!1,name:"component",type:"TempleComponent"},{kind:"property",list:!1,name:"props",type:"Hash"},{kind:"property",list:!1,name:"children>",type:"Node[]"}],returns:{kind:"property",list:!1,type:"TempleElement"},description:"Creates a TempleElement from a web component class.",example:"TempleAPI.TempleRegistry.createComponent('fancy-button', TempleComponent, { title: 'Hello' }, children);"},createElement:{kind:"function",args:[{kind:"property",list:!1,name:"tagname",type:"string"},{kind:"property",list:!1,name:"props",type:"Hash"},{kind:"property",list:!1,name:"children>",type:"Node[]"}],returns:{kind:"property",list:!1,type:"TempleElement"},description:"Creates a TempleElement from a string tag name.",example:"TempleAPI.TempleRegistry.createElement('a', { href: '/' }, children);"},createText:{kind:"function",args:[{kind:"property",list:!1,name:"text",type:"string"}],returns:{kind:"property",list:!1,type:"TextNode"},description:"Creates a TextNode from a raw string.",example:"TempleAPI.TempleRegistry.createText('foo');"},get:{kind:"function",args:[{kind:"property",list:!1,name:"element",type:"Element"}],returns:{kind:"property",list:!1,type:"TempleElement"},description:"Returns a TempleElement given a DOM element.",example:"TempleAPI.TempleRegistry.get(element)"},has:{kind:"function",args:[{kind:"property",list:!1,name:"element",type:"Element"}],returns:{kind:"property",list:!1,type:"boolean"},description:"Returns true if the given element exists in the registry",example:"TempleAPI.TempleRegistry.has(element)"},map:{kind:"function",args:[{kind:"property",list:!1,name:"callback",type:"Function"}],returns:{kind:"property",list:!0,type:"T"},description:"Like array map for registry returns an array of whatever the callback returns.",example:"TempleAPI.TempleRegistry.map((temple, element) => [temple, element]);"},register:{kind:"function",args:[{kind:"property",list:!1,name:"element",type:"TempleElement"},{kind:"property",list:!1,name:"props",type:"Hash"}],returns:{kind:"property",list:!1,type:"TempleElement"},description:"Registers a TempleElement to the registry.",example:"TempleAPI.TempleRegistry.register(element, { foo: 'bar' });"}},TempleElement:{attributes:{kind:"property",list:!1,type:"Hash",description:"Returns all the attributes assigned to the element.",example:"element.attributes; //--> { href: '/', title: 'Home' }"},element:{kind:"property",list:!1,type:"Element",description:"Returns the DOM element.",example:"element.element; //--> "},hasAttribute:{kind:"function",args:[{kind:"property",list:!1,name:"name",type:"string"}],returns:{kind:"property",list:!1,type:"boolean"},description:"Returns true if the element has the given attribute.",example:"element.hasAttribute('href');"},getAttribute:{kind:"function",args:[{kind:"property",list:!1,name:"name",type:"string"}],returns:{kind:"property",list:!1,type:"unknown"},description:"Returns the value of the given attribute.",example:"element.getAttribute('href');"},removeAttribute:{kind:"function",args:[{kind:"property",list:!1,name:"name",type:"string"}],returns:{kind:"property",list:!1,type:"TempleElement"},description:"Removes the given attribute from the element.",example:"element.removeAttribute('href');"},setAttribute:{kind:"function",args:[{kind:"property",list:!1,name:"name",type:"string"},{kind:"property",list:!1,name:"value",type:"string"}],returns:{kind:"property",list:!1,type:"TempleElement"},description:"Sets the given attribute to the element.",example:"element.setAttribute('href', '/');"},setAttributes:{kind:"function",args:[{kind:"property",list:!1,name:"attributes",type:"Hash"}],returns:{kind:"property",list:!1,type:"TempleElement"},description:"Sets multiple attributes to the element.",example:"element.setAttributes({ href: '/', title: 'Home' });"}},TempleEmitter:{emit:{kind:"function",args:[{kind:"property",list:!1,name:"event",type:"string"},{kind:"property",list:!1,name:"target",type:"T"}],returns:{kind:"property",list:!1,type:"TempleEmitter"},description:"Emits an event with optional parameters.",example:"emitter.emit('click', { x: 10, y: 20 });"},unbind:{kind:"function",args:[{kind:"property",list:!1,name:"event",type:"string"},{kind:"property",list:!1,name:"listener",type:"Function"}],returns:{kind:"property",list:!1,type:"TempleEmitter"},description:"Removes an event listener.",example:"emitter.unbind('click', handleClick);"},on:{kind:"function",args:[{kind:"property",list:!1,name:"event",type:"string"},{kind:"property",list:!1,name:"listener",type:"Function"}],returns:{kind:"property",list:!1,type:"TempleEmitter"},description:"Adds an event listener.",example:"emitter.on('click', handleClick);"},once:{kind:"function",args:[{kind:"property",list:!1,name:"event",type:"string"},{kind:"property",list:!1,name:"listener",type:"Function"}],returns:{kind:"property",list:!1,type:"TempleEmitter"},description:"Adds an event listener that only fires once.",example:"emitter.once('click', handleClick);"}},TempleAPI:{BUILD_ID:{kind:"property",list:!1,type:"string",description:"The unique build ID used to map the build cache.",example:"TempleAPI.BUILD_ID; //--> 'abc123'"},TempleComponent:{kind:"property",list:!1,type:"TempleComponent",description:"The Temple component class used to create custom elements.",example:"new TempleAPI.TempleComponent();"},TempleElement:{kind:"property",list:!1,type:"TempleElement",description:"The Temple element class used to create custom elements.",example:`new TempleAPI.TempleElement(
+  document.createElement('a'),
+  { href: '/' }
+); ]`},TempleEmitter:{kind:"property",list:!1,type:"TempleEmitter",description:"The Temple emitter class used to create custom events.",example:"new TempleAPI.TempleEmitter();"},TempleException:{kind:"property",list:!1,type:"TempleException",description:"The Temple exception class used to create custom errors.",example:"throw TempleAPI.TempleException.for('error message');"},TempleRegistry:{kind:"property",list:!1,type:"TempleRegistry",description:"The Temple registry class used to store custom elements.",example:"new TempleAPI.TempleRegistry.createElement('a', { href: '/' });"},children:{kind:"function",args:[{kind:"property",list:!1,name:"component",type:"TempleComponent"}],returns:{kind:"property",list:!0,type:"Node"},description:"Returns an array of child nodes.",example:"TempleAPI.children(component); //--> [ Element, Text, Element, ... ]"},components:{kind:"property",list:!1,type:"Record",description:"Returns an object of Temple components classes used in the DOM.",example:"new TempleAPI.components['fancy-button']; //--> TempleComponent"},data:{kind:"property",list:!1,type:"TempleDataMap",description:"The Temple data map used to bring server side data to the client.",example:"TempleAPI.data.get('props');"},emitter:{kind:"property",list:!1,type:"TempleEmitter",description:"The Temple emitter class used to create custom events.",example:"TempleAPI.emitter.on('click', () => {});"},props:{kind:"function",args:[{kind:"property",list:!1,name:"component",type:"TempleComponent"}],returns:{kind:"property",list:!0,type:"Hash"},description:"Returns an object of component attributes",example:"TempleAPI.props(component); //--> { foo: 'bar', count: 4 }"},signal:{kind:"function",args:[{kind:"property",list:!1,name:"component",type:"TempleComponent"}],returns:{kind:"property",list:!1,type:"Signal"},description:"Returns a signal object used to re-render components whenever its value changes",example:"const count = TempleAPI.signal(1, component)"}},"Render Methods":{asset:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"assetFile",type:"string"}],returns:{kind:"property",list:!1,type:"Asset"},description:"Returns a compiled build asset, given an asset file name.",example:"await compiler.asset('abc123.css'); //--> { type: 'text/css', content: '...' }"},client:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"sourceFile",type:"string"}],returns:{kind:"property",list:!1,type:"string"},description:"Returns a compiled client script, given the the template source file.",example:"await compiler.client('./docs/api.dtml'); //client script"},markup:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"sourceFile",type:"string"}],returns:{kind:"property",list:!1,type:"string"},description:"Returns a compiled markup, given the the template source file.",example:"await compiler.markup('./docs/api.dtml'); //--> ..."},render:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"sourceFile",type:"string"},{kind:"property",list:!1,name:"props",type:"Hash"}],returns:{kind:"property",list:!1,type:"string"},description:"Returns the final HTML markup, given the the template source file.",example:`await compiler.render('./docs/api.dtml', {
+  title: 'API Documentation'
+});`},server:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"sourceFile",type:"string"}],returns:{kind:"property",list:!1,type:"string"},description:"Returns compiled server code, given the the template source file.",example:"await compiler.server('./docs/api.dtml'); // server script"},styles:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"sourceFile",type:"string"}],returns:{kind:"property",list:!1,type:"string"},description:"Returns compiled css styles, given the the template source file.",example:"await compiler.styles('./docs/api.dtml'); //css styles"}},DeveloperOptions:{"cwd?":{kind:"property",list:!1,type:"string",description:"The current working directory",example:"const { refresh, router } = dev({ cwd: process.cwd() })"},"emitter?":{kind:"property",list:!1,type:"EventEmitter",description:"The NodeJS EventEmitter instance being used.",example:`import emitter from 'events';
+
+const { refresh, router } = dev({ emitter });'`},"include?":{kind:"property",list:!0,type:"string",description:"An array of extension names to watch for",example:"const { refresh, router } = dev({ include: [ '.js', '.ts', '.tml', '.dtml' ] });'"},"ignore?":{kind:"property",list:!0,type:"(string|RegExp)",description:"An array of extension names to ignore",example:"const { refresh, router } = dev({ ignore: [ '*.test.*' ] });'"},"route?":{kind:"property",list:!1,type:"string",description:"The route path to use for the client watcher",example:"const { refresh, router } = dev({ route: '/__temple_dev__' })"},"tsconfig?":{kind:"property",list:!1,type:"string",description:"The path to the tsconfig.json file",example:"const { refresh, router } = dev({ tsconfig: '/path/to/tsconfig.json' })"},"extname?":{kind:"property",list:!1,type:"string",description:"the component file extension",example:"const { refresh, router } = dev({ extname: '.tml' })"}},RefreshServer:{cwd:{kind:"property",list:!1,type:"string",description:"The current working directory",example:"refresh.cwd"},emitter:{kind:"property",list:!1,type:"EventEmitter",description:"The NodeJS EventEmitter instance being used.",example:`refresh.emitter.on('render', e => {
+  console.log(e.params);
+});`},sync:{kind:"function",args:[{kind:"property",name:"builder",list:!1,type:"DocumentBuilder"}],returns:{kind:"property",list:!1,type:"void"},description:"Registers a document builder to a client watcher list",example:`refresh.emitter.on('render', e => {
+  console.log(e.params);
+});`},close:{kind:"function",args:[],returns:{kind:"property",list:!1,type:"RefreshServer"},description:"Closes the server and stops the watchers.",example:"refresh.close();"},refresh:{kind:"function",args:[{kind:"property",list:!1,name:"filePath",type:"string"}],returns:{kind:"property",list:!1,type:"Promise"},description:"Whenever a file is changed this will be called to instruct each client watcher how to update their document.",example:"await refresh.refresh('/some/file.tml');"},wait:{kind:"function",args:[{kind:"property",list:!1,name:"req",type:"Request"},{kind:"property",list:!1,name:"res",type:"Response"}],returns:{kind:"property",list:!1,type:"RefreshServer"},description:"Opens a connection to the server via SSE and waits for changes.",example:"refresh.wait(req, res);"},watch:{kind:"function",args:[],returns:{kind:"property",list:!1,type:"RefreshServer"},description:"Starts the server that watches for file changes.",example:"refresh.watch();"}},"Developer Tools":{refresh:{kind:"property",list:!1,type:"RefreshServer",description:"The refresh server instance used to update clients.",example:`const { refresh } = dev();
+refresh.sync(builder);`},router:{kind:"property",list:!1,type:"Function",description:"HTTP middleware to handle developer tool routes like '/dev.js' and '/__temple_dev__'.",example:`const { router } = dev();
+app.use(router);`}},"Express Developer Tools":{refresh:{kind:"property",list:!1,type:"RefreshServer",description:"The refresh server instance used to update clients.",example:`const { refresh } = dev();
+refresh.sync(builder);`},router:{kind:"property",list:!1,type:"Function",description:"Express middleware to handle developer tool routes like '/dev.js' and '/__temple_dev__'.",example:`const { router } = dev();
+app.use(router);`},view:{kind:"property",list:!1,type:"Function",description:"Middleware used to setup an express view engine.",example:`const { view } = dev();
+app.engine('dtml', view(compiler));`}}};var be=class extends i.TempleComponent{static component=["ui","Ui_0ec6f6ca4b362d125365"];styles(){return""}template(){(0,Q.classlist)().add("block","my-40","scroll-hidden","curved","shadow-0-0-10-0-0-0-5");let{start:e="TempleCompiler"}=(0,Q.props)(),r=(0,Q.signal)([e]),n=(0,Q.signal)(e),s=y=>{let d=y.target.getAttribute("data-type");r.value=[...r.value,d],n.value=d},u=()=>{r.value=r.value.slice(0,r.value.length-1),n.value=r.value[r.value.length-1]};return()=>[i.TempleRegistry.createText(`
+`,!1),i.TempleRegistry.createElement("h3",{class:"tx-secondary bg-t-2 tx-16 m-0 p-10"},[i.TempleRegistry.createText(`
+  `,!1),...r.value.length>1?[i.TempleRegistry.createText(`
+    `,!1),i.TempleRegistry.createElement("a",{class:"tx-t-1 cursor-pointer",click:u},[i.TempleRegistry.createText(`
+      `,!1),i.TempleRegistry.createElement("i",{class:"fas fa-arrow-left"},[]).element,i.TempleRegistry.createText(`
+    `,!1)]).element,i.TempleRegistry.createText(`
+  `,!1)]:[],i.TempleRegistry.createText(`
+  API: `,!1),...this._toNodeList(n.value),i.TempleRegistry.createText(`
+`,!1)]).element,i.TempleRegistry.createText(`
+`,!1),i.TempleRegistry.createElement("div",{class:"bg-t-0 p-10"},[i.TempleRegistry.createText(`
+  `,!1),i.TempleRegistry.createElement("div",{class:"relative mb-20 scroll-auto"},[i.TempleRegistry.createText(`
+    `,!1),i.TempleRegistry.createElement("table",{class:"w-full bd-collapse"},[i.TempleRegistry.createText(`
+      `,!1),i.TempleRegistry.createElement("thead",{},[i.TempleRegistry.createText(`
+        `,!1),i.TempleRegistry.createElement("th",{class:"p-10 tx-left tx-uppercase"},[i.TempleRegistry.createText("Property",!1)]).element,i.TempleRegistry.createText(`
+        `,!1),...n.value.includes("Emitter")?[]:[i.TempleRegistry.createText(`
+          `,!1),i.TempleRegistry.createElement("th",{class:"p-10 tx-left tx-uppercase"},[i.TempleRegistry.createText("Returns",!1)]).element,i.TempleRegistry.createText(`
+        `,!1)],i.TempleRegistry.createText(`
+        `,!1),i.TempleRegistry.createElement("th",{class:"p-10 tx-left tx-uppercase"},[i.TempleRegistry.createText("Description",!1)]).element,i.TempleRegistry.createText(`
+      `,!1)]).element,i.TempleRegistry.createText(`
+      `,!1),i.TempleRegistry.createElement("tbody",{},[i.TempleRegistry.createText(`
+        `,!1),...Object.entries(He[n.value]).map(([y,d])=>[i.TempleRegistry.createText(`
+          `,!1),i.TempleRegistry.createElement("tr",{},[i.TempleRegistry.createText(`
+            `,!1),...d.kind==="property"?[i.TempleRegistry.createText(`
+              `,!1),i.TempleRegistry.createElement("td",{class:"tx-primary tx-top tx-nowrap bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10"},[i.TempleRegistry.createText(`
+                `,!1),...this._toNodeList(y),i.TempleRegistry.createText(`
+              `,!1)]).element,i.TempleRegistry.createText(`
+              `,!1),...He[d.type]?[i.TempleRegistry.createText(`
+                `,!1),i.TempleRegistry.createElement("td",{class:"tx-top tx-nowrap bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10"},[i.TempleRegistry.createText(`
+                  `,!1),i.TempleRegistry.createElement("a",{"data-type":d.type,click:s},[i.TempleRegistry.createText(`
+                    `,!1),...this._toNodeList(d.type),i.TempleRegistry.createText(`
+                  `,!1)]).element,...this._toNodeList(d.list?"[]":""),i.TempleRegistry.createText(`
+                `,!1)]).element,i.TempleRegistry.createText(`
+              `,!1)]:[,i.TempleRegistry.createText(`
+                `,!1),i.TempleRegistry.createElement("td",{class:"tx-top tx-nowrap bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10"},[i.TempleRegistry.createText(`
+                  `,!1),...this._toNodeList(d.type),...this._toNodeList(d.list?"[]":""),i.TempleRegistry.createText(`
+                `,!1)]).element,i.TempleRegistry.createText(`
+              `,!1)],i.TempleRegistry.createText(`
+            `,!1)]:d.kind==="function"?[,i.TempleRegistry.createText(`
+              `,!1),i.TempleRegistry.createElement("td",{class:"tx-primary tx-top bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10",nowrap:!0},[i.TempleRegistry.createText(`
+                `,!1),...this._toNodeList(y),i.TempleRegistry.createText(`(
+                  `,!1),...Object.entries(d.args).map(([k,v])=>[i.TempleRegistry.createText(`
+                    `,!1),...k>0?[i.TempleRegistry.createText(", ",!1)]:[],i.TempleRegistry.createText(`
+                    `,!1),...this._toNodeList(v.name),i.TempleRegistry.createText(`: 
+                    `,!1),...He[v.type]?[i.TempleRegistry.createText(`
+                      `,!1),i.TempleRegistry.createElement("a",{"data-type":v.type,click:s},[i.TempleRegistry.createText(`
+                        `,!1),...this._toNodeList(v.type),i.TempleRegistry.createText(`
+                      `,!1)]).element,...this._toNodeList(v.list?"[]":""),i.TempleRegistry.createText(`
+                    `,!1)]:[,i.TempleRegistry.createText(`
+                      `,!1),...this._toNodeList(v.type),...this._toNodeList(v.list?"[]":""),i.TempleRegistry.createText(`
+                    `,!1)],i.TempleRegistry.createText(`
+                  `,!1)]).flat(),i.TempleRegistry.createText(`
+                )
+              `,!1)]).element,i.TempleRegistry.createText(`
+              `,!1),...He[d.returns.type]?[i.TempleRegistry.createText(`
+                `,!1),i.TempleRegistry.createElement("td",{class:"tx-top tx-nowrap bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10"},[i.TempleRegistry.createText(`
+                  `,!1),i.TempleRegistry.createElement("a",{"data-type":d.returns.type,click:s},[i.TempleRegistry.createText(`
+                    `,!1),...this._toNodeList(d.returns.type),i.TempleRegistry.createText(`
+                  `,!1)]).element,...this._toNodeList(d.returns.list?"[]":""),i.TempleRegistry.createText(`
+                `,!1)]).element,i.TempleRegistry.createText(`
+              `,!1)]:[,i.TempleRegistry.createText(`
+                `,!1),i.TempleRegistry.createElement("td",{class:"tx-top tx-nowrap bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10"},[i.TempleRegistry.createText(`
+                  `,!1),...this._toNodeList(d.returns.type),...this._toNodeList(d.returns.list?"[]":""),i.TempleRegistry.createText(`
+                `,!1)]).element,i.TempleRegistry.createText(`
+              `,!1)],i.TempleRegistry.createText(`
+            `,!1)]:d.kind==="event"?[,i.TempleRegistry.createText(`
+              `,!1),i.TempleRegistry.createElement("td",{class:"tx-primary tx-top bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10",nowrap:!0},[i.TempleRegistry.createText(`
+                `,!1),...this._toNodeList(`on('${y}', (event: Event) => void)`),i.TempleRegistry.createText(`
+              `,!1)]).element,i.TempleRegistry.createText(`
+            `,!1)]:[],i.TempleRegistry.createText(`
+            `,!1),i.TempleRegistry.createElement("td",{class:"tx-top tx-lh-24 bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10"},[i.TempleRegistry.createText(`
+              `,!1),...d.description?[i.TempleRegistry.createText(`
+                `,!1),i.TempleRegistry.createElement("p",{class:"pb-10"},[...this._toNodeList(d.description)]).element,i.TempleRegistry.createText(`
+                `,!1),...d.example?[i.TempleRegistry.createText(`
+                  `,!1),i.TempleRegistry.createElement("h5",{},[i.TempleRegistry.createText("Example",!1)]).element,i.TempleRegistry.createText(`
+                  `,!1),i.TempleRegistry.createComponent("api-ide-code",K,{lang:"js"},[...this._toNodeList(d.example)]).element,i.TempleRegistry.createText(` 
+                `,!1)]:[],i.TempleRegistry.createText(`
+              `,!1)]:[],i.TempleRegistry.createText(`
+            `,!1)]).element,i.TempleRegistry.createText(`
+          `,!1)]).element,i.TempleRegistry.createText(`
+        `,!1)]).flat(),i.TempleRegistry.createText(`
+      `,!1)]).element,i.TempleRegistry.createText(`
+    `,!1)]).element,i.TempleRegistry.createText(`
+  `,!1)]).element,i.TempleRegistry.createText(`
+`,!1)]).element]}};var ee=T(D()),lt=T(P()),xe=class extends ee.TempleComponent{static component=["head","Head_939ecb5f22962d8c2924"];styles(){return""}template(){return(0,lt.classlist)().add("absolute","top-0","right-0","left-170","h-45","bg-t-0","z-1"),()=>[ee.TempleRegistry.createText(`
+`,!1),ee.TempleRegistry.createElement("header",{class:"w-full h-full scroll-x-auto"},[ee.TempleRegistry.createText(`
+  `,!1),...this._toNodeList((0,lt.children)()),ee.TempleRegistry.createText(`
+`,!1)]).element]}};var te=T(D()),ot=T(P()),ve=class extends te.TempleComponent{static component=["left","Left_a7102198c3628da88b4f"];styles(){return""}template(){return(0,ot.classlist)().add("absolute","top-0","bottom-0","left-0","w-170","bg-h-000000","bd-solid","bd-t-2","bdy-0","bdl-0","bdr-1","z-2"),()=>[te.TempleRegistry.createText(`
+`,!1),te.TempleRegistry.createElement("aside",{class:"w-full h-full scroll-auto"},[te.TempleRegistry.createText(`
+  `,!1),...this._toNodeList((0,ot.children)()),te.TempleRegistry.createText(`
+`,!1)]).element]}};var re=T(D()),pt=T(P()),ke=class extends re.TempleComponent{static component=["main","Main_bbd0517424ebab9de270"];styles(){return""}template(){return(0,pt.classlist)().add("absolute","top-45","right-0","left-170","bottom-0","bg-black","bd-solid","bd-t-2","bdx-0","bdb-0","bdt-1"),()=>[re.TempleRegistry.createText(`
+`,!1),re.TempleRegistry.createElement("main",{class:"w-full h-full scroll-auto"},[re.TempleRegistry.createText(`
+  `,!1),...this._toNodeList((0,pt.children)()),re.TempleRegistry.createText(`
+`,!1)]).element]}};var S=T(D()),ct=T(P()),Te=class extends S.TempleComponent{static component=["app","App_381239c61b65b86a1c20"];styles(){return""}template(){let{title:e,height:r}=(0,ct.props)(),n=r?`height:${r}px`:"";return()=>[S.TempleRegistry.createText(`
+`,!1),S.TempleRegistry.createElement("div",{class:"bd-rad-curved scroll-hidden shadow-0-0-10-0-0-0-5"},[S.TempleRegistry.createText(`
+  `,!1),S.TempleRegistry.createElement("div",{class:"relative flex flex-center-y gap-10 p-10 bg-t-1 tx-c-999999 tx-16"},[S.TempleRegistry.createText(`
+    `,!1),S.TempleRegistry.createElement("span",{class:"bg-h-999999 pill h-10 w-10"},[]).element,S.TempleRegistry.createText(`
+    `,!1),S.TempleRegistry.createElement("span",{class:"bg-h-999999 pill h-10 w-10"},[]).element,S.TempleRegistry.createText(`
+    `,!1),S.TempleRegistry.createElement("span",{class:"bg-h-999999 pill h-10 w-10"},[]).element,S.TempleRegistry.createText(`
+    `,!1),S.TempleRegistry.createElement("span",{class:"flex flex-center h-full w-full absolute top-0 left-0"},[S.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(e),S.TempleRegistry.createText(`
+    `,!1)]).element,S.TempleRegistry.createText(`
+  `,!1)]).element,S.TempleRegistry.createText(`
+  `,!1),S.TempleRegistry.createElement("div",{class:"bg-black tx-t-1 relative",style:n},[...this._toNodeList((0,ct.children)())]).element,S.TempleRegistry.createText(`
+`,!1)]).element]}};var R=T(D()),Lt=T(At()),tr=T(P()),we=class extends R.TempleComponent{static component=["code","Code_5294df1c620ef5ddbd2f"];styles(){return`:host {
+    display: block;
+    font-size: 14px;
+    line-height: 20px;
   }
-  .bd-warning {
-    border-color: var(--warning);
+  :host([inline]) {
+    display: inline !important;
   }
-  .bd-success {
-    border-color: var(--success);
+  :host([inline]),
+  :host([inline]) > pre,
+  :host([inline]) > pre > code {
+    display: inline !important;
   }
-  .bd-muted {
-    border-color: var(--muted);
+  .snippet {
+    background-color: #000000;
+    color: #ABB2BF;
+    height: 100%;
+    margin: 0;
+    padding: 0;
   }
-  .bd-primary {
-    border-color: var(--primary);
+
+  .line-numbers {
+    position: relative;
+    padding-left: 3.8em;
+    counter-reset: linenumber;
   }
-  .bd-secondary {
-    border-color: var(--secondary);
+  :host([inline]) .line-numbers {
+    position: static;
+    padding-left: 0;
   }
 
-  /* Backgrounds
-  ---------------------------------*/
-  .bg-white {
-    background-color: var(--white);
-  }
-  .bg-info {
-    background-color: var(--info);
+  .line-numbers > code {
+    position: relative;
+    white-space: inherit;
   }
-  .bg-error {
-    background-color: var(--error);
+
+  .line-numbers .line-numbers-rows {
+    position: absolute;
+    pointer-events: none;
+    top: 0;
+    font-size: 100%;
+    left: -3.8em;
+    width: 3em; /* works for line-numbers below 1000 lines */
+    letter-spacing: -1px;
+    border-right: 1px solid #999;
+
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+
   }
-  .bg-warning {
-    background-color: var(--warning);
+
+  :host([inline]) .line-numbers .line-numbers-rows {
+    display: none;
   }
-  .bg-success {
-    background-color: var(--success);
+
+  .line-numbers-rows > span {
+    display: block;
+    counter-increment: linenumber;
   }
-  .bg-muted {
-    background-color: var(--muted);
+
+  .line-numbers-rows > span:before {
+    content: counter(linenumber);
+    color: #999;
+    display: block;
+    padding-right: 0.8em;
+    text-align: right;
   }
-  .bg-primary {
-    background-color: var(--primary);
+  .pad {
+    padding: 5px;
   }
-  .bg-secondary {
-    background-color: var(--secondary);
+
+  .terminal {
+    background-color: #000000;
+    font-family: 'Courier New', Courier, monospace;
+    font-size: 15px;
+    height: 100%;
+    padding: 10px;
   }
+  .terminal span {
+    color: #00FF00;
+  }`}template(){let e=this.props,{lang:r="markup",numbers:n=!1,inline:s=!1,trim:u=!1,ltrim:y=!1,rtrim:d=!1,detab:k=0}=e,v=(0,tr.children)(),m=v[0]?.textContent||"";k&&(m=m.replace(new RegExp(`\\n {${k}}`,"g"),`
+`)),u?m=m.trim():y?m=m.replace(/^\s+/,""):d&&(m=m.replace(/\s+$/,""));let A=E=>{if(!m)return;let b=Lt.default.highlight(m,Lt.default.languages[r],r);if(E.detail.target.innerHTML=b,n){let _=b.match(/\n(?!$)/g),a=_?_.length+1:1,l=new Array(a+1).join(""),p=document.createElement("span");p.setAttribute("aria-hidden","true"),p.className="line-numbers-rows",p.innerHTML=l,E.detail.target.appendChild(p)}};return()=>[R.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism.min.css"}).element,R.TempleRegistry.createText(`
+`,!1),R.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism-tomorrow.min.css"}).element,R.TempleRegistry.createText(`
+`,!1),...r==="bash"?[R.TempleRegistry.createText(`
+  `,!1),R.TempleRegistry.createElement("div",{class:"terminal"},[R.TempleRegistry.createElement("span",{},[R.TempleRegistry.createText("$",!1)]).element,R.TempleRegistry.createText(" ",!1),...this._toNodeList(v)]).element,R.TempleRegistry.createText(`
+`,!1)]:m?[,R.TempleRegistry.createText(`
+  `,!1),...n?[R.TempleRegistry.createText(`
+    `,!1),R.TempleRegistry.createElement("pre",{class:"snippet line-numbers"},[R.TempleRegistry.createElement("code",{mount:A},[]).element]).element,R.TempleRegistry.createText(`
+  `,!1)]:[,R.TempleRegistry.createText(`
+    `,!1),R.TempleRegistry.createElement("pre",{class:"snippet pad"},[R.TempleRegistry.createElement("code",{mount:A},[]).element]).element,R.TempleRegistry.createText(`
+  `,!1)],R.TempleRegistry.createText(`
+`,!1)]:[,R.TempleRegistry.createText(`
+  `,!1),R.TempleRegistry.createElement("span",{},[R.TempleRegistry.createText("????",!1)]).element,R.TempleRegistry.createText(`
+`,!1)],R.TempleRegistry.createText(`
 
-  /* Alert
-  ---------------------------------*/
-  .alert {
-    padding: 16px;
-  }`}template(){let{color:e,info:r,warning:i,success:a,error:p,muted:g,primary:m,secondary:v,solid:_,outline:w,curved:E,rounded:x,pill:y,style:A}=(0,Q.props)(),s={classes:["alert"],styles:""},n=w?"outline":"solid";E?s.classes.push("curved"):x?s.classes.push("rounded"):y&&s.classes.push("pill"),n==="outline"?(s.classes.push("solid","thin"),e?(s.styles+=`border-color: ${e};`,s.styles+=`color: ${e};`):r?s.classes.push("bd-info","tx-info"):i?s.classes.push("bd-warning","tx-warning"):a?s.classes.push("bd-success","tx-success"):p?s.classes.push("bd-error","tx-error"):g?s.classes.push("bd-muted","tx-muted"):m?s.classes.push("bd-primary","tx-primary"):v&&s.classes.push("bd-secondary","tx-secondary")):(s.classes.push("tx-white"),e?s.styles+=`background-color: ${e};`:r?s.classes.push("bg-info"):i?s.classes.push("bg-warning"):a?s.classes.push("bg-success"):p?s.classes.push("bg-error"):g?s.classes.push("bg-muted"):m?s.classes.push("bg-primary"):v&&s.classes.push("bg-secondary"));let l={classes:[...s.classes,(0,Q.classnames)()].join(" "),styles:{...s.styles,...A}};return()=>[N.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/fontawesome/all.css"}).element,N.TempleRegistry.createText(`
-`,!1),N.TempleRegistry.createElement("div",{class:l.classes,style:l.styles},[N.TempleRegistry.createText(`
-  `,!1),...this._toNodeList((0,Q.children)()),N.TempleRegistry.createText(`
-`,!1)]).element]}};var j=$(q());var Ue=function(t,...e){let r=Ze(t);for(let i=0;i[j.TempleRegistry.createText(`
-    `,!1),...r?[j.TempleRegistry.createText(`
-      `,!1),j.TempleRegistry.createElement("p",{},[...this._toNodeList(w)]).element,j.TempleRegistry.createText(`
-    `,!1)]:i?[,j.TempleRegistry.createText(`
-      `,!1),j.TempleRegistry.createElement("li",{},[...this._toNodeList(w)]).element,j.TempleRegistry.createText(`
-    `,!1)]:a?[,j.TempleRegistry.createText(`
-      `,!1),j.TempleRegistry.createElement("div",{},[...this._toNodeList(w)]).element,j.TempleRegistry.createText(`
-    `,!1)]:[,j.TempleRegistry.createText(`
-      `,!1),...this._toNodeList(w),j.TempleRegistry.createText(`
-    `,!1)]]}};var F=$(q());D.emitter.once("ready",()=>{let t=document.querySelector("script[data-app]");if(!t)throw D.TempleException.for("APP_DATA not found");try{let g=atob(t.getAttribute("data-app"));window.__APP_DATA__=JSON.parse(g),Object.entries(window.__APP_DATA__).forEach(([m,v])=>{D.data.set(m,v)})}catch{throw D.TempleException.for("APP_DATA is not a valid JSON")}D.data.set("current","document");let e="/docs/component-strategy.html",r=Ue("Component Strategy - Temple reactive web component template engine."),i=Ue("Learn more about web components and how they work with Temple."),a=g=>{document.body.classList.toggle("panel-left-open")};D.data.delete("current");let p={0:{class:"head panel-head"},1:{class:"menu fas fa-fw fa-bars",click:a},2:{href:"/temple"},3:{src:"/temple/temple-icon.png",alt:"Temple Logo"},5:{class:"tx-white",href:"/temple"},7:{class:"tx-white",href:"/temple/docs/index.html"},8:{class:"github",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},9:{class:"fab fa-github"},10:{class:"npm",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},11:{class:"fab fa-npm text-white"},12:{class:"discord",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},13:{class:"fab fa-discord text-white"},14:{class:"left panel-left"},16:{href:"/temple"},17:{src:"/temple/temple-icon.png",alt:"Temple Logo"},19:{class:"tx-white",href:"/temple"},20:{class:"toggle fas fa-fw fa-chevron-left",click:a},23:{href:"/temple/docs/index.html"},24:{href:"/temple/docs/getting-started.html"},26:{href:"/temple/docs/markup-syntax.html"},27:{href:"/temple/docs/state-management.html"},28:{href:"/temple/docs/component-strategy.html"},29:{href:"/temple/docs/compiler-api.html"},30:{href:"/temple/docs/client-api.html"},32:{href:"/temple/docs/template-engine.html"},33:{href:"/temple/docs/single-page.html"},34:{href:"/temple/docs/static-site.html"},35:{href:"/temple/docs/component-publisher.html"},36:{href:"/temple/docs/developer-tools.html"},37:{class:"panel-right right"},40:{href:"#document"},41:{href:"#template"},42:{href:"#component"},44:{href:"#strat-1"},45:{href:"#strat-2"},46:{href:"#strat-3"},47:{href:"#strat-4"},48:{href:"#fouc"},49:{class:"panel-main"},50:{class:"docs container"},52:{p:!0,trim:!0},53:{name:"document"},55:{p:!0,trim:!0},56:{inline:!0},57:{inline:!0},60:{p:!0,trim:!0},61:{inline:!0},62:{inline:!0},63:{inline:!0},65:{p:!0,trim:!0},66:{inline:!0},68:{p:!0,trim:!0},69:{inline:!0},70:{curved:!0,info:!0},71:{class:"fas fa-fw fa-info-circle"},73:{panel:250,title:"Passing Server Props"},74:{class:"panel-head"},75:{class:"tabs"},76:{class:"tab active",group:"document",selector:"#index-ts"},77:{class:"tab",group:"document",selector:"#page-dtml"},78:{class:"panel-left"},79:{class:"folder"},80:{class:"fas fa-fw fa-chevron-down"},82:{class:"shift-1 block active",group:"document",selector:"#index-ts"},83:{class:"fas fa-fw fa-file"},84:{class:"shift-1 block",group:"document",selector:"#page-dtml"},85:{class:"fas fa-fw fa-file"},86:{class:"panel-main"},88:{id:"index-ts",lang:"js",numbers:!0,trim:!0,detab:16},89:{id:"page-dtml",style:"display:none",numbers:!0,trim:!0,detab:16},90:{name:"template"},92:{p:!0,trim:!0},93:{inline:!0},94:{p:!0,trim:!0},95:{trim:!0,detab:10},96:{p:!0,trim:!0},97:{panel:250,title:"Using Templates"},98:{class:"panel-head"},99:{class:"tabs"},100:{class:"tab active",group:"templates",selector:"#page2-dtml"},101:{class:"tab",group:"templates",selector:"#head-tml"},102:{class:"panel-left"},103:{class:"folder"},104:{class:"fas fa-fw fa-chevron-down"},106:{class:"shift-1 block active",group:"templates",selector:"#page2-dtml"},107:{class:"fas fa-fw fa-file"},108:{class:"shift-1 block",group:"templates",selector:"#head-tml"},109:{class:"fas fa-fw fa-file"},110:{class:"panel-main"},112:{id:"page2-dtml",numbers:!0,trim:!0,detab:16},113:{id:"head-tml",style:"display:none",numbers:!0,trim:!0,detab:16},114:{curved:!0,info:!0},115:{class:"fas fa-fw fa-info-circle"},117:{p:!0,trim:!0},118:{name:"component"},120:{p:!0,trim:!0},121:{inline:!0},122:{inline:!0},123:{inline:!0},124:{inline:!0},125:{name:"strat-1"},127:{p:!0,trim:!0},128:{panel:400,title:"No Components"},129:{class:"panel-head"},130:{class:"tabs"},131:{class:"tab active",group:"strat-1",selector:"#page3-dtml"},132:{class:"tab",group:"strat-1",selector:"#head3-tml"},133:{class:"tab",group:"strat-1",selector:"#header3-tml"},134:{class:"tab",group:"strat-1",selector:"#footer3-tml"},135:{class:"panel-left"},136:{class:"folder"},137:{class:"fas fa-fw fa-chevron-down"},139:{class:"shift-1 block active",group:"strat-1",selector:"#page3-dtml"},140:{class:"fas fa-fw fa-file"},141:{class:"shift-1 block",group:"strat-1",selector:"#head3-tml"},142:{class:"fas fa-fw fa-file"},143:{class:"shift-1 block",group:"strat-1",selector:"#header3-tml"},144:{class:"fas fa-fw fa-file"},145:{class:"shift-1 block",group:"strat-1",selector:"#footer3-tml"},146:{class:"fas fa-fw fa-file"},147:{class:"panel-main"},149:{id:"page3-dtml",numbers:!0,trim:!0,detab:16},150:{id:"head3-tml",style:"display:none",numbers:!0,trim:!0,detab:16},151:{id:"header3-tml",style:"display:none",numbers:!0,trim:!0,detab:16},152:{id:"footer3-tml",style:"display:none",numbers:!0,trim:!0,detab:16},153:{name:"strat-2"},155:{p:!0,trim:!0},156:{inline:!0},157:{panel:400,title:"Shallow Components"},158:{class:"panel-head"},159:{class:"tabs"},160:{class:"tab active",group:"strat-2",selector:"#page4-dtml"},161:{class:"tab",group:"strat-2",selector:"#header4-tml"},162:{class:"tab",group:"strat-2",selector:"#footer4-tml"},163:{class:"panel-left"},164:{class:"folder"},165:{class:"fas fa-fw fa-chevron-down"},167:{class:"shift-1 block active",group:"strat-2",selector:"#page4-dtml"},168:{class:"fas fa-fw fa-file"},169:{class:"shift-1 block",group:"strat-2",selector:"#header4-tml"},170:{class:"fas fa-fw fa-file"},171:{class:"shift-1 block",group:"strat-2",selector:"#footer4-tml"},172:{class:"fas fa-fw fa-file"},173:{class:"panel-main"},175:{id:"page4-dtml",numbers:!0,trim:!0,detab:16},176:{id:"header4-tml",style:"display:none",numbers:!0,trim:!0,detab:16},177:{id:"footer4-tml",style:"display:none",numbers:!0,trim:!0,detab:16},178:{name:"strat-3"},180:{p:!0,trim:!0},181:{inline:!0},182:{inline:!0},183:{panel:400,title:"Shallow Components"},184:{class:"panel-head"},185:{class:"tabs"},186:{class:"tab",group:"strat-3",selector:"#page5-dtml"},187:{class:"tab active",group:"strat-3",selector:"#header5-tml"},188:{class:"tab",group:"strat-3",selector:"#footer5-tml"},189:{class:"panel-left"},190:{class:"folder"},191:{class:"fas fa-fw fa-chevron-down"},193:{class:"shift-1 block",group:"strat-3",selector:"#page5-dtml"},194:{class:"fas fa-fw fa-file"},195:{class:"shift-1 block active",group:"strat-3",selector:"#header5-tml"},196:{class:"fas fa-fw fa-file"},197:{class:"shift-1 block",group:"strat-3",selector:"#footer5-tml"},198:{class:"fas fa-fw fa-file"},199:{class:"panel-main"},201:{id:"page5-dtml",style:"display:none",numbers:!0,trim:!0,detab:16},202:{id:"header5-tml",numbers:!0,trim:!0,detab:16},203:{id:"footer5-tml",style:"display:none",numbers:!0,trim:!0,detab:16},204:{name:"strat-4"},206:{p:!0,trim:!0},207:{inline:!0},208:{panel:400,title:"Encapsulation"},209:{class:"panel-head"},210:{class:"tabs"},211:{class:"tab",group:"strat-4",selector:"#page6-dtml"},212:{class:"tab active",group:"strat-4",selector:"#header6-tml"},213:{class:"tab",group:"strat-4",selector:"#footer6-tml"},214:{class:"panel-left"},215:{class:"folder"},216:{class:"fas fa-fw fa-chevron-down"},218:{class:"shift-1 block",group:"strat-4",selector:"#page6-dtml"},219:{class:"fas fa-fw fa-file"},220:{class:"shift-1 block active",group:"strat-4",selector:"#header6-tml"},221:{class:"fas fa-fw fa-file"},222:{class:"shift-1 block",group:"strat-4",selector:"#footer6-tml"},223:{class:"fas fa-fw fa-file"},224:{class:"panel-main"},226:{id:"page6-dtml",style:"display:none",numbers:!0,trim:!0,detab:16},227:{id:"header6-tml",numbers:!0,trim:!0,detab:16},228:{id:"footer6-tml",style:"display:none",numbers:!0,trim:!0,detab:16},229:{name:"fouc"},231:{p:!0,trim:!0},232:{p:!0,trim:!0},233:{lang:"css",numbers:!0,detab:10},234:{p:!0,trim:!0},235:{class:"pager"},236:{class:"prev",href:"/temple/docs/state-management.html"},237:{class:"fas fa-fw fa-chevron-left"},238:{class:"next",href:"/temple/docs/compiler-api.html"},239:{class:"fas fa-fw fa-chevron-right"},240:{class:"foot"}};for(let g of document.body.querySelectorAll("*")){let m=Object.fromEntries(Array.from(g.attributes).map(_=>[_.nodeName,_.nodeValue.length>0?_.nodeValue:!0])),v=String(D.TempleRegistry.elements.size);p[v]&&(Object.assign(m,p[v]),g.TempleAttributes=p[v]),D.TempleRegistry.register(g,m)}customElements.define("panel-main",W),customElements.define("ide-code",X),customElements.define("ide-app",Y),customElements.define("tui-tab",V),customElements.define("tui-alert",K),customElements.define("i18n-translate",ee),D.emitter.emit("mounted",document.body)});var lr={PanelMain_fd7f1af6410c5b5c8e1f:W,IdeCode_6f36bc13bb6a166c7abc:X,IdeApp_05341fddbfd1fe4f273b:Y,TuiTab_dd9d261e4f37efc3079c:V,TuiAlert_6b81bcb0566ce7f0cd2d:K,I18nTranslate_7d25e372f5ffb5e39dad:ee},or="75ff7698b5db04ad540c";return jt(ur);})();
+`,!1)]}};var O=T(D());var rr=function(t){return t};var dt=T(P()),_e=class extends O.TempleComponent{static component=["translate","Translate_0014b007fc91289b2776"];styles(){return""}template(){let{trim:e=!1,p:r=!1,li:n=!1,div:s=!1}=(0,dt.props)(),u=(0,dt.children)(),y=[],d=[];for(let A of u)typeof A=="string"?y.push(A):A instanceof Node&&A.textContent?y.push(A.textContent):(y.push("%s"),d.push(A));let k=y.join("");e&&(k=k.replace(/\s+/," ").trim());let v=rr(k).split("%s"),m=[];for(let A=0;A[O.TempleRegistry.createText(`
+    `,!1),...r?[O.TempleRegistry.createText(`
+      `,!1),O.TempleRegistry.createElement("p",{},[...this._toNodeList(m)]).element,O.TempleRegistry.createText(`
+    `,!1)]:n?[,O.TempleRegistry.createText(`
+      `,!1),O.TempleRegistry.createElement("li",{},[...this._toNodeList(m)]).element,O.TempleRegistry.createText(`
+    `,!1)]:s?[,O.TempleRegistry.createText(`
+      `,!1),O.TempleRegistry.createElement("div",{},[...this._toNodeList(m)]).element,O.TempleRegistry.createText(`
+    `,!1)]:[,O.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(m),O.TempleRegistry.createText(`
+    `,!1)]]}};var Rt=function(t,...e){let r=Kr(t);for(let n=0;n{let t=document.querySelector("script[data-app]");if(!t)throw $.TempleException.for("APP_DATA not found");try{let y=atob(t.getAttribute("data-app"));window.__APP_DATA__=JSON.parse(y),Object.entries(window.__APP_DATA__).forEach(([d,k])=>{$.data.set(d,k)})}catch{throw $.TempleException.for("APP_DATA is not a valid JSON")}$.data.set("current","document");let e="/docs/component-strategy.html",r=Rt("Component Strategy - Temple reactive web component template engine."),n=Rt("Learn more about web components and how they work with Temple."),s=()=>{document.getElementsByTagName("panel-layout")[0].toggle("left")};$.data.delete("current");let u={2:{class:"flex flex-center-y px-20 py-15 m-0 bg-t-1"},3:{class:"fas fa-fw fa-bars cursor-pointer py-5 pr-10 none md-inline-block tx-t-1",click:s},4:{class:"flex-grow"},5:{class:"flex flex-center-y"},6:{class:"tx-white",href:"/temple/docs/index.html"},7:{class:"tx-t-1 tx-5xl ml-10",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},8:{class:"fab fa-github"},9:{class:"bg-h-cb3837 pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},10:{class:"fab fa-npm text-white"},11:{class:"bg-h-7289da pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},12:{class:"fab fa-discord text-white"},14:{class:"flex flex-center-y bg-t-2 py-15 pr-5 pl-10"},15:{href:"/temple"},16:{class:"h-26 mr-10",src:"/temple/temple-icon.png",alt:"Temple Logo"},17:{class:"flex-grow m-0 tx-uppercase"},18:{class:"tx-white",href:"/temple"},19:{class:"fas fa-fw fa-chevron-left cursor-pointer none md-inline-block",click:s},20:{class:"bg-t-1 scroll-auto h-calc-full-60"},21:{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-0 pt-20 pb-10 pl-10 tx-uppercase"},22:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/index.html"},23:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/getting-started.html"},24:{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},25:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/markup-syntax.html"},26:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/state-management.html"},27:{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/component-strategy.html"},28:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/compiler-api.html"},29:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/client-api.html"},30:{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},31:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/template-engine.html"},32:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/single-page.html"},33:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/static-site.html"},34:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-publisher.html"},35:{class:"block tx-t-1 py-10 pl-10 mb-100",href:"/temple/docs/developer-tools.html"},37:{class:"m-0 px-10 py-20 h-calc-full-40 bg-t-2 scroll-auto"},38:{class:"tx-muted tx-14 mb-0 mt-0 pb-10 tx-uppercase"},39:{class:"tx-14 tx-lh-32"},40:{class:"block tx-t-0",href:"#document"},41:{class:"block tx-t-0",href:"#template"},42:{class:"block tx-t-0",href:"#component"},43:{class:"pl-20"},44:{class:"block tx-t-1",href:"#strat-1"},45:{class:"block tx-t-1",href:"#strat-2"},46:{class:"block tx-t-1",href:"#strat-3"},47:{class:"block tx-t-1",href:"#strat-4"},48:{class:"block tx-t-0",href:"#fouc"},51:{class:"tx-primary tx-uppercase tx-30 py-20"},52:{p:!0,trim:!0,class:"tx-lh-36 py-20"},53:{name:"document"},54:{class:"tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0"},55:{p:!0,trim:!0,class:"tx-lh-36 py-20"},56:{inline:!0},57:{inline:!0},60:{p:!0,trim:!0,class:"tx-lh-36 py-20"},61:{inline:!0},62:{inline:!0},63:{inline:!0},65:{p:!0,trim:!0,class:"tx-lh-36 py-20"},66:{inline:!0},68:{p:!0,trim:!0,class:"tx-lh-36 py-20"},69:{inline:!0},70:{curved:!0,info:!0,class:"py-20 tx-lh-24"},71:{class:"fas fa-fw fa-info-circle"},73:{height:250,title:"Passing Server Props",class:"py-20"},75:{class:"flex scroll-x-auto pt-5 pl-5"},76:{on:!0,class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"server",selector:"#server-index-ts"},77:{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"server",selector:"#server-page-dtml"},79:{class:"p-5"},80:{class:"fas fa-fw fa-chevron-down"},82:{on:!0,class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"server",selector:"#server-index-ts"},83:{class:"fas fa-fw fa-file"},84:{class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"server",selector:"#server-page-dtml"},85:{class:"fas fa-fw fa-file"},87:{id:"server-index-ts",lang:"js",numbers:!0,trim:!0,detab:16},88:{id:"server-page-dtml",style:"display:none",numbers:!0,trim:!0,detab:16},89:{name:"template"},90:{class:"tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0"},91:{p:!0,trim:!0,class:"tx-lh-36 py-20"},92:{inline:!0},93:{p:!0,trim:!0,class:"tx-lh-36 py-20"},94:{trim:!0,detab:12},95:{p:!0,trim:!0,class:"tx-lh-36 py-20"},96:{height:250,title:"Using Templates",class:"py-20"},98:{class:"flex scroll-x-auto pt-5 pl-5"},99:{on:!0,class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"template",selector:"#template-page-dtml"},100:{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"template",selector:"#template-head-tml"},102:{class:"p-5"},103:{class:"fas fa-fw fa-chevron-down"},105:{on:!0,class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"template",selector:"#template-page-dtml"},106:{class:"fas fa-fw fa-file"},107:{class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"template",selector:"#template-head-tml"},108:{class:"fas fa-fw fa-file"},110:{id:"template-page-dtml",numbers:!0,trim:!0,detab:16},111:{id:"template-head-tml",style:"display:none",numbers:!0,trim:!0,detab:16},112:{curved:!0,info:!0,class:"py-20 tx-lh-24"},113:{class:"fas fa-fw fa-info-circle"},115:{p:!0,trim:!0,class:"tx-lh-36 py-20"},116:{name:"component"},117:{class:"tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0"},118:{p:!0,trim:!0,class:"tx-lh-36 py-20"},119:{inline:!0},120:{inline:!0},121:{inline:!0},122:{inline:!0},123:{name:"strat-1"},124:{class:"tx-t-1 tx-uppercase tx-22 pt-40 pb-20"},125:{p:!0,trim:!0,class:"tx-lh-36 py-20"},126:{height:400,title:"No Components",class:"py-20"},128:{class:"flex scroll-x-auto pt-5 pl-5"},129:{on:!0,class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"strat-1",selector:"#strat-1-page-dtml"},130:{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"strat-1",selector:"#strat-1-head-tml"},131:{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"strat-1",selector:"#strat-1-header-tml"},132:{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"strat-1",selector:"#strat-1-footer-tml"},134:{class:"folder"},135:{class:"fas fa-fw fa-chevron-down"},137:{on:!0,class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"strat-1",selector:"#strat-1-page-dtml"},138:{class:"fas fa-fw fa-file"},139:{class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"strat-1",selector:"#strat-1-head-tml"},140:{class:"fas fa-fw fa-file"},141:{class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"strat-1",selector:"#strat-1-header-tml"},142:{class:"fas fa-fw fa-file"},143:{class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"strat-1",selector:"#strat-1-footer-tml"},144:{class:"fas fa-fw fa-file"},146:{id:"strat-1-page-dtml",numbers:!0,trim:!0,detab:16},147:{id:"strat-1-head-tml",style:"display:none",numbers:!0,trim:!0,detab:16},148:{id:"strat-1-header-tml",style:"display:none",numbers:!0,trim:!0,detab:16},149:{id:"strat-1-footer-tml",style:"display:none",numbers:!0,trim:!0,detab:16},150:{name:"strat-2"},151:{class:"tx-t-1 tx-uppercase tx-22 pt-40 pb-20"},152:{p:!0,trim:!0,class:"tx-lh-36 py-20"},153:{inline:!0},154:{height:400,title:"Shallow Components",class:"py-20"},156:{class:"flex scroll-x-auto pt-5 pl-5"},157:{on:!0,class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"strat-2",selector:"#strat-2-page-dtml"},158:{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"strat-2",selector:"#strat-2-header-tml"},159:{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"strat-2",selector:"#strat-2-footer-tml"},161:{class:"folder"},162:{class:"fas fa-fw fa-chevron-down"},164:{on:!0,class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"strat-2",selector:"#strat-2-page-dtml"},165:{class:"fas fa-fw fa-file"},166:{class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"strat-2",selector:"#strat-2-header-tml"},167:{class:"fas fa-fw fa-file"},168:{class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"strat-2",selector:"#strat-2-footer-tml"},169:{class:"fas fa-fw fa-file"},171:{id:"strat-2-page-dtml",numbers:!0,trim:!0,detab:16},172:{id:"strat-2-header-tml",style:"display:none",numbers:!0,trim:!0,detab:16},173:{id:"strat-2-footer-tml",style:"display:none",numbers:!0,trim:!0,detab:16},174:{name:"strat-3"},175:{class:"tx-t-1 tx-uppercase tx-22 pt-40 pb-20"},176:{p:!0,trim:!0,class:"tx-lh-36 py-20"},177:{inline:!0},178:{inline:!0},179:{height:400,title:"Shallow Components",class:"py-20"},181:{class:"flex scroll-x-auto pt-5 pl-5"},182:{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"strat-3",selector:"#strat-3-page-dtml"},183:{on:!0,class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"strat-3",selector:"#strat-3-header-tml"},184:{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"strat-3",selector:"#strat-3-footer-tml"},186:{class:"folder"},187:{class:"fas fa-fw fa-chevron-down"},189:{class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"strat-3",selector:"#strat-3-page-dtml"},190:{class:"fas fa-fw fa-file"},191:{on:!0,class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"strat-3",selector:"#strat-3-header-tml"},192:{class:"fas fa-fw fa-file"},193:{class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"strat-3",selector:"#strat-3-footer-tml"},194:{class:"fas fa-fw fa-file"},196:{id:"strat-3-page-dtml",style:"display:none",numbers:!0,trim:!0,detab:16},197:{id:"strat-3-header-tml",numbers:!0,trim:!0,detab:16},198:{id:"strat-3-footer-tml",style:"display:none",numbers:!0,trim:!0,detab:16},199:{name:"strat-4"},200:{class:"tx-t-1 tx-uppercase tx-22 pt-40 pb-20"},201:{p:!0,trim:!0,class:"tx-lh-36 py-20"},202:{inline:!0},203:{height:400,title:"Encapsulation",class:"py-20"},205:{class:"flex scroll-x-auto pt-5 pl-5"},206:{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"strat-4",selector:"#strat-4-page-dtml"},207:{on:!0,class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"strat-4",selector:"#strat-4-header-tml"},208:{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"strat-4",selector:"#strat-4-footer-tml"},210:{class:"folder"},211:{class:"fas fa-fw fa-chevron-down"},213:{on:!0,class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"strat-4",selector:"#strat-4-page-dtml"},214:{class:"fas fa-fw fa-file"},215:{on:!0,class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"strat-4",selector:"#strat-4-header-tml"},216:{class:"fas fa-fw fa-file"},217:{class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"strat-4",selector:"#strat-4-footer-tml"},218:{class:"fas fa-fw fa-file"},220:{id:"strat-4-page-dtml",style:"display:none",numbers:!0,trim:!0,detab:14},221:{id:"strat-4-header-tml",numbers:!0,trim:!0,detab:14},222:{id:"strat-4-footer-tml",style:"display:none",numbers:!0,trim:!0,detab:14},223:{name:"fouc"},225:{p:!0,trim:!0,class:"tx-lh-36 py-20"},226:{p:!0,trim:!0,class:"tx-lh-36 py-20"},227:{lang:"css",numbers:!0,detab:12},228:{p:!0,trim:!0,class:"tx-lh-36 py-20"},229:{class:"flex"},230:{class:"tx-primary py-40",href:"/temple/docs/state-management.html"},231:{class:"fas fa-fw fa-chevron-left tx-t-1"},232:{class:"flex-grow tx-right tx-primary py-40",href:"/temple/docs/compiler-api.html"},233:{class:"fas fa-fw fa-chevron-right tx-t-1"},234:{class:"foot"}};for(let y of document.body.querySelectorAll("*")){let d=Object.fromEntries(Array.from(y.attributes).map(v=>[v.nodeName,v.nodeValue.length>0?v.nodeValue:!0])),k=String($.TempleRegistry.elements.size);u[k]&&(Object.assign(d,u[k]),y.TempleAttributes=u[k]),$.TempleRegistry.register(y,d)}customElements.define("panel-layout",oe),customElements.define("panel-head",pe),customElements.define("panel-left",ce),customElements.define("panel-right",de),customElements.define("panel-main",ue),customElements.define("tui-alert",me),customElements.define("tui-tab",he),customElements.define("api-docs",ye),customElements.define("api-ui",be),customElements.define("app-head",xe),customElements.define("app-left",ve),customElements.define("app-main",ke),customElements.define("ide-app",Te),customElements.define("ide-code",we),customElements.define("i18n-translate",_e),$.emitter.emit("mounted",document.body)});var Qr={PanelLayout_9f3ab204ce271feaf6f7:oe,PanelHead_2bf4dff19bc88ba4138b:pe,PanelLeft_f4ab589e043eee17d229:ce,PanelRight_4ce97029791442c57f8d:de,PanelMain_847772763f4518728ede:ue,TuiAlert_f0fe98801b4b833c4233:me,TuiTab_5a341768ef0a010965e3:he,ApiDocs_40562a7bb56d70d971df:ye,ApiUi_0ec6f6ca4b362d125365:be,ApiIdeCode_6f36bc13bb6a166c7abc:K,AppHead_939ecb5f22962d8c2924:xe,AppLeft_a7102198c3628da88b4f:ve,AppMain_bbd0517424ebab9de270:ke,IdeApp_381239c61b65b86a1c20:Te,IdeCode_5294df1c620ef5ddbd2f:we,I18nTranslate_0014b007fc91289b2776:_e},es="75ff7698b5db04ad540c";return mr(ts);})();
 /*! Bundled license information:
 
 prismjs/prism.js:
diff --git a/docs/build/client/8f2ff6d48aec3c3f0dc4.css b/docs/build/client/8f2ff6d48aec3c3f0dc4.css
index e69de29..e28182b 100644
--- a/docs/build/client/8f2ff6d48aec3c3f0dc4.css
+++ b/docs/build/client/8f2ff6d48aec3c3f0dc4.css
@@ -0,0 +1,217 @@
+html, body {
+  height: 100%;
+  margin: 0;
+  padding: 0;
+  width: 100%;
+}
+
+h1, h2, h3, h4, h5, h6, p {
+  margin: 0;
+  padding: 0;
+}
+
+a {
+  text-decoration: none;
+}
+  html-head:not(:defined) { opacity: 0; }
+html-header:not(:defined) { opacity: 0; }
+html-aside:not(:defined) { opacity: 0; }
+panel-layout:not(:defined) { opacity: 0; }
+panel-head:not(:defined) { opacity: 0; }
+panel-left:not(:defined) { opacity: 0; }
+panel-main:not(:defined) { opacity: 0; }
+tui-tab:not(:defined) { opacity: 0; }
+api-docs:not(:defined) { opacity: 0; }
+app-head:not(:defined) { opacity: 0; }
+app-left:not(:defined) { opacity: 0; }
+app-main:not(:defined) { opacity: 0; }
+ide-app:not(:defined) { opacity: 0; }
+ide-code:not(:defined) { opacity: 0; }
+i18n-translate:not(:defined) { opacity: 0; }
+  :root {
+  --black: #000000;
+  --white: #FFFFFF;
+  --info: #1474FC;
+  --error: #DC3545;
+  --warning: #FF7B07;
+  --success: #28A745;
+  --muted: #999999;
+}
+
+.light {
+  --bg-0: #EFEFEF;
+  --bg-1: #CFCFCF;
+  --bg-2: #AFAFAF;
+  --bg-3: #8F8F8F;
+  --bg-4: #6F6F6F;
+  --bd-0: #EFEFEF;
+  --bd-1: #CFCFCF;
+  --bd-2: #AFAFAF;
+  --bd-3: #8F8F8F;
+  --bd-4: #6F6F6F;
+  --bg-inverse: #242424;
+  --tx-0: #000000;
+  --tx-1: #242424;
+  --tx-inverse: #CFCFCF;
+}
+
+.dark {
+  --bg-0: #121212;
+  --bg-1: #222222;
+  --bg-2: #323232;
+  --bg-3: #424242;
+  --bg-4: #525252;
+  --bd-0: #121212;
+  --bd-1: #222222;
+  --bd-2: #323232;
+  --bd-3: #424242;
+  --bd-4: #525252;
+  --bg-inverse: #DBDBDB;
+  --tx-0: #FFFFFF;
+  --tx-1: #CFCFCF;
+  --tx-inverse: #222222;
+}
+  html-head { display: block; }
+html-header { display: block; }
+html-aside { display: block; }
+panel-layout { display: block; }
+panel-head { display: block; }
+panel-left { display: block; }
+panel-main { display: block; }
+tui-tab { display: block; }
+api-docs { display: block; }
+app-head { display: block; }
+app-left { display: block; }
+app-main { display: block; }
+ide-app { display: block; }
+ide-code { display: block; }
+i18n-translate { display: block; }
+  .arial { font-family: Arial, sans-serif; }
+.none { display: none; }
+.block { display: block; }
+.flex { display: flex; }
+.inline { display: inline; }
+.relative { position: relative; }
+.absolute { position: absolute; }
+.static { position: static; }
+.bottom-0 { bottom: 0px; }
+.bottom-60 { bottom: 60px; }
+.left-0 { left: 0px; }
+.left-226 { left: 226px; }
+.left-0 { left: 0px; }
+.left-226 { left: 226px; }
+.left--226 { left: -226px; }
+.left-170 { left: 170px; }
+.right-0 { right: 0px; }
+.right-200 { right: 200px; }
+.right-0 { right: 0px; }
+.right-200 { right: 200px; }
+.top-0 { top: 0px; }
+.top-60 { top: 60px; }
+.top-45 { top: 45px; }
+.z-1 { z-index: 1; }
+.z-2 { z-index: 2; }
+.flex-grow { flex-grow: 1; }
+.flex-center { align-items: center; justify-content: center; }
+.flex-center-y { align-items: center; }
+.gap-10 { gap: 10px; }
+.scroll-auto { overflow: auto; }
+.scroll-hidden { overflow: hidden; }
+.scroll-x-auto { overflow-x: auto; }
+.scroll-x-hidden { overflow-x: hidden; }
+.scroll-y-auto { overflow-y: auto; }
+.h-full { height: 100%; }
+.h-26 { height: 26px; }
+.h-7289 { height: 7289px; }
+.h-905496362982981723 { height: 905496362982981723px; }
+.h-60 { height: 60px; }
+.h-45 { height: 45px; }
+.h-000000 { height: 000000px; }
+.h-999999 { height: 999999px; }
+.h-10 { height: 10px; }
+.h-36 { height: 36px; }
+.h-calc-full-60 { height: calc(100% - 60px); }
+.vh { height: 100vh; }
+.w-full { width: 100%; }
+.w-226 { width: 226px; }
+.w-170 { width: 170px; }
+.w-0 { width: 0px; }
+.w-10 { width: 10px; }
+.bg-black { background-color: var(--black) !important; }
+.bg-t-1 { background-color: var(--bg-1) !important; }
+.bg-t-2 { background-color: var(--bg-2) !important; }
+.bg-t-0 { background-color: var(--bg-0) !important; }
+.bg-h-cb3837 { background-color: #cb3837; }
+.bg-h-7289da { background-color: #7289da; }
+.bg-h-000000 { background-color: #000000; }
+.bg-h-999999 { background-color: #999999; }
+.tx-5 { font-size: 5px; }
+.tx-14 { font-size: 14px; }
+.tx-16 { font-size: 16px; }
+.tx-30 { font-size: 30px; }
+.tx-lg { font-size: 16px; }
+.tx-5xl { font-size: 26px; }
+.tx-center { text-align: center; }
+.tx-right { text-align: right; }
+.tx-bold { font-weight: bold; }
+.tx-uppercase { text-transform: uppercase; }
+.tx-lh-36 { line-height: 36px; }
+.tx-primary { color: var(--primary) !important; }
+.tx-white { color: var(--white) !important; }
+.tx-muted { color: var(--muted) !important; }
+.tx-t-1 { color: var(--tx-1) !important; }
+.bd-solid { border-style: solid; }
+.bd-t-2 { border-color: var(--bd-2) !important; }
+.bd-t-1 { border-color: var(--bd-1) !important; }
+.bdb-0 { border-bottom-width: 0px; }
+.bdl-0 { border-left-width: 0px; }
+.bdr-1 { border-right-width: 1px; }
+.bdt-1 { border-top-width: 1px; }
+.bdx-0 { border-left-width: 0px; border-right-width: 0px; }
+.bdy-0 { border-top-width: 0px; border-bottom-width: 0px; }
+.curved { border-radius: 4px; }
+.pill { border-radius: 10000px; }
+.curve-t-sm { border-radius: 4px 4px 0 0; }
+.m-0 { margin: 0px; }
+.m-0 { margin: 0px; }
+.m-60 { margin: 60px; }
+.mb-0 { margin-bottom: 0px; }
+.mb-100 { margin-bottom: 100px; }
+.ml-10 { margin-left: 10px; }
+.ml-5 { margin-left: 5px; }
+.ml-2 { margin-left: 2px; }
+.mr-10 { margin-right: 10px; }
+.mt-0 { margin-top: 0px; }
+.mt-20 { margin-top: 20px; }
+.p-5 { padding: 5px; }
+.p-0 { padding: 0px; }
+.p-60 { padding: 60px; }
+.p-10 { padding: 10px; }
+.p-45 { padding: 45px; }
+.p-10 { padding: 10px; }
+.pb-10 { padding-bottom: 10px; }
+.pl-10 { padding-left: 10px; }
+.pl-5 { padding-left: 5px; }
+.pl-15 { padding-left: 15px; }
+.pr-10 { padding-right: 10px; }
+.pr-5 { padding-right: 5px; }
+.pt-20 { padding-top: 20px; }
+.pt-5 { padding-top: 5px; }
+.pt-10 { padding-top: 10px; }
+.px-20 { padding-left: 20px; padding-right: 20px; }
+.py-15 { padding-top: 15px; padding-bottom: 15px; }
+.py-5 { padding-top: 5px; padding-bottom: 5px; }
+.py-10 { padding-top: 10px; padding-bottom: 10px; }
+.py-20 { padding-top: 20px; padding-bottom: 20px; }
+.py-40 { padding-top: 40px; padding-bottom: 40px; }
+.cursor-pointer { cursor: pointer; }
+.transition-500 { transition: 500ms; }
+.shadow-0-0-10-0-0-0-5 { box-shadow: 0px 0px 10px rgb(0, 0, 0, 0.5); }
+@media (max-width: 767px) {
+  .md-inline-block { display: inline-block; }
+  .md-left-0 { left: 0px; }
+  .md-left-226 { left: 226px; }
+  .md-left--226 { left: -226px; }
+  .md-right-0 { right: 0px; }
+  .md-right-200 { right: 200px; }
+}
\ No newline at end of file
diff --git a/docs/build/client/8f2ff6d48aec3c3f0dc4.html b/docs/build/client/8f2ff6d48aec3c3f0dc4.html
index 0a4ed03..efa5823 100644
--- a/docs/build/client/8f2ff6d48aec3c3f0dc4.html
+++ b/docs/build/client/8f2ff6d48aec3c3f0dc4.html
@@ -18,123 +18,178 @@
   
   
   
-  
+  
   
   
   
   
 
-  
-    

-  
-  
-    Temple Logo
-  
-  
Temple

-  
+      
+        
+          

+            Component Publisher
+          

 
-        
-          Web components are a set of web platform APIs that allow you 
-          to create new custom, reusable, encapsulated HTML tags to use 
-          in web pages and web apps. Custom components and widgets build 
-          on the Web Component standards, will work across modern 
-          browsers, and can be used with any JavaScript library or 
-          framework that works with HTML.
-        
+          
+            Web components are a set of web platform APIs that allow you 
+            to create new custom, reusable, encapsulated HTML tags to use 
+            in web pages and web apps. Custom components and widgets build 
+            on the Web Component standards, will work across modern 
+            browsers, and can be used with any JavaScript library or 
+            framework that works with HTML.
+          
 
-        
-          Web components are based on existing web standards. Features 
-          to support web components are currently being added to the 
-          HTML and DOM specs, letting web developers easily extend HTML 
-          with new elements with encapsulated styling and custom behavior.
-        
+          
+            Web components are based on existing web standards. Features 
+            to support web components are currently being added to the 
+            HTML and DOM specs, letting web developers easily extend HTML 
+            with new elements with encapsulated styling and custom behavior.
+          
 
-        
-          
-          Note: Web components even work in React 
-          projects.
-        
+          
+            
+            Note: Web components even work in React 
+            projects.
+          
 
-        
-          First, create a project with the following structure and files.
-        
-        
-          

-            

-              
-                src/build.ts
+          
+            First, create a project with the following structure and files.
+          
+          
+            
+              

+                
+                  src/build.ts
+                
+                
+                  src/component.tml
+                
+                
+                  package.json
+                
+              

+            
+            
+              

+                
+                src
+              

+              
+                
+                build.ts
               
-              
-                src/component.tml
+              
+                
+                component.tml
               
-              
+              
+                
                 package.json
               
-            

-          

-          

-            

-              
-              src
-            

-            
-              
-              build.ts
-            
-            
-              
-              component.tml
-            
-            
-              
-              package.json
-            
-          

-          

-            

+            
+            
               
                 import http from 'http';
                 import temple from '@ossph/temple/compiler';
@@ -167,40 +222,40 @@ 

                     "build": "ts-node ./src/build.ts"
                   },
                   "dependencies": {
-                    "@ossph/temple": "0.1.4"
+                    "@ossph/temple": "0.1.6"
                   },
                   "devDependencies": {
-                    "@ossph/temple-dev": "0.1.4",
+                    "@ossph/temple-dev": "0.1.6",
                     "@types/node": "22.1.0",
                     "ts-node": "10.9.2",
                     "typescript": "5.5.4"
                   }
                 }
               
-            

-          

-        
+            
+          
 
-        
-          To test the build script and see the results, run the 
-          following command in terminal.
-        
-        
-          npm run build
-        
-        
-        
-      
-      

-    
+          
+            To test the build script and see the results, run the 
+            following command in terminal.
+          
+          
+            npm run build
+          
+          
+          
+          

+        
+      
+    
   
 
\ No newline at end of file
diff --git a/docs/build/client/8f2ff6d48aec3c3f0dc4.js b/docs/build/client/8f2ff6d48aec3c3f0dc4.js
index d992bbc..95ff927 100644
--- a/docs/build/client/8f2ff6d48aec3c3f0dc4.js
+++ b/docs/build/client/8f2ff6d48aec3c3f0dc4.js
@@ -1,20 +1,49 @@
-var TempleAPI=(()=>{var Ft=Object.create;var be=Object.defineProperty;var kt=Object.getOwnPropertyDescriptor;var St=Object.getOwnPropertyNames;var Pt=Object.getPrototypeOf,jt=Object.prototype.hasOwnProperty;var C=(t,e)=>()=>(e||t((e={exports:{}}).exports,e),e.exports),Ct=(t,e)=>{for(var r in e)be(t,r,{get:e[r],enumerable:!0})},Ve=(t,e,r,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let s of St(e))!jt.call(t,s)&&s!==r&&be(t,s,{get:()=>e[s],enumerable:!(i=kt(e,s))||i.enumerable});return t};var M=(t,e,r)=>(r=t!=null?Ft(Pt(t)):{},Ve(e||!t||!t.__esModule?be(r,"default",{value:t,enumerable:!0}):r,t)),Ot=t=>Ve(be({},"__esModule",{value:!0}),t);var De=C($e=>{"use strict";Object.defineProperty($e,"__esModule",{value:!0});var Me=class extends Error{static for(e,...r){return r.forEach(function(i){e=e.replace("%s",i)}),new this(e)}static forErrorsFound(e){let r=new this("Invalid Parameters");return r.errors=e,r}static require(e,r,...i){if(!e){for(let s of i)r=r.replace("%s",s);throw new this(r)}}constructor(e,r=500){super(),this.errors={},this.start=0,this.end=0,this.message=e,this.name=this.constructor.name,this.code=r}withCode(e){return this.code=e,this}withPosition(e,r){return this.start=e,this.end=r,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};$e.default=Me});var ne=C(re=>{"use strict";Object.defineProperty(re,"__esModule",{value:!0});re.TempleEmitter=void 0;var _e=class extends EventTarget{emit(e,r){return this.dispatchEvent(new CustomEvent(e,{detail:r})),this}on(e,r){if(e==="ready"&&document.readyState!=="loading"){let i=new CustomEvent("ready");return setTimeout(()=>r(i),1),this}return this.addEventListener(e,r),this}once(e,r){let i=s=>{this.unbind(e,i),r(s)};return this.on(e,i),this}unbind(e,r){return this.removeEventListener(e,r),this}};re.TempleEmitter=_e;var Ke=new _e;document.onreadystatechange=()=>{document.readyState!=="loading"&&Ke.emit("ready")};re.default=Ke});var Re=C(se=>{"use strict";var Mt=se&&se.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(se,"__esModule",{value:!0});var Le=Mt(ne()),qe=class{get attributes(){return Object.assign({},this._attributes)}get element(){return this._element}constructor(e,r){this._element=e,this._attributes=r}hasAttribute(e){return e in this._attributes}getAttribute(e){return this._attributes[e]}removeAttribute(e,r=!1){let i=this.getAttribute(e);return typeof i>"u"?this:(delete this._attributes[e],this._element.removeAttribute(e),r||Le.default.emit("attribute-remove",{element:this,key:e,previous:i}),this)}setAttribute(e,r,i=!1){if(typeof r>"u")return this.removeAttribute(e,i);let s=this.getAttribute(e);return s===r?this:(this._attributes[e]=r,typeof r=="string"&&this._element.setAttribute(e,r),i||(typeof s>"u"?Le.default.emit("attribute-create",{element:this,key:e,value:r}):Le.default.emit("attribute-update",{element:this,key:e,value:r,previous:s})),this)}setAttributes(e,r=!1){for(let[s,p]of Object.entries(e))this.setAttribute(s,p,r);let i=Object.keys(e);for(let s of Object.keys(this._attributes))i.includes(s)||this.removeAttribute(s,r);return this}};se.default=qe});var ye=C(ae=>{"use strict";var $t=ae&&ae.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ae,"__esModule",{value:!0});var Dt=$t(Re()),ve=class{static get elements(){return this._elements}static createComponent(e,r,i,s=[]){let p=document.createElement("template");p.innerHTML=`<${e}>`;let g=p.content.querySelector(`${e}`);Object.setPrototypeOf(g,r.prototype),g.constructor=r.constructor,g.constructor.component=r.component;for(let[_,y]of Object.entries(i))typeof y=="string"?g.setAttribute(_,y):y===!0&&g.setAttribute(_,_);return g._TempleAttributes=i,g.props=i,s.forEach(_=>g.appendChild(_)),g.register(),customElements.get(e)||g.connectedCallback(),this.register(g,i)}static createElement(e,r,i=[]){let s=document.createElement(e);for(let[p,h]of Object.entries(r))typeof h=="string"?s.setAttribute(p,h):h===!0&&s.setAttribute(p,p);return i.filter(p=>typeof p<"u").forEach(p=>s.appendChild(p)),this.register(s,r)}static createText(e,r=!1){return document.createTextNode(e)}static filter(e){let r=[];return this._elements.forEach((i,s)=>{e(i,s)&&r.push(i)}),r}static get(e){return this._elements.get(e)||null}static has(e){return this._elements.has(e)}static map(e){let r=[];return this._elements.forEach((i,s)=>{r.push(e(i,s))}),r}static register(e,r){if(this.has(e))return this.get(e);let i=new Dt.default(e,r||{});return this._elements.set(e,i),i}};ve._elements=new Map;ae.default=ve});var N=C(ie=>{"use strict";Object.defineProperty(ie,"__esModule",{value:!0});ie.TempleDataMap=void 0;var we=class{constructor(){window.__APP_DATA__||(window.__APP_DATA__={})}clear(){return window.__APP_DATA__={},this}delete(e){return this.has(e)?(delete window.__APP_DATA__[e],!0):!1}entries(){return Object.entries(window.__APP_DATA__)}has(e){return e in window.__APP_DATA__}get(e){return window.__APP_DATA__[e]}keys(){return Object.keys(window.__APP_DATA__)}set(e,r){return window.__APP_DATA__[e]=r,this}values(){return Object.values(window.__APP_DATA__)}};ie.TempleDataMap=we;var Lt=new we;ie.default=Lt});var et=C(oe=>{"use strict";var ze=oe&&oe.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(oe,"__esModule",{value:!0});var le=ze(ye()),xe=ze(ne()),Qe=ze(N()),Ie=class t extends HTMLElement{constructor(){super(...arguments),this._initiated=!1,this._template=null,this._attributes={},this._props={},this._children=void 0,this._rendering=!1}static register(){customElements.define(this.component[0],this)}get attr(){return this._attributes}get element(){return le.default.has(this)?le.default.get(this):le.default.register(this,this._TempleAttributes||{})}get metadata(){let[e,r]=this.constructor.component;return{tagname:e,classname:r}}get originalChildren(){return this._children}get initiated(){return this._initiated}get props(){return this._props}set props(e){this._props=Object.assign({},e),this._attributes=Object.fromEntries(Object.entries(e).filter(r=>typeof r[1]=="string"||r[1]===!0))}adoptedCallback(){this.render()}attributeChangedCallback(e,r,i){this.props=Object.assign(Object.assign({},this.props),{[e]:i}),this.render()}connectedCallback(){this.wait()}disconnectedCallback(){}getParentComponent(){let e=this.parentElement;for(;e;){if(e instanceof t)return e;e=e.parentElement}return null}register(){le.default.register(this,this._props)}render(){let e=this.getParentComponent();if(e&&!e.initiated)return;if(this._rendering)return;this._rendering=!0,Qe.default.set("current",this);let r=this.styles();this._template?xe.default.emit("unmounted",this):this._template=this.template();let i=this._template().filter(Boolean);if(r.length===0)this.textContent="",i.forEach(s=>this.appendChild(s));else{this.shadowRoot||this.attachShadow({mode:"open"});let s=this.shadowRoot;this.textContent="",s.textContent="";let p=document.createElement("style");p.innerText=r,s.appendChild(p),i.forEach(h=>{var g;return(g=this.shadowRoot)===null||g===void 0?void 0:g.appendChild(h)})}return Qe.default.delete("current"),this._initiated=!0,xe.default.emit("mounted",this),this._rendering=!1,this.shadowRoot?this.shadowRoot.innerHTML:this.innerHTML}wait(){if(document.readyState!=="loading")this._update();else{let e=()=>{this._update(),xe.default.unbind("ready",e)};xe.default.on("ready",e)}}_toNodeList(e){return e instanceof Node?[e]:Array.isArray(e)&&e.every(r=>r instanceof Node)?e:[le.default.createText(String(e))]}_update(){typeof this._children>"u"&&(this._children=Array.from(this.childNodes||[]));let e=this.element;e&&(this.props=Object.assign({},e.attributes),this.render()),this._initiated||this.render()}};oe.default=Ie});var tt=C(ue=>{"use strict";var qt=ue&&ue.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ue,"__esModule",{value:!0});var Rt=qt(N());function It(t){let e=Rt.default.get("env")||{};return t?e[t]||null:e}ue.default=It});var Ne=C(ce=>{"use strict";var zt=ce&&ce.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ce,"__esModule",{value:!0});ce.default=Nt;var rt=zt(N());function Nt(t=null){return t||(t=rt.default.get("current")||null),t?t==="document"?rt.default.get("props")||{}:t.props:{}}});var nt=C(de=>{"use strict";var Ht=de&&de.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(de,"__esModule",{value:!0});de.default=Gt;var Bt=Ht(Ne());function Gt(t=null){return(0,Bt.default)(t).class}});var at=C(U=>{"use strict";var Ut=U&&U.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(U,"__esModule",{value:!0});U.innerHTML=Wt;U.default=st;var Zt=Ut(N());function Wt(t=null){let e=st(t),r=document.createElement("template");return r.append(...e),r.innerHTML}function st(t=null){return t||(t=Zt.default.get("current")||null),t?t.originalChildren||[]:[]}});var ot=C(H=>{"use strict";var lt=H&&H.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(H,"__esModule",{value:!0});H.SignalRegistry=void 0;H.default=Xt;var it=lt(De()),Jt=lt(N()),Z=class t{static observe(e,r){let i={getter:()=>s.raw,setter:h=>h},s={raw:r,getter(h){return i.getter=h,s},setter(h){return i.setter=h,s}};Object.defineProperty(s,"value",{get(){return i.getter()},set(h){let g=i.setter(h),_=t.serialize(g)!==t.serialize(s.raw);s.raw=g,_&&e.render()}});let p=this._observers.get(e);return p?(p.observed++,p.values.push(s)):this._observers.set(e,{observed:1,values:[s]}),s}static observer(e){return this._observers.get(e)||null}static serialize(e){return JSON.stringify(e)}};H.SignalRegistry=Z;Z._observers=new Map;function Xt(t,e=null){if(e||(e=Jt.default.get("current")||null),!e)throw it.default.for("Signals can only be created within a Temple component");if(!e.initiated)return Z.observe(e,t);let r=Z.observer(e);if(!r)throw it.default.for("State mismatch");return r.values[r.observed++%r.values.length]}});var pt=C(Ae=>{"use strict";var ct=Ae&&Ae.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Ae,"__esModule",{value:!0});var ut=ct(ye()),dt=ct(ne()),ft=(t,e)=>Array.from(t.querySelectorAll("*")).filter(r=>{let i=ut.default.get(r);return i&&i.hasAttribute(e)}).map(r=>ut.default.get(r));function He(t,e){dt.default.on("mounted",r=>{if(!r.detail)return;let i=r.detail;ft(i.shadowRoot||i,t).forEach(e)})}function Yt(t,e){dt.default.on("unmounted",r=>{if(!r.detail)return;let i=r.detail;ft(i.shadowRoot||i,t).forEach(e)})}He("mount",t=>{let e=t.getAttribute("mount");if(typeof e=="function"){let r=new CustomEvent("mount",{detail:{node:t,target:t.element}});e(r)}});Yt("unmount",t=>{let e=t.getAttribute("unmount");if(typeof e=="function"){let r=new CustomEvent("unmount",{detail:{node:t,target:t.element}});e(r)}});He("if",t=>{let e=t.getAttribute("if");(e===!1||e==="false"||typeof e=="function"&&!e())&&t.element.remove()});["click","dblclick","mousedown","mouseup","mousemove","mouseover","mouseout","wheel","keydown","keypress","keyup","blur","change","contextmenu","focus","input","submit","invalid","reset","search","select","copy","cut","paste","drag","dragstart","dragend","dragover","dragenter","dragleave","drop","scroll","durationchange","ended","error","loadeddata","loadedmetadata","loadstart","pause","play","playing","progress","ratechange","seeked","seeking","stalled","suspend","timeupdate","volumechange","waiting","animationstart","animationend","animationiteration","transitionend","toggle"].forEach(t=>He(t,e=>{let r=e.getAttribute(t);typeof r=="function"&&(e.element.removeEventListener(t,r),e.element.addEventListener(t,r))}))});var Be=C(m=>{"use strict";var Vt=m&&m.__createBinding||(Object.create?function(t,e,r,i){i===void 0&&(i=r);var s=Object.getOwnPropertyDescriptor(e,r);(!s||("get"in s?!e.__esModule:s.writable||s.configurable))&&(s={enumerable:!0,get:function(){return e[r]}}),Object.defineProperty(t,i,s)}:function(t,e,r,i){i===void 0&&(i=r),t[i]=e[r]}),Kt=m&&m.__setModuleDefault||(Object.create?function(t,e){Object.defineProperty(t,"default",{enumerable:!0,value:e})}:function(t,e){t.default=e}),Te=m&&m.__importStar||function(t){if(t&&t.__esModule)return t;var e={};if(t!=null)for(var r in t)r!=="default"&&Object.prototype.hasOwnProperty.call(t,r)&&Vt(e,t,r);return Kt(e,t),e},B=m&&m.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(m,"__esModule",{value:!0});m.SignalRegistry=m.TempleException=m.TempleEmitter=m.TempleElement=m.TempleRegistry=m.TempleComponent=m.TempleDataMap=m.emitter=m.signal=m.innerHTML=m.children=m.classnames=m.props=m.env=m.data=void 0;var Qt=B(De());m.TempleException=Qt.default;var er=B(et());m.TempleComponent=er.default;var tr=B(ye());m.TempleRegistry=tr.default;var rr=B(Re());m.TempleElement=rr.default;var gt=Te(ne());m.emitter=gt.default;Object.defineProperty(m,"TempleEmitter",{enumerable:!0,get:function(){return gt.TempleEmitter}});var ht=Te(N());m.data=ht.default;Object.defineProperty(m,"TempleDataMap",{enumerable:!0,get:function(){return ht.TempleDataMap}});var nr=B(tt());m.env=nr.default;var sr=B(Ne());m.props=sr.default;var ar=B(nt());m.classnames=ar.default;var mt=Te(at());m.children=mt.default;Object.defineProperty(m,"innerHTML",{enumerable:!0,get:function(){return mt.innerHTML}});var bt=Te(ot());m.signal=bt.default;Object.defineProperty(m,"SignalRegistry",{enumerable:!0,get:function(){return bt.SignalRegistry}});pt()});var q=C((Tr,_t)=>{_t.exports={...Be()}});var vt=C((Fr,Fe)=>{var ir=typeof window<"u"?window:typeof WorkerGlobalScope<"u"&&self instanceof WorkerGlobalScope?self:{};var c=function(t){var e=/(?:^|\s)lang(?:uage)?-([\w-]+)(?=\s|$)/i,r=0,i={},s={manual:t.Prism&&t.Prism.manual,disableWorkerMessageHandler:t.Prism&&t.Prism.disableWorkerMessageHandler,util:{encode:function n(a){return a instanceof p?new p(a.type,n(a.content),a.alias):Array.isArray(a)?a.map(n):a.replace(/&/g,"&").replace(/"u")return null;if("currentScript"in document)return document.currentScript;try{throw new Error}catch(o){var n=(/at [^(\r\n]*\((.*):[^:]+:[^:]+\)$/i.exec(o.stack)||[])[1];if(n){var a=document.getElementsByTagName("script");for(var l in a)if(a[l].src==n)return a[l]}return null}},isActive:function(n,a,l){for(var o="no-"+a;n;){var u=n.classList;if(u.contains(a))return!0;if(u.contains(o))return!1;n=n.parentElement}return!!l}},languages:{plain:i,plaintext:i,text:i,txt:i,extend:function(n,a){var l=s.util.clone(s.languages[n]);for(var o in a)l[o]=a[o];return l},insertBefore:function(n,a,l,o){o=o||s.languages;var u=o[n],f={};for(var b in u)if(u.hasOwnProperty(b)){if(b==a)for(var d in l)l.hasOwnProperty(d)&&(f[d]=l[d]);l.hasOwnProperty(b)||(f[b]=u[b])}var F=o[n];return o[n]=f,s.languages.DFS(s.languages,function(P,R){R===F&&P!=n&&(this[P]=f)}),f},DFS:function n(a,l,o,u){u=u||{};var f=s.util.objId;for(var b in a)if(a.hasOwnProperty(b)){l.call(a,b,a[b],o||b);var d=a[b],F=s.util.type(d);F==="Object"&&!u[f(d)]?(u[f(d)]=!0,n(d,l,null,u)):F==="Array"&&!u[f(d)]&&(u[f(d)]=!0,n(d,l,b,u))}}},plugins:{},highlightAll:function(n,a){s.highlightAllUnder(document,n,a)},highlightAllUnder:function(n,a,l){var o={callback:l,container:n,selector:'code[class*="language-"], [class*="language-"] code, code[class*="lang-"], [class*="lang-"] code'};s.hooks.run("before-highlightall",o),o.elements=Array.prototype.slice.apply(o.container.querySelectorAll(o.selector)),s.hooks.run("before-all-elements-highlight",o);for(var u=0,f;f=o.elements[u++];)s.highlightElement(f,a===!0,o.callback)},highlightElement:function(n,a,l){var o=s.util.getLanguage(n),u=s.languages[o];s.util.setLanguage(n,o);var f=n.parentElement;f&&f.nodeName.toLowerCase()==="pre"&&s.util.setLanguage(f,o);var b=n.textContent,d={element:n,language:o,grammar:u,code:b};function F(R){d.highlightedCode=R,s.hooks.run("before-insert",d),d.element.innerHTML=d.highlightedCode,s.hooks.run("after-highlight",d),s.hooks.run("complete",d),l&&l.call(d.element)}if(s.hooks.run("before-sanity-check",d),f=d.element.parentElement,f&&f.nodeName.toLowerCase()==="pre"&&!f.hasAttribute("tabindex")&&f.setAttribute("tabindex","0"),!d.code){s.hooks.run("complete",d),l&&l.call(d.element);return}if(s.hooks.run("before-highlight",d),!d.grammar){F(s.util.encode(d.code));return}if(a&&t.Worker){var P=new Worker(s.filename);P.onmessage=function(R){F(R.data)},P.postMessage(JSON.stringify({language:d.language,code:d.code,immediateClose:!0}))}else F(s.highlight(d.code,d.grammar,d.language))},highlight:function(n,a,l){var o={code:n,grammar:a,language:l};if(s.hooks.run("before-tokenize",o),!o.grammar)throw new Error('The language "'+o.language+'" has no grammar.');return o.tokens=s.tokenize(o.code,o.grammar),s.hooks.run("after-tokenize",o),p.stringify(s.util.encode(o.tokens),o.language)},tokenize:function(n,a){var l=a.rest;if(l){for(var o in l)a[o]=l[o];delete a.rest}var u=new _;return y(u,u.head,n),g(n,u,a,u.head,0),E(u)},hooks:{all:{},add:function(n,a){var l=s.hooks.all;l[n]=l[n]||[],l[n].push(a)},run:function(n,a){var l=s.hooks.all[n];if(!(!l||!l.length))for(var o=0,u;u=l[o++];)u(a)}},Token:p};t.Prism=s;function p(n,a,l,o){this.type=n,this.content=a,this.alias=l,this.length=(o||"").length|0}p.stringify=function n(a,l){if(typeof a=="string")return a;if(Array.isArray(a)){var o="";return a.forEach(function(F){o+=n(F,l)}),o}var u={type:a.type,content:n(a.content,l),tag:"span",classes:["token",a.type],attributes:{},language:l},f=a.alias;f&&(Array.isArray(f)?Array.prototype.push.apply(u.classes,f):u.classes.push(f)),s.hooks.run("wrap",u);var b="";for(var d in u.attributes)b+=" "+d+'="'+(u.attributes[d]||"").replace(/"/g,""")+'"';return"<"+u.tag+' class="'+u.classes.join(" ")+'"'+b+">"+u.content+""};function h(n,a,l,o){n.lastIndex=a;var u=n.exec(l);if(u&&o&&u[1]){var f=u[1].length;u.index+=f,u[0]=u[0].slice(f)}return u}function g(n,a,l,o,u,f){for(var b in l)if(!(!l.hasOwnProperty(b)||!l[b])){var d=l[b];d=Array.isArray(d)?d:[d];for(var F=0;F=f.reach);L+=j.value.length,j=j.next){var G=j.value;if(a.length>n.length)return;if(!(G instanceof p)){var pe=1,D;if(Je){if(D=h(Xe,L,n,We),!D||D.index>=n.length)break;var ge=D.index,Tt=D.index+D[0].length,I=L;for(I+=j.value.length;ge>=I;)j=j.next,I+=j.value.length;if(I-=j.value.length,L=I,j.value instanceof p)continue;for(var te=j;te!==a.tail&&(If.reach&&(f.reach=Ce);var me=j.prev;je&&(me=y(a,me,je),L+=je.length),w(a,me,pe);var Et=new p(b,R?s.tokenize(he,R):he,xt,he);if(j=y(a,me,Et),Ye&&y(a,j,Ye),pe>1){var Oe={cause:b+","+F,reach:Ce};g(n,a,l,j.prev,L,Oe),f&&Oe.reach>f.reach&&(f.reach=Oe.reach)}}}}}}function _(){var n={value:null,prev:null,next:null},a={value:null,prev:n,next:null};n.next=a,this.head=n,this.tail=a,this.length=0}function y(n,a,l){var o=a.next,u={value:l,prev:a,next:o};return a.next=u,o.prev=u,n.length++,u}function w(n,a,l){for(var o=a.next,u=0;u/,greedy:!0},prolog:{pattern:/<\?[\s\S]+?\?>/,greedy:!0},doctype:{pattern:/"'[\]]|"[^"]*"|'[^']*')+(?:\[(?:[^<"'\]]|"[^"]*"|'[^']*'|<(?!!--)|)*\]\s*)?>/i,greedy:!0,inside:{"internal-subset":{pattern:/(^[^\[]*\[)[\s\S]+(?=\]>$)/,lookbehind:!0,greedy:!0,inside:null},string:{pattern:/"[^"]*"|'[^']*'/,greedy:!0},punctuation:/^$|[[\]]/,"doctype-tag":/^DOCTYPE/i,name:/[^\s<>'"]+/}},cdata:{pattern://i,greedy:!0},tag:{pattern:/<\/?(?!\d)[^\s>\/=$<%]+(?:\s(?:\s*[^\s>\/=]+(?:\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))|(?=[\s/>])))+)?\s*\/?>/,greedy:!0,inside:{tag:{pattern:/^<\/?[^\s>\/]+/,inside:{punctuation:/^<\/?/,namespace:/^[^\s>\/:]+:/}},"special-attr":[],"attr-value":{pattern:/=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+)/,inside:{punctuation:[{pattern:/^=/,alias:"attr-equals"},{pattern:/^(\s*)["']|["']$/,lookbehind:!0}]}},punctuation:/\/?>/,"attr-name":{pattern:/[^\s>\/]+/,inside:{namespace:/^[^\s>\/:]+:/}}}},entity:[{pattern:/&[\da-z]{1,8};/i,alias:"named-entity"},/&#x?[\da-f]{1,8};/i]};c.languages.markup.tag.inside["attr-value"].inside.entity=c.languages.markup.entity;c.languages.markup.doctype.inside["internal-subset"].inside=c.languages.markup;c.hooks.add("wrap",function(t){t.type==="entity"&&(t.attributes.title=t.content.replace(/&/,"&"))});Object.defineProperty(c.languages.markup.tag,"addInlined",{value:function(e,r){var i={};i["language-"+r]={pattern:/(^$)/i,lookbehind:!0,inside:c.languages[r]},i.cdata=/^$/i;var s={"included-cdata":{pattern://i,inside:i}};s["language-"+r]={pattern:/[\s\S]+/,inside:c.languages[r]};var p={};p[e]={pattern:RegExp(/(<__[^>]*>)(?:))*\]\]>|(?!)/.source.replace(/__/g,function(){return e}),"i"),lookbehind:!0,greedy:!0,inside:s},c.languages.insertBefore("markup","cdata",p)}});Object.defineProperty(c.languages.markup.tag,"addAttribute",{value:function(t,e){c.languages.markup.tag.inside["special-attr"].push({pattern:RegExp(/(^|["'\s])/.source+"(?:"+t+")"+/\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))/.source,"i"),lookbehind:!0,inside:{"attr-name":/^[^\s=]+/,"attr-value":{pattern:/=[\s\S]+/,inside:{value:{pattern:/(^=\s*(["']|(?!["'])))\S[\s\S]*(?=\2$)/,lookbehind:!0,alias:[e,"language-"+e],inside:c.languages[e]},punctuation:[{pattern:/^=/,alias:"attr-equals"},/"|'/]}}}})}});c.languages.html=c.languages.markup;c.languages.mathml=c.languages.markup;c.languages.svg=c.languages.markup;c.languages.xml=c.languages.extend("markup",{});c.languages.ssml=c.languages.xml;c.languages.atom=c.languages.xml;c.languages.rss=c.languages.xml;(function(t){var e=/(?:"(?:\\(?:\r\n|[\s\S])|[^"\\\r\n])*"|'(?:\\(?:\r\n|[\s\S])|[^'\\\r\n])*')/;t.languages.css={comment:/\/\*[\s\S]*?\*\//,atrule:{pattern:RegExp("@[\\w-](?:"+/[^;{\s"']|\s+(?!\s)/.source+"|"+e.source+")*?"+/(?:;|(?=\s*\{))/.source),inside:{rule:/^@[\w-]+/,"selector-function-argument":{pattern:/(\bselector\s*\(\s*(?![\s)]))(?:[^()\s]|\s+(?![\s)])|\((?:[^()]|\([^()]*\))*\))+(?=\s*\))/,lookbehind:!0,alias:"selector"},keyword:{pattern:/(^|[^\w-])(?:and|not|only|or)(?![\w-])/,lookbehind:!0}}},url:{pattern:RegExp("\\burl\\((?:"+e.source+"|"+/(?:[^\\\r\n()"']|\\[\s\S])*/.source+")\\)","i"),greedy:!0,inside:{function:/^url/i,punctuation:/^\(|\)$/,string:{pattern:RegExp("^"+e.source+"$"),alias:"url"}}},selector:{pattern:RegExp(`(^|[{}\\s])[^{}\\s](?:[^{};"'\\s]|\\s+(?![\\s{])|`+e.source+")*(?=\\s*\\{)"),lookbehind:!0},string:{pattern:e,greedy:!0},property:{pattern:/(^|[^-\w\xA0-\uFFFF])(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*(?=\s*:)/i,lookbehind:!0},important:/!important\b/i,function:{pattern:/(^|[^-a-z0-9])[-a-z0-9]+(?=\()/i,lookbehind:!0},punctuation:/[(){};:,]/},t.languages.css.atrule.inside.rest=t.languages.css;var r=t.languages.markup;r&&(r.tag.addInlined("style","css"),r.tag.addAttribute("style","css"))})(c);c.languages.clike={comment:[{pattern:/(^|[^\\])\/\*[\s\S]*?(?:\*\/|$)/,lookbehind:!0,greedy:!0},{pattern:/(^|[^\\:])\/\/.*/,lookbehind:!0,greedy:!0}],string:{pattern:/(["'])(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/,greedy:!0},"class-name":{pattern:/(\b(?:class|extends|implements|instanceof|interface|new|trait)\s+|\bcatch\s+\()[\w.\\]+/i,lookbehind:!0,inside:{punctuation:/[.\\]/}},keyword:/\b(?:break|catch|continue|do|else|finally|for|function|if|in|instanceof|new|null|return|throw|try|while)\b/,boolean:/\b(?:false|true)\b/,function:/\b\w+(?=\()/,number:/\b0x[\da-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:e[+-]?\d+)?/i,operator:/[<>]=?|[!=]=?=?|--?|\+\+?|&&?|\|\|?|[?*/~^%]/,punctuation:/[{}[\];(),.:]/};c.languages.javascript=c.languages.extend("clike",{"class-name":[c.languages.clike["class-name"],{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$A-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\.(?:constructor|prototype))/,lookbehind:!0}],keyword:[{pattern:/((?:^|\})\s*)catch\b/,lookbehind:!0},{pattern:/(^|[^.]|\.\.\.\s*)\b(?:as|assert(?=\s*\{)|async(?=\s*(?:function\b|\(|[$\w\xA0-\uFFFF]|$))|await|break|case|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally(?=\s*(?:\{|$))|for|from(?=\s*(?:['"]|$))|function|(?:get|set)(?=\s*(?:[#\[$\w\xA0-\uFFFF]|$))|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)\b/,lookbehind:!0}],function:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*(?:\.\s*(?:apply|bind|call)\s*)?\()/,number:{pattern:RegExp(/(^|[^\w$])/.source+"(?:"+(/NaN|Infinity/.source+"|"+/0[bB][01]+(?:_[01]+)*n?/.source+"|"+/0[oO][0-7]+(?:_[0-7]+)*n?/.source+"|"+/0[xX][\dA-Fa-f]+(?:_[\dA-Fa-f]+)*n?/.source+"|"+/\d+(?:_\d+)*n/.source+"|"+/(?:\d+(?:_\d+)*(?:\.(?:\d+(?:_\d+)*)?)?|\.\d+(?:_\d+)*)(?:[Ee][+-]?\d+(?:_\d+)*)?/.source)+")"+/(?![\w$])/.source),lookbehind:!0},operator:/--|\+\+|\*\*=?|=>|&&=?|\|\|=?|[!=]==|<<=?|>>>?=?|[-+*/%&|^!=<>]=?|\.{3}|\?\?=?|\?\.?|[~:]/});c.languages.javascript["class-name"][0].pattern=/(\b(?:class|extends|implements|instanceof|interface|new)\s+)[\w.\\]+/;c.languages.insertBefore("javascript","keyword",{regex:{pattern:RegExp(/((?:^|[^$\w\xA0-\uFFFF."'\])\s]|\b(?:return|yield))\s*)/.source+/\//.source+"(?:"+/(?:\[(?:[^\]\\\r\n]|\\.)*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}/.source+"|"+/(?:\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.)*\])*\])*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}v[dgimyus]{0,7}/.source+")"+/(?=(?:\s|\/\*(?:[^*]|\*(?!\/))*\*\/)*(?:$|[\r\n,.;:})\]]|\/\/))/.source),lookbehind:!0,greedy:!0,inside:{"regex-source":{pattern:/^(\/)[\s\S]+(?=\/[a-z]*$)/,lookbehind:!0,alias:"language-regex",inside:c.languages.regex},"regex-delimiter":/^\/|\/$/,"regex-flags":/^[a-z]+$/}},"function-variable":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*[=:]\s*(?:async\s*)?(?:\bfunction\b|(?:\((?:[^()]|\([^()]*\))*\)|(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)\s*=>))/,alias:"function"},parameter:[{pattern:/(function(?:\s+(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)?\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\))/,lookbehind:!0,inside:c.languages.javascript},{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$a-z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*=>)/i,lookbehind:!0,inside:c.languages.javascript},{pattern:/(\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*=>)/,lookbehind:!0,inside:c.languages.javascript},{pattern:/((?:\b|\s|^)(?!(?:as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)(?![$\w\xA0-\uFFFF]))(?:(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*)\(\s*|\]\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*\{)/,lookbehind:!0,inside:c.languages.javascript}],constant:/\b[A-Z](?:[A-Z_]|\dx?)*\b/});c.languages.insertBefore("javascript","string",{hashbang:{pattern:/^#!.*/,greedy:!0,alias:"comment"},"template-string":{pattern:/`(?:\\[\s\S]|\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}|(?!\$\{)[^\\`])*`/,greedy:!0,inside:{"template-punctuation":{pattern:/^`|`$/,alias:"string"},interpolation:{pattern:/((?:^|[^\\])(?:\\{2})*)\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}/,lookbehind:!0,inside:{"interpolation-punctuation":{pattern:/^\$\{|\}$/,alias:"punctuation"},rest:c.languages.javascript}},string:/[\s\S]+/}},"string-property":{pattern:/((?:^|[,{])[ \t]*)(["'])(?:\\(?:\r\n|[\s\S])|(?!\2)[^\\\r\n])*\2(?=\s*:)/m,lookbehind:!0,greedy:!0,alias:"property"}});c.languages.insertBefore("javascript","operator",{"literal-property":{pattern:/((?:^|[,{])[ \t]*)(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*:)/m,lookbehind:!0,alias:"property"}});c.languages.markup&&(c.languages.markup.tag.addInlined("script","javascript"),c.languages.markup.tag.addAttribute(/on(?:abort|blur|change|click|composition(?:end|start|update)|dblclick|error|focus(?:in|out)?|key(?:down|up)|load|mouse(?:down|enter|leave|move|out|over|up)|reset|resize|scroll|select|slotchange|submit|unload|wheel)/.source,"javascript"));c.languages.js=c.languages.javascript;(function(){if(typeof c>"u"||typeof document>"u")return;Element.prototype.matches||(Element.prototype.matches=Element.prototype.msMatchesSelector||Element.prototype.webkitMatchesSelector);var t="Loading\u2026",e=function(x,v){return"\u2716 Error "+x+" while fetching file: "+v},r="\u2716 Error: File does not exist or is empty",i={js:"javascript",py:"python",rb:"ruby",ps1:"powershell",psm1:"powershell",sh:"bash",bat:"batch",h:"c",tex:"latex"},s="data-src-status",p="loading",h="loaded",g="failed",_="pre[data-src]:not(["+s+'="'+h+'"]):not(['+s+'="'+p+'"])';function y(x,v,A){var n=new XMLHttpRequest;n.open("GET",x,!0),n.onreadystatechange=function(){n.readyState==4&&(n.status<400&&n.responseText?v(n.responseText):n.status>=400?A(e(n.status,n.statusText)):A(r))},n.send(null)}function w(x){var v=/^\s*(\d+)\s*(?:(,)\s*(?:(\d+)\s*)?)?$/.exec(x||"");if(v){var A=Number(v[1]),n=v[2],a=v[3];return n?a?[A,Number(a)]:[A,void 0]:[A,A]}}c.hooks.add("before-highlightall",function(x){x.selector+=", "+_}),c.hooks.add("before-sanity-check",function(x){var v=x.element;if(v.matches(_)){x.code="",v.setAttribute(s,p);var A=v.appendChild(document.createElement("CODE"));A.textContent=t;var n=v.getAttribute("data-src"),a=x.language;if(a==="none"){var l=(/\.(\w+)$/.exec(n)||[,"none"])[1];a=i[l]||l}c.util.setLanguage(A,a),c.util.setLanguage(v,a);var o=c.plugins.autoloader;o&&o.loadLanguages(a),y(n,function(u){v.setAttribute(s,h);var f=w(v.getAttribute("data-range"));if(f){var b=u.split(/\r\n?|\n/g),d=f[0],F=f[1]==null?b.length:f[1];d<0&&(d+=b.length),d=Math.max(0,Math.min(d-1,b.length)),F<0&&(F+=b.length),F=Math.max(0,Math.min(F,b.length)),u=b.slice(d,F).join(`
-`),v.hasAttribute("data-start")||v.setAttribute("data-start",String(d+1))}A.textContent=u,c.highlightElement(A)},function(u){v.setAttribute(s,g),A.textContent=u})}}),c.plugins.fileHighlight={highlight:function(v){for(var A=(v||document).querySelectorAll(_),n=0,a;a=A[n++];)c.highlightElement(a)}};var E=!1;c.fileHighlight=function(){E||(console.warn("Prism.fileHighlight is deprecated. Use `Prism.plugins.fileHighlight.highlight` instead."),E=!0),c.plugins.fileHighlight.highlight.apply(this,arguments)}})()});var J=C((kr,yt)=>{yt.exports={...Be()}});var ur={};Ct(ur,{BUILD_ID:()=>or,TempleComponent:()=>k.TempleComponent,TempleElement:()=>k.TempleElement,TempleEmitter:()=>k.TempleEmitter,TempleException:()=>k.TempleException,TempleRegistry:()=>k.TempleRegistry,children:()=>k.children,components:()=>lr,data:()=>k.data,emitter:()=>k.emitter,props:()=>k.props,signal:()=>k.signal});var $=M(q());var Ee=M(q()),W=class extends Ee.TempleComponent{static component=["main","Main_fd7f1af6410c5b5c8e1f"];styles(){return""}template(){let e=this.props,r=()=>this.originalChildren;return()=>[Ee.TempleRegistry.createElement("main",{},[...this._toNodeList(r())]).element]}};var T=M(q()),Ge=M(vt()),wt=M(J()),X=class extends T.TempleComponent{static component=["code","Code_6f36bc13bb6a166c7abc"];styles(){return`:host {
+var TempleAPI=(()=>{var Zt=Object.create;var Oe=Object.defineProperty;var Jt=Object.getOwnPropertyDescriptor;var Xt=Object.getOwnPropertyNames;var Yt=Object.getPrototypeOf,Vt=Object.prototype.hasOwnProperty;var M=(t,e)=>()=>(e||t((e={exports:{}}).exports,e),e.exports),Kt=(t,e)=>{for(var r in e)Oe(t,r,{get:e[r],enumerable:!0})},vt=(t,e,r,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let s of Xt(e))!Vt.call(t,s)&&s!==r&&Oe(t,s,{get:()=>e[s],enumerable:!(i=Jt(e,s))||i.enumerable});return t};var T=(t,e,r)=>(r=t!=null?Zt(Yt(t)):{},vt(e||!t||!t.__esModule?Oe(r,"default",{value:t,enumerable:!0}):r,t)),Qt=t=>vt(Oe({},"__esModule",{value:!0}),t);var _e=M(nt=>{"use strict";Object.defineProperty(nt,"__esModule",{value:!0});var st=class extends Error{static for(e,...r){return r.forEach(function(i){e=e.replace("%s",i)}),new this(e)}static forErrorsFound(e){let r=new this("Invalid Parameters");return r.errors=e,r}static require(e,r,...i){if(!e){for(let s of i)r=r.replace("%s",s);throw new this(r)}}constructor(e,r=500){super(),this.errors={},this.start=0,this.end=0,this.message=e,this.name=this.constructor.name,this.code=r}withCode(e){return this.code=e,this}withPosition(e,r){return this.start=e,this.end=r,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};nt.default=st});var Re=M(j=>{"use strict";var er=j&&j.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(j,"__esModule",{value:!0});j.match=j.TempleEmitter=j.events=void 0;j.bindAttribute=B;j.unbindAttribute=xt;var yt=er(qe());j.events=["click","dblclick","mousedown","mouseup","mousemove","mouseover","mouseout","wheel","keydown","keypress","keyup","blur","change","contextmenu","focus","input","submit","invalid","reset","search","select","copy","cut","paste","drag","dragstart","dragend","dragover","dragenter","dragleave","drop","scroll","durationchange","ended","error","loadeddata","loadedmetadata","loadstart","pause","play","playing","progress","ratechange","seeked","seeking","stalled","suspend","timeupdate","volumechange","waiting","animationstart","animationend","animationiteration","transitionend","toggle"];var $e=class extends EventTarget{emit(e,r){return this.dispatchEvent(new CustomEvent(e,{detail:r})),this}on(e,r){if(e==="ready"&&document.readyState!=="loading"){let i=new CustomEvent("ready");return setTimeout(()=>r(i),1),this}return this.addEventListener(e,r),this}once(e,r){let i=s=>{this.unbind(e,i),r(s)};return this.on(e,i),this}unbind(e,r){return this.removeEventListener(e,r),this}};j.TempleEmitter=$e;var tr=(t,e)=>Array.from(t.querySelectorAll("*")).filter(r=>{let i=yt.default.get(r),s=i&&i.hasAttribute(e)&&!i.hasEvent(e);return s&&i.addEvent(e),s}).map(r=>yt.default.get(r));j.match=tr;function B(t,e){Ne.on("mounted",r=>{if(!r.detail)return;let i=r.detail;(0,j.match)(i.shadowRoot||i,t).forEach(e)})}function xt(t,e){Ne.on("unmounted",r=>{if(!r.detail)return;let i=r.detail;(0,j.match)(i.shadowRoot||i,t).forEach(e)})}var Ne=new $e;j.default=(document.onreadystatechange=()=>{document.readyState!=="loading"&&Ne.emit("ready")},B("mount",t=>{let e=t.getAttribute("mount");if(typeof e=="function"){let r=new CustomEvent("mount",{detail:{node:t,target:t.element}});e(r)}}),xt("unmount",t=>{let e=t.getAttribute("unmount");if(typeof e=="function"){let r=new CustomEvent("unmount",{detail:{node:t,target:t.element}});e(r)}}),B("connect",t=>{let e=t.getAttribute("connect");if(typeof e=="function"){let r=new CustomEvent("connect",{detail:{node:t,target:t.element}});e(r)}}),B("disconnect",t=>{let e=t.getAttribute("disconnect");if(typeof e=="function"){let r=new CustomEvent("disconnect",{detail:{node:t,target:t.element}});e(r)}}),B("adopt",t=>{let e=t.getAttribute("adopt");if(typeof e=="function"){let r=new CustomEvent("adopt",{detail:{node:t,target:t.element}});e(r)}}),B("if",t=>{let e=t.getAttribute("if");(e===!1||e==="false"||typeof e=="function"&&!e())&&t.element.remove()}),j.events.forEach(t=>B(t,e=>{let r=e.getAttribute(t);typeof r=="function"&&(e.element.removeEventListener(t,r),e.element.addEventListener(t,r))})),Ne)});var lt=M(ve=>{"use strict";var rr=ve&&ve.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ve,"__esModule",{value:!0});var at=rr(Re()),it=class{get attributes(){return Object.assign({},this._attributes)}get element(){return this._element}get events(){return this._events}constructor(e,r){this._events=new Set,this._element=e,this._attributes=r}addEvent(e){return this._events.add(e),this}getAttribute(e){return this._attributes[e]}hasAttribute(e){return e in this._attributes}hasEvent(e){return this._events.has(e)}removeAttribute(e,r=!1){let i=this.getAttribute(e);return typeof i>"u"?this:(delete this._attributes[e],this._element.removeAttribute(e),r||at.default.emit("attribute-remove",{element:this,key:e,previous:i}),this)}setAttribute(e,r,i=!1){if(typeof r>"u")return this.removeAttribute(e,i);let s=this.getAttribute(e);return s===r?this:(this._attributes[e]=r,typeof r=="string"&&this._element.setAttribute(e,r),i||(typeof s>"u"?at.default.emit("attribute-create",{element:this,key:e,value:r}):at.default.emit("attribute-update",{element:this,key:e,value:r,previous:s})),this)}setAttributes(e,r=!1){for(let[s,d]of Object.entries(e))this.setAttribute(s,d,r);let i=Object.keys(e);for(let s of Object.keys(this._attributes))i.includes(s)||this.removeAttribute(s,r);return this}};ve.default=it});var qe=M(ye=>{"use strict";var sr=ye&&ye.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ye,"__esModule",{value:!0});var nr=sr(lt()),At=document.createElement("textarea"),ar=t=>(At.innerHTML=t,At.value),He=class{static get elements(){return this._elements}static createComponent(e,r,i,s=[]){let d=document.createElement("template");d.innerHTML=`<${e}>`;let b=d.content.querySelector(`${e}`);return Object.setPrototypeOf(b,r.prototype),b.constructor=r.constructor,b.constructor.component=r.component,b.register(i,s),b.element}static createElement(e,r,i=[]){let s=document.createElement(e);for(let[d,_]of Object.entries(r))typeof _=="string"?s.setAttribute(d,_):_===!0&&s.setAttribute(d,d);return i.filter(d=>typeof d<"u").forEach(d=>s.appendChild(d)),this.register(s,r)}static createText(e,r=!0){return document.createTextNode(ar(e))}static filter(e){let r=[];return this._elements.forEach((i,s)=>{e(i,s)&&r.push(i)}),r}static get(e){return this._elements.get(e)||null}static has(e){return this._elements.has(e)}static map(e){let r=[];return this._elements.forEach((i,s)=>{r.push(e(i,s))}),r}static register(e,r){if(this.has(e))return this.get(e);let i=new nr.default(e,r||{});return this._elements.set(e,i),i}};He._elements=new Map;ye.default=He});var ee=M(xe=>{"use strict";Object.defineProperty(xe,"__esModule",{value:!0});xe.TempleDataMap=void 0;var Ie=class{constructor(){window.__APP_DATA__||(window.__APP_DATA__={})}clear(){return window.__APP_DATA__={},this}delete(e){return this.has(e)?(delete window.__APP_DATA__[e],!0):!1}entries(){return Object.entries(window.__APP_DATA__)}has(e){return e in window.__APP_DATA__}get(e){return window.__APP_DATA__[e]}keys(){return Object.keys(window.__APP_DATA__)}set(e,r){return window.__APP_DATA__[e]=r,this}values(){return Object.values(window.__APP_DATA__)}};xe.TempleDataMap=Ie;var ir=new Ie;xe.default=ir});var Tt=M(Ae=>{"use strict";var Be=Ae&&Ae.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Ae,"__esModule",{value:!0});var wt=Be(_e()),G=Be(qe()),W=Be(Re()),ze=Be(ee()),ot=class t extends HTMLElement{static register(){customElements.define(this.component[0],this)}get attr(){return Object.fromEntries(Array.from(this.attributes).map(e=>[e.name,e.value]))}get element(){if(!G.default.has(this))throw wt.default.for("Component not mapped.");return G.default.get(this)}get metadata(){let[e,r]=this.constructor.component;return{tagname:e,classname:r}}get originalChildren(){return this._children}get initiated(){return this._initiated}get props(){return this.getAttributes()}get virtual(){return this._virtual}set props(e){this.setAttributes(e)}constructor(){if(super(),this._initiated=!1,this._template=null,this._children=void 0,this._rendering=!1,this._observer=null,this._virtual=!1,!G.default.has(this))throw wt.default.for("Component not mapped.")}adoptedCallback(){this.render(),W.default.emit("adopt",this)}connectedCallback(){this.wait(),W.default.emit("connect",this)}disconnectedCallback(){W.default.emit("disconnect",this)}getAttribute(e){return this.element.getAttribute(e)}getAttributes(){return Object.assign({},this.element.attributes)}getParentComponent(){let e=this.parentElement;for(;e;){if(e instanceof t)return e;e=e.parentElement}return null}hasAttribute(e){return this.element.hasAttribute(e)}register(e={},r=[]){G.default.has(this)?G.default.get(this).setAttributes(e):G.default.register(this,e);for(let[i,s]of Object.entries(e))typeof s=="string"?super.setAttribute(i,s):s===!0&&super.setAttribute(i,i);this._children=r,this._virtual=!0,this.connectedCallback()}removeAttribute(e){this.hasAttribute(e)&&this.element.removeAttribute(e),super.hasAttribute(e)&&super.removeAttribute(e)}render(){let e=this.getParentComponent();if(e&&!e.initiated)return;if(this._rendering)return;this._rendering=!0;let r=ze.default.get("current");ze.default.set("current",this);let i=this.styles();this._template?W.default.emit("unmounted",this):this._template=this.template();let s=this._template().filter(Boolean);if(i.length===0)this.textContent="",s.forEach(d=>this.appendChild(d));else{this.shadowRoot||this.attachShadow({mode:"open"});let d=this.shadowRoot;this.textContent="",d.textContent="";let _=document.createElement("style");_.innerText=i,d.appendChild(_),s.forEach(b=>{var v;return(v=this.shadowRoot)===null||v===void 0?void 0:v.appendChild(b)})}return r?ze.default.set("current",r):ze.default.delete("current"),this._initiated=!0,this._rendering=!1,W.default.emit("mounted",this),this.shadowRoot?this.shadowRoot.innerHTML:this.innerHTML}setAttribute(e,r){this.element.setAttribute(e,r),(typeof r=="string"||r===!0)&&super.setAttribute(e,r)}setAttributes(e){this.element.setAttributes(e)}wait(){if(document.readyState!=="loading")this._update();else{let e=()=>{this._update(),W.default.unbind("ready",e)};W.default.on("ready",e)}}_toNodeList(e){return e instanceof Node?[e]:Array.isArray(e)&&e.every(r=>r instanceof Node)?e:[G.default.createText(String(e))]}_update(){typeof this._children>"u"&&(this._children=Array.from(this.childNodes||[])),this._initiated||this.render()}};Ae.default=ot});var te=M(we=>{"use strict";var Et=we&&we.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(we,"__esModule",{value:!0});we.default=ur;var lr=Et(_e()),or=Et(ee());function ur(t=null,e=!1){if(!t&&(t=or.default.get("current"),!t)){if(!e)throw lr.default.for("Not called within a Temple component");return null}return t}});var kt=M(Te=>{"use strict";var cr=Te&&Te.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Te,"__esModule",{value:!0});var dr=cr(ee());function fr(t){let e=dr.default.get("env")||{};return t?e[t]||null:e}Te.default=fr});var ut=M(Ee=>{"use strict";var Ft=Ee&&Ee.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Ee,"__esModule",{value:!0});Ee.default=hr;var pr=Ft(te()),mr=Ft(ee());function hr(t=null){let e=(0,pr.default)(t,!0);return typeof e=="string"?mr.default.get("props")||{}:e?e.props:{}}});var Pt=M(re=>{"use strict";var Lt=re&&re.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(re,"__esModule",{value:!0});re.classlist=_r;re.default=vr;var gr=Lt(te()),br=Lt(ut());function _r(t=null){var e;if(t==="body")return document.body.classList;if(t==="head")return document.head.classList;if(t==="document")return(e=document.body.parentElement)===null||e===void 0?void 0:e.classList;let r=(0,gr.default)(t);return r?.classList}function vr(t=null){return(0,br.default)(t).class}});var St=M(U=>{"use strict";var yr=U&&U.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(U,"__esModule",{value:!0});U.innerHTML=Ar;U.innerText=wr;U.default=ct;var xr=yr(te());function Ar(t=null){let e=ct(t),r=document.createElement("template");return r.append(...e.map(i=>i.cloneNode(!0))),r.innerHTML}function wr(t=null){let e=ct(t),r=document.createElement("template");return r.append(...e.map(i=>i.cloneNode(!0))),r.innerText}function ct(t=null){let e=(0,xr.default)(t,!0);return typeof e!="string"&&e?e.originalChildren||[]:[]}});var Mt=M(Z=>{"use strict";var Ct=Z&&Z.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Z,"__esModule",{value:!0});Z.SignalRegistry=void 0;Z.default=kr;var Tr=Ct(te()),Er=Ct(_e()),se=class t{static observe(e,r){let i={getter:()=>d.raw,setter:b=>b},s=new Set,d={raw:r,change(b){s.add(b)},getter(b){return i.getter=b,d},setter(b){return i.setter=b,d}};Object.defineProperty(d,"value",{get(){return i.getter()},set(b){let v=i.setter(b),x=t.serialize(v)!==t.serialize(d.raw);d.raw=v,x&&(s.forEach(h=>h(v)),e.render())}});let _=this._observers.get(e);return _?(_.observed++,_.values.push(d)):this._observers.set(e,{observed:1,values:[d]}),d}static observer(e){return this._observers.get(e)||null}static serialize(e){return JSON.stringify(e)}};Z.SignalRegistry=se;se._observers=new Map;function kr(t,e=null){let r=(0,Tr.default)(e);if(!r.initiated)return se.observe(r,t);let i=se.observer(r);if(!i)throw Er.default.for("Signal state mismatch");return i.values[i.observed++%i.values.length]}});var ft=M(m=>{"use strict";var Fr=m&&m.__createBinding||(Object.create?function(t,e,r,i){i===void 0&&(i=r);var s=Object.getOwnPropertyDescriptor(e,r);(!s||("get"in s?!e.__esModule:s.writable||s.configurable))&&(s={enumerable:!0,get:function(){return e[r]}}),Object.defineProperty(t,i,s)}:function(t,e,r,i){i===void 0&&(i=r),t[i]=e[r]}),Lr=m&&m.__setModuleDefault||(Object.create?function(t,e){Object.defineProperty(t,"default",{enumerable:!0,value:e})}:function(t,e){t.default=e}),ke=m&&m.__importStar||function(t){if(t&&t.__esModule)return t;var e={};if(t!=null)for(var r in t)r!=="default"&&Object.prototype.hasOwnProperty.call(t,r)&&Fr(e,t,r);return Lr(e,t),e},J=m&&m.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(m,"__esModule",{value:!0});m.SignalRegistry=m.TempleException=m.TempleEmitter=m.TempleElement=m.TempleRegistry=m.TempleComponent=m.TempleDataMap=m.emitter=m.signal=m.innerHTML=m.innerText=m.children=m.classnames=m.classlist=m.props=m.env=m.data=m.component=void 0;var Pr=J(_e());m.TempleException=Pr.default;var Sr=J(Tt());m.TempleComponent=Sr.default;var Cr=J(qe());m.TempleRegistry=Cr.default;var Mr=J(lt());m.TempleElement=Mr.default;var jt=ke(Re());m.emitter=jt.default;Object.defineProperty(m,"TempleEmitter",{enumerable:!0,get:function(){return jt.TempleEmitter}});var jr=J(te());m.component=jr.default;var Dt=ke(ee());m.data=Dt.default;Object.defineProperty(m,"TempleDataMap",{enumerable:!0,get:function(){return Dt.TempleDataMap}});var Dr=J(kt());m.env=Dr.default;var Or=J(ut());m.props=Or.default;var Ot=ke(Pt());m.classnames=Ot.default;Object.defineProperty(m,"classlist",{enumerable:!0,get:function(){return Ot.classlist}});var dt=ke(St());m.children=dt.default;Object.defineProperty(m,"innerHTML",{enumerable:!0,get:function(){return dt.innerHTML}});Object.defineProperty(m,"innerText",{enumerable:!0,get:function(){return dt.innerText}});var $t=ke(Mt());m.signal=$t.default;Object.defineProperty(m,"SignalRegistry",{enumerable:!0,get:function(){return $t.SignalRegistry}})});var D=M((ts,Nt)=>{Nt.exports={...ft()}});var $=M((rs,Rt)=>{Rt.exports={...ft()}});var Ht=M((ps,Ke)=>{var $r=typeof window<"u"?window:typeof WorkerGlobalScope<"u"&&self instanceof WorkerGlobalScope?self:{};var c=function(t){var e=/(?:^|\s)lang(?:uage)?-([\w-]+)(?=\s|$)/i,r=0,i={},s={manual:t.Prism&&t.Prism.manual,disableWorkerMessageHandler:t.Prism&&t.Prism.disableWorkerMessageHandler,util:{encode:function n(a){return a instanceof d?new d(a.type,n(a.content),a.alias):Array.isArray(a)?a.map(n):a.replace(/&/g,"&").replace(/"u")return null;if("currentScript"in document)return document.currentScript;try{throw new Error}catch(o){var n=(/at [^(\r\n]*\((.*):[^:]+:[^:]+\)$/i.exec(o.stack)||[])[1];if(n){var a=document.getElementsByTagName("script");for(var l in a)if(a[l].src==n)return a[l]}return null}},isActive:function(n,a,l){for(var o="no-"+a;n;){var u=n.classList;if(u.contains(a))return!0;if(u.contains(o))return!1;n=n.parentElement}return!!l}},languages:{plain:i,plaintext:i,text:i,txt:i,extend:function(n,a){var l=s.util.clone(s.languages[n]);for(var o in a)l[o]=a[o];return l},insertBefore:function(n,a,l,o){o=o||s.languages;var u=o[n],p={};for(var y in u)if(u.hasOwnProperty(y)){if(y==a)for(var f in l)l.hasOwnProperty(f)&&(p[f]=l[f]);l.hasOwnProperty(y)||(p[y]=u[y])}var F=o[n];return o[n]=p,s.languages.DFS(s.languages,function(S,I){I===F&&S!=n&&(this[S]=p)}),p},DFS:function n(a,l,o,u){u=u||{};var p=s.util.objId;for(var y in a)if(a.hasOwnProperty(y)){l.call(a,y,a[y],o||y);var f=a[y],F=s.util.type(f);F==="Object"&&!u[p(f)]?(u[p(f)]=!0,n(f,l,null,u)):F==="Array"&&!u[p(f)]&&(u[p(f)]=!0,n(f,l,y,u))}}},plugins:{},highlightAll:function(n,a){s.highlightAllUnder(document,n,a)},highlightAllUnder:function(n,a,l){var o={callback:l,container:n,selector:'code[class*="language-"], [class*="language-"] code, code[class*="lang-"], [class*="lang-"] code'};s.hooks.run("before-highlightall",o),o.elements=Array.prototype.slice.apply(o.container.querySelectorAll(o.selector)),s.hooks.run("before-all-elements-highlight",o);for(var u=0,p;p=o.elements[u++];)s.highlightElement(p,a===!0,o.callback)},highlightElement:function(n,a,l){var o=s.util.getLanguage(n),u=s.languages[o];s.util.setLanguage(n,o);var p=n.parentElement;p&&p.nodeName.toLowerCase()==="pre"&&s.util.setLanguage(p,o);var y=n.textContent,f={element:n,language:o,grammar:u,code:y};function F(I){f.highlightedCode=I,s.hooks.run("before-insert",f),f.element.innerHTML=f.highlightedCode,s.hooks.run("after-highlight",f),s.hooks.run("complete",f),l&&l.call(f.element)}if(s.hooks.run("before-sanity-check",f),p=f.element.parentElement,p&&p.nodeName.toLowerCase()==="pre"&&!p.hasAttribute("tabindex")&&p.setAttribute("tabindex","0"),!f.code){s.hooks.run("complete",f),l&&l.call(f.element);return}if(s.hooks.run("before-highlight",f),!f.grammar){F(s.util.encode(f.code));return}if(a&&t.Worker){var S=new Worker(s.filename);S.onmessage=function(I){F(I.data)},S.postMessage(JSON.stringify({language:f.language,code:f.code,immediateClose:!0}))}else F(s.highlight(f.code,f.grammar,f.language))},highlight:function(n,a,l){var o={code:n,grammar:a,language:l};if(s.hooks.run("before-tokenize",o),!o.grammar)throw new Error('The language "'+o.language+'" has no grammar.');return o.tokens=s.tokenize(o.code,o.grammar),s.hooks.run("after-tokenize",o),d.stringify(s.util.encode(o.tokens),o.language)},tokenize:function(n,a){var l=a.rest;if(l){for(var o in l)a[o]=l[o];delete a.rest}var u=new v;return x(u,u.head,n),b(n,u,a,u.head,0),E(u)},hooks:{all:{},add:function(n,a){var l=s.hooks.all;l[n]=l[n]||[],l[n].push(a)},run:function(n,a){var l=s.hooks.all[n];if(!(!l||!l.length))for(var o=0,u;u=l[o++];)u(a)}},Token:d};t.Prism=s;function d(n,a,l,o){this.type=n,this.content=a,this.alias=l,this.length=(o||"").length|0}d.stringify=function n(a,l){if(typeof a=="string")return a;if(Array.isArray(a)){var o="";return a.forEach(function(F){o+=n(F,l)}),o}var u={type:a.type,content:n(a.content,l),tag:"span",classes:["token",a.type],attributes:{},language:l},p=a.alias;p&&(Array.isArray(p)?Array.prototype.push.apply(u.classes,p):u.classes.push(p)),s.hooks.run("wrap",u);var y="";for(var f in u.attributes)y+=" "+f+'="'+(u.attributes[f]||"").replace(/"/g,""")+'"';return"<"+u.tag+' class="'+u.classes.join(" ")+'"'+y+">"+u.content+""};function _(n,a,l,o){n.lastIndex=a;var u=n.exec(l);if(u&&o&&u[1]){var p=u[1].length;u.index+=p,u[0]=u[0].slice(p)}return u}function b(n,a,l,o,u,p){for(var y in l)if(!(!l.hasOwnProperty(y)||!l[y])){var f=l[y];f=Array.isArray(f)?f:[f];for(var F=0;F=p.reach);H+=C.value.length,C=C.next){var Q=C.value;if(a.length>n.length)return;if(!(Q instanceof d)){var Ce=1,q;if(gt){if(q=_(bt,H,n,ht),!q||q.index>=n.length)break;var Me=q.index,Wt=q.index+q[0].length,z=H;for(z+=C.value.length;Me>=z;)C=C.next,z+=C.value.length;if(z-=C.value.length,H=z,C.value instanceof d)continue;for(var be=C;be!==a.tail&&(zp.reach&&(p.reach=tt);var De=C.prev;et&&(De=x(a,De,et),H+=et.length),h(a,De,Ce);var Ut=new d(y,I?s.tokenize(je,I):je,Bt,je);if(C=x(a,De,Ut),_t&&x(a,C,_t),Ce>1){var rt={cause:y+","+F,reach:tt};b(n,a,l,C.prev,H,rt),p&&rt.reach>p.reach&&(p.reach=rt.reach)}}}}}}function v(){var n={value:null,prev:null,next:null},a={value:null,prev:n,next:null};n.next=a,this.head=n,this.tail=a,this.length=0}function x(n,a,l){var o=a.next,u={value:l,prev:a,next:o};return a.next=u,o.prev=u,n.length++,u}function h(n,a,l){for(var o=a.next,u=0;u/,greedy:!0},prolog:{pattern:/<\?[\s\S]+?\?>/,greedy:!0},doctype:{pattern:/"'[\]]|"[^"]*"|'[^']*')+(?:\[(?:[^<"'\]]|"[^"]*"|'[^']*'|<(?!!--)|)*\]\s*)?>/i,greedy:!0,inside:{"internal-subset":{pattern:/(^[^\[]*\[)[\s\S]+(?=\]>$)/,lookbehind:!0,greedy:!0,inside:null},string:{pattern:/"[^"]*"|'[^']*'/,greedy:!0},punctuation:/^$|[[\]]/,"doctype-tag":/^DOCTYPE/i,name:/[^\s<>'"]+/}},cdata:{pattern://i,greedy:!0},tag:{pattern:/<\/?(?!\d)[^\s>\/=$<%]+(?:\s(?:\s*[^\s>\/=]+(?:\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))|(?=[\s/>])))+)?\s*\/?>/,greedy:!0,inside:{tag:{pattern:/^<\/?[^\s>\/]+/,inside:{punctuation:/^<\/?/,namespace:/^[^\s>\/:]+:/}},"special-attr":[],"attr-value":{pattern:/=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+)/,inside:{punctuation:[{pattern:/^=/,alias:"attr-equals"},{pattern:/^(\s*)["']|["']$/,lookbehind:!0}]}},punctuation:/\/?>/,"attr-name":{pattern:/[^\s>\/]+/,inside:{namespace:/^[^\s>\/:]+:/}}}},entity:[{pattern:/&[\da-z]{1,8};/i,alias:"named-entity"},/&#x?[\da-f]{1,8};/i]};c.languages.markup.tag.inside["attr-value"].inside.entity=c.languages.markup.entity;c.languages.markup.doctype.inside["internal-subset"].inside=c.languages.markup;c.hooks.add("wrap",function(t){t.type==="entity"&&(t.attributes.title=t.content.replace(/&/,"&"))});Object.defineProperty(c.languages.markup.tag,"addInlined",{value:function(e,r){var i={};i["language-"+r]={pattern:/(^$)/i,lookbehind:!0,inside:c.languages[r]},i.cdata=/^$/i;var s={"included-cdata":{pattern://i,inside:i}};s["language-"+r]={pattern:/[\s\S]+/,inside:c.languages[r]};var d={};d[e]={pattern:RegExp(/(<__[^>]*>)(?:))*\]\]>|(?!)/.source.replace(/__/g,function(){return e}),"i"),lookbehind:!0,greedy:!0,inside:s},c.languages.insertBefore("markup","cdata",d)}});Object.defineProperty(c.languages.markup.tag,"addAttribute",{value:function(t,e){c.languages.markup.tag.inside["special-attr"].push({pattern:RegExp(/(^|["'\s])/.source+"(?:"+t+")"+/\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))/.source,"i"),lookbehind:!0,inside:{"attr-name":/^[^\s=]+/,"attr-value":{pattern:/=[\s\S]+/,inside:{value:{pattern:/(^=\s*(["']|(?!["'])))\S[\s\S]*(?=\2$)/,lookbehind:!0,alias:[e,"language-"+e],inside:c.languages[e]},punctuation:[{pattern:/^=/,alias:"attr-equals"},/"|'/]}}}})}});c.languages.html=c.languages.markup;c.languages.mathml=c.languages.markup;c.languages.svg=c.languages.markup;c.languages.xml=c.languages.extend("markup",{});c.languages.ssml=c.languages.xml;c.languages.atom=c.languages.xml;c.languages.rss=c.languages.xml;(function(t){var e=/(?:"(?:\\(?:\r\n|[\s\S])|[^"\\\r\n])*"|'(?:\\(?:\r\n|[\s\S])|[^'\\\r\n])*')/;t.languages.css={comment:/\/\*[\s\S]*?\*\//,atrule:{pattern:RegExp("@[\\w-](?:"+/[^;{\s"']|\s+(?!\s)/.source+"|"+e.source+")*?"+/(?:;|(?=\s*\{))/.source),inside:{rule:/^@[\w-]+/,"selector-function-argument":{pattern:/(\bselector\s*\(\s*(?![\s)]))(?:[^()\s]|\s+(?![\s)])|\((?:[^()]|\([^()]*\))*\))+(?=\s*\))/,lookbehind:!0,alias:"selector"},keyword:{pattern:/(^|[^\w-])(?:and|not|only|or)(?![\w-])/,lookbehind:!0}}},url:{pattern:RegExp("\\burl\\((?:"+e.source+"|"+/(?:[^\\\r\n()"']|\\[\s\S])*/.source+")\\)","i"),greedy:!0,inside:{function:/^url/i,punctuation:/^\(|\)$/,string:{pattern:RegExp("^"+e.source+"$"),alias:"url"}}},selector:{pattern:RegExp(`(^|[{}\\s])[^{}\\s](?:[^{};"'\\s]|\\s+(?![\\s{])|`+e.source+")*(?=\\s*\\{)"),lookbehind:!0},string:{pattern:e,greedy:!0},property:{pattern:/(^|[^-\w\xA0-\uFFFF])(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*(?=\s*:)/i,lookbehind:!0},important:/!important\b/i,function:{pattern:/(^|[^-a-z0-9])[-a-z0-9]+(?=\()/i,lookbehind:!0},punctuation:/[(){};:,]/},t.languages.css.atrule.inside.rest=t.languages.css;var r=t.languages.markup;r&&(r.tag.addInlined("style","css"),r.tag.addAttribute("style","css"))})(c);c.languages.clike={comment:[{pattern:/(^|[^\\])\/\*[\s\S]*?(?:\*\/|$)/,lookbehind:!0,greedy:!0},{pattern:/(^|[^\\:])\/\/.*/,lookbehind:!0,greedy:!0}],string:{pattern:/(["'])(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/,greedy:!0},"class-name":{pattern:/(\b(?:class|extends|implements|instanceof|interface|new|trait)\s+|\bcatch\s+\()[\w.\\]+/i,lookbehind:!0,inside:{punctuation:/[.\\]/}},keyword:/\b(?:break|catch|continue|do|else|finally|for|function|if|in|instanceof|new|null|return|throw|try|while)\b/,boolean:/\b(?:false|true)\b/,function:/\b\w+(?=\()/,number:/\b0x[\da-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:e[+-]?\d+)?/i,operator:/[<>]=?|[!=]=?=?|--?|\+\+?|&&?|\|\|?|[?*/~^%]/,punctuation:/[{}[\];(),.:]/};c.languages.javascript=c.languages.extend("clike",{"class-name":[c.languages.clike["class-name"],{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$A-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\.(?:constructor|prototype))/,lookbehind:!0}],keyword:[{pattern:/((?:^|\})\s*)catch\b/,lookbehind:!0},{pattern:/(^|[^.]|\.\.\.\s*)\b(?:as|assert(?=\s*\{)|async(?=\s*(?:function\b|\(|[$\w\xA0-\uFFFF]|$))|await|break|case|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally(?=\s*(?:\{|$))|for|from(?=\s*(?:['"]|$))|function|(?:get|set)(?=\s*(?:[#\[$\w\xA0-\uFFFF]|$))|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)\b/,lookbehind:!0}],function:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*(?:\.\s*(?:apply|bind|call)\s*)?\()/,number:{pattern:RegExp(/(^|[^\w$])/.source+"(?:"+(/NaN|Infinity/.source+"|"+/0[bB][01]+(?:_[01]+)*n?/.source+"|"+/0[oO][0-7]+(?:_[0-7]+)*n?/.source+"|"+/0[xX][\dA-Fa-f]+(?:_[\dA-Fa-f]+)*n?/.source+"|"+/\d+(?:_\d+)*n/.source+"|"+/(?:\d+(?:_\d+)*(?:\.(?:\d+(?:_\d+)*)?)?|\.\d+(?:_\d+)*)(?:[Ee][+-]?\d+(?:_\d+)*)?/.source)+")"+/(?![\w$])/.source),lookbehind:!0},operator:/--|\+\+|\*\*=?|=>|&&=?|\|\|=?|[!=]==|<<=?|>>>?=?|[-+*/%&|^!=<>]=?|\.{3}|\?\?=?|\?\.?|[~:]/});c.languages.javascript["class-name"][0].pattern=/(\b(?:class|extends|implements|instanceof|interface|new)\s+)[\w.\\]+/;c.languages.insertBefore("javascript","keyword",{regex:{pattern:RegExp(/((?:^|[^$\w\xA0-\uFFFF."'\])\s]|\b(?:return|yield))\s*)/.source+/\//.source+"(?:"+/(?:\[(?:[^\]\\\r\n]|\\.)*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}/.source+"|"+/(?:\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.)*\])*\])*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}v[dgimyus]{0,7}/.source+")"+/(?=(?:\s|\/\*(?:[^*]|\*(?!\/))*\*\/)*(?:$|[\r\n,.;:})\]]|\/\/))/.source),lookbehind:!0,greedy:!0,inside:{"regex-source":{pattern:/^(\/)[\s\S]+(?=\/[a-z]*$)/,lookbehind:!0,alias:"language-regex",inside:c.languages.regex},"regex-delimiter":/^\/|\/$/,"regex-flags":/^[a-z]+$/}},"function-variable":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*[=:]\s*(?:async\s*)?(?:\bfunction\b|(?:\((?:[^()]|\([^()]*\))*\)|(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)\s*=>))/,alias:"function"},parameter:[{pattern:/(function(?:\s+(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)?\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\))/,lookbehind:!0,inside:c.languages.javascript},{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$a-z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*=>)/i,lookbehind:!0,inside:c.languages.javascript},{pattern:/(\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*=>)/,lookbehind:!0,inside:c.languages.javascript},{pattern:/((?:\b|\s|^)(?!(?:as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)(?![$\w\xA0-\uFFFF]))(?:(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*)\(\s*|\]\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*\{)/,lookbehind:!0,inside:c.languages.javascript}],constant:/\b[A-Z](?:[A-Z_]|\dx?)*\b/});c.languages.insertBefore("javascript","string",{hashbang:{pattern:/^#!.*/,greedy:!0,alias:"comment"},"template-string":{pattern:/`(?:\\[\s\S]|\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}|(?!\$\{)[^\\`])*`/,greedy:!0,inside:{"template-punctuation":{pattern:/^`|`$/,alias:"string"},interpolation:{pattern:/((?:^|[^\\])(?:\\{2})*)\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}/,lookbehind:!0,inside:{"interpolation-punctuation":{pattern:/^\$\{|\}$/,alias:"punctuation"},rest:c.languages.javascript}},string:/[\s\S]+/}},"string-property":{pattern:/((?:^|[,{])[ \t]*)(["'])(?:\\(?:\r\n|[\s\S])|(?!\2)[^\\\r\n])*\2(?=\s*:)/m,lookbehind:!0,greedy:!0,alias:"property"}});c.languages.insertBefore("javascript","operator",{"literal-property":{pattern:/((?:^|[,{])[ \t]*)(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*:)/m,lookbehind:!0,alias:"property"}});c.languages.markup&&(c.languages.markup.tag.addInlined("script","javascript"),c.languages.markup.tag.addAttribute(/on(?:abort|blur|change|click|composition(?:end|start|update)|dblclick|error|focus(?:in|out)?|key(?:down|up)|load|mouse(?:down|enter|leave|move|out|over|up)|reset|resize|scroll|select|slotchange|submit|unload|wheel)/.source,"javascript"));c.languages.js=c.languages.javascript;(function(){if(typeof c>"u"||typeof document>"u")return;Element.prototype.matches||(Element.prototype.matches=Element.prototype.msMatchesSelector||Element.prototype.webkitMatchesSelector);var t="Loading\u2026",e=function(k,g){return"\u2716 Error "+k+" while fetching file: "+g},r="\u2716 Error: File does not exist or is empty",i={js:"javascript",py:"python",rb:"ruby",ps1:"powershell",psm1:"powershell",sh:"bash",bat:"batch",h:"c",tex:"latex"},s="data-src-status",d="loading",_="loaded",b="failed",v="pre[data-src]:not(["+s+'="'+_+'"]):not(['+s+'="'+d+'"])';function x(k,g,w){var n=new XMLHttpRequest;n.open("GET",k,!0),n.onreadystatechange=function(){n.readyState==4&&(n.status<400&&n.responseText?g(n.responseText):n.status>=400?w(e(n.status,n.statusText)):w(r))},n.send(null)}function h(k){var g=/^\s*(\d+)\s*(?:(,)\s*(?:(\d+)\s*)?)?$/.exec(k||"");if(g){var w=Number(g[1]),n=g[2],a=g[3];return n?a?[w,Number(a)]:[w,void 0]:[w,w]}}c.hooks.add("before-highlightall",function(k){k.selector+=", "+v}),c.hooks.add("before-sanity-check",function(k){var g=k.element;if(g.matches(v)){k.code="",g.setAttribute(s,d);var w=g.appendChild(document.createElement("CODE"));w.textContent=t;var n=g.getAttribute("data-src"),a=k.language;if(a==="none"){var l=(/\.(\w+)$/.exec(n)||[,"none"])[1];a=i[l]||l}c.util.setLanguage(w,a),c.util.setLanguage(g,a);var o=c.plugins.autoloader;o&&o.loadLanguages(a),x(n,function(u){g.setAttribute(s,_);var p=h(g.getAttribute("data-range"));if(p){var y=u.split(/\r\n?|\n/g),f=p[0],F=p[1]==null?y.length:p[1];f<0&&(f+=y.length),f=Math.max(0,Math.min(f-1,y.length)),F<0&&(F+=y.length),F=Math.max(0,Math.min(F,y.length)),u=y.slice(f,F).join(`
+`),g.hasAttribute("data-start")||g.setAttribute("data-start",String(f+1))}w.textContent=u,c.highlightElement(w)},function(u){g.setAttribute(s,b),w.textContent=u})}}),c.plugins.fileHighlight={highlight:function(g){for(var w=(g||document).querySelectorAll(v),n=0,a;a=w[n++];)c.highlightElement(a)}};var E=!1;c.fileHighlight=function(){E||(console.warn("Prism.fileHighlight is deprecated. Use `Prism.plugins.fileHighlight.highlight` instead."),E=!0),c.plugins.fileHighlight.highlight.apply(this,arguments)}})()});var Hr={};Kt(Hr,{BUILD_ID:()=>qr,TempleComponent:()=>P.TempleComponent,TempleElement:()=>P.TempleElement,TempleEmitter:()=>P.TempleEmitter,TempleException:()=>P.TempleException,TempleRegistry:()=>P.TempleRegistry,children:()=>P.children,components:()=>Rr,data:()=>P.data,emitter:()=>P.emitter,props:()=>P.props,signal:()=>P.signal});var N=T(D());var qt=T(D()),R=T($()),ne=class extends qt.TempleComponent{static component=["layout","Layout_9f3ab204ce271feaf6f7"];styles(){return""}template(){(0,R.classlist)().add("relative","w-full","vh","scroll-hidden");let e=(0,R.children)(),r=e.find(h=>h.nodeName.endsWith("PANEL-MAIN")),i=e.find(h=>h.nodeName.endsWith("PANEL-HEAD")),s=e.find(h=>h.nodeName.endsWith("PANEL-FOOT")),d=e.find(h=>h.nodeName.endsWith("PANEL-LEFT")),_=e.find(h=>h.nodeName.endsWith("PANEL-RIGHT")),b={head:!!i,foot:!!s,left:!!d,right:!!_},v=new Set,x={left:!1,right:!1,change:h=>v.add(h)};return r&&R.TempleRegistry.get(r).setAttribute("show",x).setAttribute("layout",b),i&&R.TempleRegistry.get(i).setAttribute("show",x).setAttribute("layout",b),s&&R.TempleRegistry.get(s).setAttribute("show",x).setAttribute("layout",b),d&&R.TempleRegistry.get(d).setAttribute("show",x).setAttribute("layout",b),_&&R.TempleRegistry.get(_).setAttribute("show",x).setAttribute("layout",b),this.toggle=h=>{x[h]=!x[h],v.forEach(E=>E())},()=>[R.TempleRegistry.createText(`
+`,!1),...this._toNodeList(e)]}};var Fe=T(D()),Ge=T($()),ae=class extends Fe.TempleComponent{static component=["head","Head_2bf4dff19bc88ba4138b"];styles(){return""}template(){let{layout:e,show:r}=this.element.attributes,i=(0,Ge.classlist)(),s=d=>{this.classList.add("absolute","top-0","right-0","h-60","transition-500"),e?.left?(this.classList.remove("left-0"),this.classList.add("left-226")):this.classList.add("left-0"),r.left?(this.classList.remove("md-left-0"),this.classList.add("md-left-226")):(this.classList.remove("md-left-226"),this.classList.add("md-left-0"))};return r.change(s),s(),()=>[Fe.TempleRegistry.createText(`
+`,!1),Fe.TempleRegistry.createElement("header",{class:"block w-full h-full relative"},[...this._toNodeList((0,Ge.children)())]).element]}};var Le=T(D()),We=T($()),ie=class extends Le.TempleComponent{static component=["left","Left_f4ab589e043eee17d229"];styles(){return""}template(){let{layout:e,show:r}=this.element.attributes,i=(0,We.classlist)(),s=d=>{this.classList.add("w-226","absolute","bottom-0","left-0","top-0","transition-500"),r.left?(this.classList.remove("md-left--226"),this.classList.add("md-left-0")):this.classList.add("md-left--226")};return r.change(s),s(),()=>[Le.TempleRegistry.createText(`
+`,!1),Le.TempleRegistry.createElement("aside",{class:"block w-full h-full relative"},[...this._toNodeList((0,We.children)())]).element]}};var Pe=T(D()),Ue=T($()),le=class extends Pe.TempleComponent{static component=["main","Main_847772763f4518728ede"];styles(){return""}template(){let{layout:e,show:r}=this.element.attributes,i=(0,Ue.classlist)(),s=d=>{this.classList.add("absolute","transition-500"),e?.head?(this.classList.remove("top-0"),this.classList.add("top-60")):this.classList.add("top-0"),e?.foot?(this.classList.remove("bottom-0"),this.classList.add("bottom-60")):this.classList.add("bottom-0"),e?.left?(this.classList.remove("left-0"),this.classList.add("left-226")):this.classList.add("left-0"),e?.right?(this.classList.remove("right-0"),this.classList.add("right-200")):this.classList.add("right-0"),r.left?(this.classList.remove("md-left-0"),this.classList.add("md-left-226")):(this.classList.remove("md-left-226"),this.classList.add("md-left-0")),r.right?(this.classList.remove("md-right-0"),this.classList.add("md-right-200")):(this.classList.remove("md-right-200"),this.classList.add("md-right-0"))};return r.change(s),s(),()=>[Pe.TempleRegistry.createText(`
+`,!1),Pe.TempleRegistry.createElement("main",{class:"block w-full h-full relative"},[...this._toNodeList((0,Ue.children)())]).element]}};var X=T(D()),ue=T($()),oe=class extends X.TempleComponent{static component=["tab","Tab_5a341768ef0a010965e3"];styles(){return""}template(){let{group:e,selector:r="",active:i="",inactive:s="",style:d,class:_,...b}=(0,ue.props)(),v=(0,ue.component)(),x=i.split(" "),h=s.split(" ");v.classList.add("cursor-pointer");let E=()=>{let g=v.hasAttribute("on");v.classList.remove(...g?h:x),v.classList.add(...g?x:h),Array.from(document.querySelectorAll(r)).forEach(w=>{w.style.display=g?"block":"none"})},k=()=>{Array.from(document.querySelectorAll(`[group="${e}"]`)).forEach(g=>{let w=g.getAttribute("selector");r===w&&!g.hasAttribute("on")?(g.setAttribute("on",""),Array.from(document.querySelectorAll(r)).forEach(n=>{n.style.display="block"}),typeof g.render=="function"&&g.render()):r!==w&&g.hasAttribute("on")&&(g.removeAttribute("on"),Array.from(document.querySelectorAll(w)).forEach(n=>{n.style.display="none"}),typeof g.render=="function"&&g.render())})};return()=>[X.TempleRegistry.createText(`
+`,!1),X.TempleRegistry.createElement("a",{...b,class:"block h-full w-full",click:k,mount:E},[X.TempleRegistry.createText(`
+  `,!1),...this._toNodeList((0,ue.children)()),X.TempleRegistry.createText(`
+`,!1)]).element]}};var Se=T(D()),Ze=T($()),ce=class extends Se.TempleComponent{static component=["docs","Docs_40562a7bb56d70d971df"];styles(){return""}template(){return(0,Ze.classlist)().add("block","w-full","h-full","scroll-y-auto","scroll-x-hidden"),()=>[Se.TempleRegistry.createText(`
+`,!1),Se.TempleRegistry.createElement("article",{class:"block p-10 tx-t-1"},[...this._toNodeList((0,Ze.children)())]).element]}};var Y=T(D()),Je=T($()),de=class extends Y.TempleComponent{static component=["head","Head_939ecb5f22962d8c2924"];styles(){return""}template(){return(0,Je.classlist)().add("absolute","top-0","right-0","left-170","h-45","bg-t-0","z-1"),()=>[Y.TempleRegistry.createText(`
+`,!1),Y.TempleRegistry.createElement("header",{class:"w-full h-full scroll-x-auto"},[Y.TempleRegistry.createText(`
+  `,!1),...this._toNodeList((0,Je.children)()),Y.TempleRegistry.createText(`
+`,!1)]).element]}};var V=T(D()),Xe=T($()),fe=class extends V.TempleComponent{static component=["left","Left_a7102198c3628da88b4f"];styles(){return""}template(){return(0,Xe.classlist)().add("absolute","top-0","bottom-0","left-0","w-170","bg-h-000000","bd-solid","bd-t-2","bdy-0","bdl-0","bdr-1","z-2"),()=>[V.TempleRegistry.createText(`
+`,!1),V.TempleRegistry.createElement("aside",{class:"w-full h-full scroll-auto"},[V.TempleRegistry.createText(`
+  `,!1),...this._toNodeList((0,Xe.children)()),V.TempleRegistry.createText(`
+`,!1)]).element]}};var K=T(D()),Ye=T($()),pe=class extends K.TempleComponent{static component=["main","Main_bbd0517424ebab9de270"];styles(){return""}template(){return(0,Ye.classlist)().add("absolute","top-45","right-0","left-170","bottom-0","bg-black","bd-solid","bd-t-2","bdx-0","bdb-0","bdt-1"),()=>[K.TempleRegistry.createText(`
+`,!1),K.TempleRegistry.createElement("main",{class:"w-full h-full scroll-auto"},[K.TempleRegistry.createText(`
+  `,!1),...this._toNodeList((0,Ye.children)()),K.TempleRegistry.createText(`
+`,!1)]).element]}};var L=T(D()),Ve=T($()),me=class extends L.TempleComponent{static component=["app","App_381239c61b65b86a1c20"];styles(){return""}template(){let{title:e,height:r}=(0,Ve.props)(),i=r?`height:${r}px`:"";return()=>[L.TempleRegistry.createText(`
+`,!1),L.TempleRegistry.createElement("div",{class:"bd-rad-curved scroll-hidden shadow-0-0-10-0-0-0-5"},[L.TempleRegistry.createText(`
+  `,!1),L.TempleRegistry.createElement("div",{class:"relative flex flex-center-y gap-10 p-10 bg-t-1 tx-c-999999 tx-16"},[L.TempleRegistry.createText(`
+    `,!1),L.TempleRegistry.createElement("span",{class:"bg-h-999999 pill h-10 w-10"},[]).element,L.TempleRegistry.createText(`
+    `,!1),L.TempleRegistry.createElement("span",{class:"bg-h-999999 pill h-10 w-10"},[]).element,L.TempleRegistry.createText(`
+    `,!1),L.TempleRegistry.createElement("span",{class:"bg-h-999999 pill h-10 w-10"},[]).element,L.TempleRegistry.createText(`
+    `,!1),L.TempleRegistry.createElement("span",{class:"flex flex-center h-full w-full absolute top-0 left-0"},[L.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(e),L.TempleRegistry.createText(`
+    `,!1)]).element,L.TempleRegistry.createText(`
+  `,!1)]).element,L.TempleRegistry.createText(`
+  `,!1),L.TempleRegistry.createElement("div",{class:"bg-black tx-t-1 relative",style:i},[...this._toNodeList((0,Ve.children)())]).element,L.TempleRegistry.createText(`
+`,!1)]).element]}};var A=T(D()),pt=T(Ht()),It=T($()),he=class extends A.TempleComponent{static component=["code","Code_5294df1c620ef5ddbd2f"];styles(){return`:host {
     display: block;
     font-size: 14px;
     line-height: 20px;
   }
   :host([inline]) {
-    display: inline;
+    display: inline !important;
   }
   :host([inline]),
   :host([inline]) > pre,
   :host([inline]) > pre > code {
-    display: inline;
+    display: inline !important;
   }
   .snippet {
     background-color: #000000;
     color: #ABB2BF;
+    height: 100%;
     margin: 0;
     padding: 0;
   }
@@ -73,155 +102,38 @@ var TempleAPI=(()=>{var Ft=Object.create;var be=Object.defineProperty;var kt=Obj
 
   .terminal {
     background-color: #000000;
+    font-family: 'Courier New', Courier, monospace;
     font-size: 15px;
+    height: 100%;
     padding: 10px;
   }
   .terminal span {
     color: #00FF00;
-  }`}template(){let e=this.props,{lang:r="markup",numbers:i=!1,inline:s=!1,trim:p=!1,ltrim:h=!1,rtrim:g=!1,detab:_=0}=e,y=(0,wt.children)(),w=y[0]?.textContent||"";_&&(w=w.replace(new RegExp(`\\n {${_}}`,"g"),`
-`)),p?w=w.trim():h?w=w.replace(/^\s+/,""):g&&(w=w.replace(/\s+$/,""));let E=x=>{if(!w)return;let v=Ge.default.highlight(w,Ge.default.languages[r],r);if(x.detail.target.innerHTML=v,i){let A=v.match(/\n(?!$)/g),n=A?A.length+1:1,a=new Array(n+1).join(""),l=document.createElement("span");l.setAttribute("aria-hidden","true"),l.className="line-numbers-rows",l.innerHTML=a,x.detail.target.appendChild(l)}};return()=>[T.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism.min.css"}).element,T.TempleRegistry.createText(`
-`,!1),T.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism-tomorrow.min.css"}).element,T.TempleRegistry.createText(`
-`,!1),...r==="bash"?[T.TempleRegistry.createText(`
-  `,!1),T.TempleRegistry.createElement("div",{class:"terminal"},[T.TempleRegistry.createElement("span",{},[T.TempleRegistry.createText("$",!1)]).element,T.TempleRegistry.createText(" ",!1),...this._toNodeList(y)]).element,T.TempleRegistry.createText(`
-`,!1)]:w?[,T.TempleRegistry.createText(`
-  `,!1),...i?[T.TempleRegistry.createText(`
-    `,!1),T.TempleRegistry.createElement("pre",{class:"snippet line-numbers"},[T.TempleRegistry.createElement("code",{mount:E},[]).element]).element,T.TempleRegistry.createText(`
-  `,!1)]:[,T.TempleRegistry.createText(`
-    `,!1),T.TempleRegistry.createElement("pre",{class:"snippet pad"},[T.TempleRegistry.createElement("code",{mount:E},[]).element]).element,T.TempleRegistry.createText(`
-  `,!1)],T.TempleRegistry.createText(`
-`,!1)]:[]]}};var S=M(q()),ke=M(J()),Y=class extends S.TempleComponent{static component=["app","App_05341fddbfd1fe4f273b"];styles(){return""}template(){let{title:e,panel:r}=(0,ke.props)(),i=`body ${r?"panel":""}`,s=r?`height:${r}px`:"";return()=>[S.TempleRegistry.createText(`
-`,!1),S.TempleRegistry.createElement("div",{class:"window"},[S.TempleRegistry.createText(`
-  `,!1),S.TempleRegistry.createElement("div",{class:"head"},[S.TempleRegistry.createText(`
-    `,!1),S.TempleRegistry.createElement("span",{class:"dot"},[]).element,S.TempleRegistry.createText(`
-    `,!1),S.TempleRegistry.createElement("span",{class:"dot"},[]).element,S.TempleRegistry.createText(`
-    `,!1),S.TempleRegistry.createElement("span",{class:"dot"},[]).element,S.TempleRegistry.createText(`
-    `,!1),S.TempleRegistry.createElement("span",{class:"title"},[...this._toNodeList(e)]).element,S.TempleRegistry.createText(`
-  `,!1)]).element,S.TempleRegistry.createText(`
-  `,!1),S.TempleRegistry.createElement("div",{class:i,style:s},[...this._toNodeList((0,ke.children)())]).element,S.TempleRegistry.createText(`
-`,!1)]).element]}};var fe=M(q()),Se=M(J()),V=class extends fe.TempleComponent{static component=["tab","Tab_dd9d261e4f37efc3079c"];styles(){return""}template(){let{group:e,selector:r,class:i,...s}=(0,Se.props)(),p=()=>{Array.from(document.querySelectorAll(r)).forEach(g=>{g.style.display=i.indexOf("active")>-1?"block":"none"})},h=()=>{Array.from(document.querySelectorAll(`[group="${e}"]`)).forEach(g=>{let _=g.props.selector;r===_?(g.classList.add("active"),Array.from(document.querySelectorAll(r)).forEach(y=>{y.style.display="block"})):(g.classList.remove("active"),Array.from(document.querySelectorAll(_)).forEach(y=>{y.style.display="none"}))})};return()=>[fe.TempleRegistry.createText(`
-`,!1),fe.TempleRegistry.createElement("a",{...s,click:h,mount:p},[...this._toNodeList((0,Se.children)())]).element]}};var z=M(q()),Q=M(J()),K=class extends z.TempleComponent{static component=["alert","Alert_6b81bcb0566ce7f0cd2d"];styles(){return`:host {
-    --black: #222222;
-    --white: #FCFCFC;
-    --info: #1474FC;
-    --error: #DC3545;
-    --warning: #FF7B07;
-    --success: #28A745;
-    --muted: #999999;
-    --primary: #E49F1A;
-    --secondary: #DA532C;
-  }
-
-  /* Text Colors
-  ---------------------------------*/
-  .tx-white, .tx-white a {
-    color: var(--info);
-  }
-  .tx-white, .tx-white a {
-    color: var(--white);
-  }
-  .tx-error, .tx-error a {
-    color: var(--error);
-  }
-  .tx-warning, .tx-warning a {
-    color: var(--warning);
-  }
-  .tx-success, .tx-success a {
-    color: var(--success);
-  }
-  .tx-muted, .tx-muted a {
-    color: var(--muted);
-  }
-  .tx-primary, .tx-primary a {
-    color: var(--primary);
-  }
-  .tx-secondary, .tx-secondary a {
-    color: var(--secondary);
-  }
-
-  /* Borders
-  ---------------------------------*/
-  .curved {
-    border-radius: 5px;
-  }
-  .rounded {
-    border-radius:12px;
-  }
-  .pill {
-    border-radius: 10000px;
-  }
-  .solid {
-    border-style: solid;
-  }
-  .thin {
-    border-width: 1px;
-  }
-
-  .bd-info {
-    border-color: var(--info);
-  }
-  .bd-error {
-    border-color: var(--error);
-  }
-  .bd-warning {
-    border-color: var(--warning);
-  }
-  .bd-success {
-    border-color: var(--success);
-  }
-  .bd-muted {
-    border-color: var(--muted);
-  }
-  .bd-primary {
-    border-color: var(--primary);
-  }
-  .bd-secondary {
-    border-color: var(--secondary);
-  }
-
-  /* Backgrounds
-  ---------------------------------*/
-  .bg-white {
-    background-color: var(--white);
-  }
-  .bg-info {
-    background-color: var(--info);
-  }
-  .bg-error {
-    background-color: var(--error);
-  }
-  .bg-warning {
-    background-color: var(--warning);
-  }
-  .bg-success {
-    background-color: var(--success);
-  }
-  .bg-muted {
-    background-color: var(--muted);
-  }
-  .bg-primary {
-    background-color: var(--primary);
-  }
-  .bg-secondary {
-    background-color: var(--secondary);
-  }
+  }`}template(){let e=this.props,{lang:r="markup",numbers:i=!1,inline:s=!1,trim:d=!1,ltrim:_=!1,rtrim:b=!1,detab:v=0}=e,x=(0,It.children)(),h=x[0]?.textContent||"";v&&(h=h.replace(new RegExp(`\\n {${v}}`,"g"),`
+`)),d?h=h.trim():_?h=h.replace(/^\s+/,""):b&&(h=h.replace(/\s+$/,""));let E=k=>{if(!h)return;let g=pt.default.highlight(h,pt.default.languages[r],r);if(k.detail.target.innerHTML=g,i){let w=g.match(/\n(?!$)/g),n=w?w.length+1:1,a=new Array(n+1).join(""),l=document.createElement("span");l.setAttribute("aria-hidden","true"),l.className="line-numbers-rows",l.innerHTML=a,k.detail.target.appendChild(l)}};return()=>[A.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism.min.css"}).element,A.TempleRegistry.createText(`
+`,!1),A.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism-tomorrow.min.css"}).element,A.TempleRegistry.createText(`
+`,!1),...r==="bash"?[A.TempleRegistry.createText(`
+  `,!1),A.TempleRegistry.createElement("div",{class:"terminal"},[A.TempleRegistry.createElement("span",{},[A.TempleRegistry.createText("$",!1)]).element,A.TempleRegistry.createText(" ",!1),...this._toNodeList(x)]).element,A.TempleRegistry.createText(`
+`,!1)]:h?[,A.TempleRegistry.createText(`
+  `,!1),...i?[A.TempleRegistry.createText(`
+    `,!1),A.TempleRegistry.createElement("pre",{class:"snippet line-numbers"},[A.TempleRegistry.createElement("code",{mount:E},[]).element]).element,A.TempleRegistry.createText(`
+  `,!1)]:[,A.TempleRegistry.createText(`
+    `,!1),A.TempleRegistry.createElement("pre",{class:"snippet pad"},[A.TempleRegistry.createElement("code",{mount:E},[]).element]).element,A.TempleRegistry.createText(`
+  `,!1)],A.TempleRegistry.createText(`
+`,!1)]:[,A.TempleRegistry.createText(`
+  `,!1),A.TempleRegistry.createElement("span",{},[A.TempleRegistry.createText("????",!1)]).element,A.TempleRegistry.createText(`
+`,!1)],A.TempleRegistry.createText(`
 
-  /* Alert
-  ---------------------------------*/
-  .alert {
-    padding: 16px;
-  }`}template(){let{color:e,info:r,warning:i,success:s,error:p,muted:h,primary:g,secondary:_,solid:y,outline:w,curved:E,rounded:x,pill:v,style:A}=(0,Q.props)(),n={classes:["alert"],styles:""},a=w?"outline":"solid";E?n.classes.push("curved"):x?n.classes.push("rounded"):v&&n.classes.push("pill"),a==="outline"?(n.classes.push("solid","thin"),e?(n.styles+=`border-color: ${e};`,n.styles+=`color: ${e};`):r?n.classes.push("bd-info","tx-info"):i?n.classes.push("bd-warning","tx-warning"):s?n.classes.push("bd-success","tx-success"):p?n.classes.push("bd-error","tx-error"):h?n.classes.push("bd-muted","tx-muted"):g?n.classes.push("bd-primary","tx-primary"):_&&n.classes.push("bd-secondary","tx-secondary")):(n.classes.push("tx-white"),e?n.styles+=`background-color: ${e};`:r?n.classes.push("bg-info"):i?n.classes.push("bg-warning"):s?n.classes.push("bg-success"):p?n.classes.push("bg-error"):h?n.classes.push("bg-muted"):g?n.classes.push("bg-primary"):_&&n.classes.push("bg-secondary"));let l={classes:[...n.classes,(0,Q.classnames)()].join(" "),styles:{...n.styles,...A}};return()=>[z.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/fontawesome/all.css"}).element,z.TempleRegistry.createText(`
-`,!1),z.TempleRegistry.createElement("div",{class:l.classes,style:l.styles},[z.TempleRegistry.createText(`
-  `,!1),...this._toNodeList((0,Q.children)()),z.TempleRegistry.createText(`
-`,!1)]).element]}};var O=M(q());var Ue=function(t,...e){let r=Ze(t);for(let i=0;i[O.TempleRegistry.createText(`
+`,!1)]}};var O=T(D());var zt=function(t){return t};var Qe=T($()),ge=class extends O.TempleComponent{static component=["translate","Translate_0014b007fc91289b2776"];styles(){return""}template(){let{trim:e=!1,p:r=!1,li:i=!1,div:s=!1}=(0,Qe.props)(),d=(0,Qe.children)(),_=[],b=[];for(let E of d)typeof E=="string"?_.push(E):E instanceof Node&&E.textContent?_.push(E.textContent):(_.push("%s"),b.push(E));let v=_.join("");e&&(v=v.replace(/\s+/," ").trim());let x=zt(v).split("%s"),h=[];for(let E=0;E[O.TempleRegistry.createText(`
     `,!1),...r?[O.TempleRegistry.createText(`
-      `,!1),O.TempleRegistry.createElement("p",{},[...this._toNodeList(w)]).element,O.TempleRegistry.createText(`
+      `,!1),O.TempleRegistry.createElement("p",{},[...this._toNodeList(h)]).element,O.TempleRegistry.createText(`
     `,!1)]:i?[,O.TempleRegistry.createText(`
-      `,!1),O.TempleRegistry.createElement("li",{},[...this._toNodeList(w)]).element,O.TempleRegistry.createText(`
+      `,!1),O.TempleRegistry.createElement("li",{},[...this._toNodeList(h)]).element,O.TempleRegistry.createText(`
     `,!1)]:s?[,O.TempleRegistry.createText(`
-      `,!1),O.TempleRegistry.createElement("div",{},[...this._toNodeList(w)]).element,O.TempleRegistry.createText(`
+      `,!1),O.TempleRegistry.createElement("div",{},[...this._toNodeList(h)]).element,O.TempleRegistry.createText(`
     `,!1)]:[,O.TempleRegistry.createText(`
-      `,!1),...this._toNodeList(w),O.TempleRegistry.createText(`
-    `,!1)]]}};var k=M(q());$.emitter.once("ready",()=>{let t=document.querySelector("script[data-app]");if(!t)throw $.TempleException.for("APP_DATA not found");try{let h=atob(t.getAttribute("data-app"));window.__APP_DATA__=JSON.parse(h),Object.entries(window.__APP_DATA__).forEach(([g,_])=>{$.data.set(g,_)})}catch{throw $.TempleException.for("APP_DATA is not a valid JSON")}$.data.set("current","document");let e="/docs/component-publisher.html",r=Ue("Component Publisher - Temple reactive web component template engine."),i=Ue("How to use Temple to publish web components."),s=h=>{document.body.classList.toggle("panel-left-open")};$.data.delete("current");let p={0:{class:"head panel-head"},1:{class:"menu fas fa-fw fa-bars",click:s},2:{href:"/temple"},3:{src:"/temple/temple-icon.png",alt:"Temple Logo"},5:{class:"tx-white",href:"/temple"},7:{class:"tx-white",href:"/temple/docs/index.html"},8:{class:"github",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},9:{class:"fab fa-github"},10:{class:"npm",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},11:{class:"fab fa-npm text-white"},12:{class:"discord",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},13:{class:"fab fa-discord text-white"},14:{class:"left panel-left"},16:{href:"/temple"},17:{src:"/temple/temple-icon.png",alt:"Temple Logo"},19:{class:"tx-white",href:"/temple"},20:{class:"toggle fas fa-fw fa-chevron-left",click:s},23:{href:"/temple/docs/index.html"},24:{href:"/temple/docs/getting-started.html"},26:{href:"/temple/docs/markup-syntax.html"},27:{href:"/temple/docs/state-management.html"},28:{href:"/temple/docs/component-strategy.html"},29:{href:"/temple/docs/compiler-api.html"},30:{href:"/temple/docs/client-api.html"},32:{href:"/temple/docs/template-engine.html"},33:{href:"/temple/docs/single-page.html"},34:{href:"/temple/docs/static-site.html"},35:{href:"/temple/docs/component-publisher.html"},36:{href:"/temple/docs/developer-tools.html"},37:{class:"panel-main"},38:{class:"docs container"},40:{p:!0,trim:!0},41:{p:!0,trim:!0},42:{solid:!0,curved:!0,info:!0},43:{class:"fas fa-info-circle"},45:{p:!0,trim:!0},46:{panel:290,title:"My Project"},47:{class:"panel-head"},48:{class:"tabs"},49:{class:"tab active",group:"project",selector:"#build-ts"},50:{class:"tab",group:"project",selector:"#component-tml"},51:{class:"tab",group:"project",selector:"#package-json"},52:{class:"panel-left"},53:{class:"folder"},54:{class:"fas fa-fw fa-chevron-down"},56:{class:"shift-1 block active",group:"project",selector:"#build-ts"},57:{class:"fas fa-fw fa-file"},58:{class:"shift-1 block",group:"project",selector:"#component-tml"},59:{class:"fas fa-fw fa-file"},60:{class:"block",group:"project",selector:"#package-json"},61:{class:"fas fa-fw fa-file"},62:{class:"panel-main"},64:{id:"build-ts",lang:"js",numbers:!0,trim:!0,detab:16},65:{id:"component-tml",style:"display:none",numbers:!0,trim:!0,detab:16},66:{id:"package-json",style:"display:none",lang:"js",numbers:!0,trim:!0,detab:16},67:{p:!0,trim:!0},68:{lang:"bash"},69:{class:"pager"},70:{class:"prev",href:"/temple/docs/static-site.html"},71:{class:"fas fa-fw fa-chevron-left"},72:{class:"next",href:"/temple/docs/developer-tools.html"},73:{class:"fas fa-fw fa-chevron-right"},74:{class:"foot"}};for(let h of document.body.querySelectorAll("*")){let g=Object.fromEntries(Array.from(h.attributes).map(y=>[y.nodeName,y.nodeValue.length>0?y.nodeValue:!0])),_=String($.TempleRegistry.elements.size);p[_]&&(Object.assign(g,p[_]),h.TempleAttributes=p[_]),$.TempleRegistry.register(h,g)}customElements.define("panel-main",W),customElements.define("ide-code",X),customElements.define("ide-app",Y),customElements.define("tui-tab",V),customElements.define("tui-alert",K),customElements.define("i18n-translate",ee),$.emitter.emit("mounted",document.body)});var lr={PanelMain_fd7f1af6410c5b5c8e1f:W,IdeCode_6f36bc13bb6a166c7abc:X,IdeApp_05341fddbfd1fe4f273b:Y,TuiTab_dd9d261e4f37efc3079c:V,TuiAlert_6b81bcb0566ce7f0cd2d:K,I18nTranslate_7d25e372f5ffb5e39dad:ee},or="8f2ff6d48aec3c3f0dc4";return Ot(ur);})();
+      `,!1),...this._toNodeList(h),O.TempleRegistry.createText(`
+    `,!1)]]}};var mt=function(t,...e){let r=Nr(t);for(let i=0;i{let t=document.querySelector("script[data-app]");if(!t)throw N.TempleException.for("APP_DATA not found");try{let _=atob(t.getAttribute("data-app"));window.__APP_DATA__=JSON.parse(_),Object.entries(window.__APP_DATA__).forEach(([b,v])=>{N.data.set(b,v)})}catch{throw N.TempleException.for("APP_DATA is not a valid JSON")}N.data.set("current","document");let e="/docs/component-publisher.html",r=mt("Component Publisher - Temple reactive web component template engine."),i=mt("How to use Temple to publish web components."),s=()=>{document.getElementsByTagName("panel-layout")[0].toggle("left")};N.data.delete("current");let d={2:{class:"flex flex-center-y px-20 py-15 m-0 bg-t-1"},3:{class:"fas fa-fw fa-bars cursor-pointer py-5 pr-10 none md-inline-block tx-t-1",click:s},4:{class:"flex-grow"},5:{class:"flex flex-center-y"},6:{class:"tx-white",href:"/temple/docs/index.html"},7:{class:"tx-t-1 tx-5xl ml-10",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},8:{class:"fab fa-github"},9:{class:"bg-h-cb3837 pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},10:{class:"fab fa-npm text-white"},11:{class:"bg-h-7289da pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},12:{class:"fab fa-discord text-white"},14:{class:"flex flex-center-y bg-t-2 py-15 pr-5 pl-10"},15:{href:"/temple"},16:{class:"h-26 mr-10",src:"/temple/temple-icon.png",alt:"Temple Logo"},17:{class:"flex-grow m-0 tx-uppercase"},18:{class:"tx-white",href:"/temple"},19:{class:"fas fa-fw fa-chevron-left cursor-pointer none md-inline-block",click:s},20:{class:"bg-t-1 scroll-auto h-calc-full-60"},21:{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-0 pt-20 pb-10 pl-10 tx-uppercase"},22:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/index.html"},23:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/getting-started.html"},24:{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},25:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/markup-syntax.html"},26:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/state-management.html"},27:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-strategy.html"},28:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/compiler-api.html"},29:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/client-api.html"},30:{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},31:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/template-engine.html"},32:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/single-page.html"},33:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/static-site.html"},34:{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/component-publisher.html"},35:{class:"block tx-t-1 py-10 pl-10 mb-100",href:"/temple/docs/developer-tools.html"},38:{class:"tx-primary tx-uppercase tx-30 py-20"},39:{p:!0,trim:!0,class:"tx-lh-36 py-20"},40:{p:!0,trim:!0,class:"tx-lh-36 py-20"},41:{solid:!0,curved:!0,info:!0},42:{class:"fas fa-info-circle"},44:{p:!0,trim:!0,class:"tx-lh-36 py-20"},45:{height:290,title:"My Project"},47:{class:"flex scroll-x-auto pt-5 pl-5"},48:{on:!0,class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"publisher",selector:"#build-ts"},49:{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"publisher",selector:"#component-tml"},50:{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"publisher",selector:"#package-json"},52:{class:"p-5"},53:{class:"fas fa-fw fa-chevron-down"},55:{on:!0,class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"publisher",selector:"#build-ts"},56:{class:"fas fa-fw fa-file"},57:{class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"publisher",selector:"#component-tml"},58:{class:"fas fa-fw fa-file"},59:{class:"pt-10 block",active:"tx-white",inactive:"tx-muted",group:"publisher",selector:"#package-json"},60:{class:"fas fa-fw fa-file"},62:{id:"build-ts",lang:"js",numbers:!0,trim:!0,detab:16},63:{id:"component-tml",style:"display:none",numbers:!0,trim:!0,detab:16},64:{id:"package-json",style:"display:none",lang:"js",numbers:!0,trim:!0,detab:16},65:{p:!0,trim:!0,class:"tx-lh-36 py-20"},66:{lang:"bash"},67:{class:"flex"},68:{class:"tx-primary py-40",href:"/temple/docs/static-site.html"},69:{class:"fas fa-fw fa-chevron-left tx-t-1"},70:{class:"flex-grow tx-right tx-primary py-40",href:"/temple/docs/developer-tools.html"},71:{class:"fas fa-fw fa-chevron-right tx-t-1"},72:{class:"foot"}};for(let _ of document.body.querySelectorAll("*")){let b=Object.fromEntries(Array.from(_.attributes).map(x=>[x.nodeName,x.nodeValue.length>0?x.nodeValue:!0])),v=String(N.TempleRegistry.elements.size);d[v]&&(Object.assign(b,d[v]),_.TempleAttributes=d[v]),N.TempleRegistry.register(_,b)}customElements.define("panel-layout",ne),customElements.define("panel-head",ae),customElements.define("panel-left",ie),customElements.define("panel-main",le),customElements.define("tui-tab",oe),customElements.define("api-docs",ce),customElements.define("app-head",de),customElements.define("app-left",fe),customElements.define("app-main",pe),customElements.define("ide-app",me),customElements.define("ide-code",he),customElements.define("i18n-translate",ge),N.emitter.emit("mounted",document.body)});var Rr={PanelLayout_9f3ab204ce271feaf6f7:ne,PanelHead_2bf4dff19bc88ba4138b:ae,PanelLeft_f4ab589e043eee17d229:ie,PanelMain_847772763f4518728ede:le,TuiTab_5a341768ef0a010965e3:oe,ApiDocs_40562a7bb56d70d971df:ce,AppHead_939ecb5f22962d8c2924:de,AppLeft_a7102198c3628da88b4f:fe,AppMain_bbd0517424ebab9de270:pe,IdeApp_381239c61b65b86a1c20:me,IdeCode_5294df1c620ef5ddbd2f:he,I18nTranslate_0014b007fc91289b2776:ge},qr="8f2ff6d48aec3c3f0dc4";return Qt(Hr);})();
 /*! Bundled license information:
 
 prismjs/prism.js:
diff --git a/docs/build/client/a52462b5d1f8879f7b73.css b/docs/build/client/a52462b5d1f8879f7b73.css
new file mode 100644
index 0000000..a1b18fb
--- /dev/null
+++ b/docs/build/client/a52462b5d1f8879f7b73.css
@@ -0,0 +1,300 @@
+html, body {
+  height: 100%;
+  margin: 0;
+  padding: 0;
+  width: 100%;
+}
+
+h1, h2, h3, h4, h5, h6, p {
+  margin: 0;
+  padding: 0;
+}
+
+a {
+  text-decoration: none;
+}
+  html-head:not(:defined) { opacity: 0; }
+html-header:not(:defined) { opacity: 0; }
+html-aside:not(:defined) { opacity: 0; }
+panel-layout:not(:defined) { opacity: 0; }
+panel-head:not(:defined) { opacity: 0; }
+panel-left:not(:defined) { opacity: 0; }
+panel-right:not(:defined) { opacity: 0; }
+panel-main:not(:defined) { opacity: 0; }
+tui-button:not(:defined) { opacity: 0; }
+tui-alert:not(:defined) { opacity: 0; }
+tui-tab:not(:defined) { opacity: 0; }
+api-docs:not(:defined) { opacity: 0; }
+api-ui:not(:defined) { opacity: 0; }
+app-head:not(:defined) { opacity: 0; }
+app-left:not(:defined) { opacity: 0; }
+app-main:not(:defined) { opacity: 0; }
+ide-app:not(:defined) { opacity: 0; }
+ide-code:not(:defined) { opacity: 0; }
+ide-preview:not(:defined) { opacity: 0; }
+i18n-translate:not(:defined) { opacity: 0; }
+  :root {
+  --black: #000000;
+  --white: #FFFFFF;
+  --info: #1474FC;
+  --error: #DC3545;
+  --warning: #FF7B07;
+  --success: #28A745;
+  --muted: #999999;
+}
+
+.light {
+  --bg-0: #EFEFEF;
+  --bg-1: #CFCFCF;
+  --bg-2: #AFAFAF;
+  --bg-3: #8F8F8F;
+  --bg-4: #6F6F6F;
+  --bd-0: #EFEFEF;
+  --bd-1: #CFCFCF;
+  --bd-2: #AFAFAF;
+  --bd-3: #8F8F8F;
+  --bd-4: #6F6F6F;
+  --bg-inverse: #242424;
+  --tx-0: #000000;
+  --tx-1: #242424;
+  --tx-inverse: #CFCFCF;
+}
+
+.dark {
+  --bg-0: #121212;
+  --bg-1: #222222;
+  --bg-2: #323232;
+  --bg-3: #424242;
+  --bg-4: #525252;
+  --bd-0: #121212;
+  --bd-1: #222222;
+  --bd-2: #323232;
+  --bd-3: #424242;
+  --bd-4: #525252;
+  --bg-inverse: #DBDBDB;
+  --tx-0: #FFFFFF;
+  --tx-1: #CFCFCF;
+  --tx-inverse: #222222;
+}
+  html-head { display: block; }
+html-header { display: block; }
+html-aside { display: block; }
+panel-layout { display: block; }
+panel-head { display: block; }
+panel-left { display: block; }
+panel-right { display: block; }
+panel-main { display: block; }
+tui-button { display: block; }
+tui-alert { display: block; }
+tui-tab { display: block; }
+api-docs { display: block; }
+api-ui { display: block; }
+api-ide-code { display: block; }
+app-head { display: block; }
+app-left { display: block; }
+app-main { display: block; }
+ide-app { display: block; }
+ide-code { display: block; }
+ide-preview { display: block; }
+i18n-translate { display: block; }
+  .arial { font-family: Arial, sans-serif; }
+.none { display: none; }
+.block { display: block; }
+.flex { display: flex; }
+.inline { display: inline; }
+.inline-block { display: inline-block; }
+.transparent { opacity: 0; }
+.relative { position: relative; }
+.absolute { position: absolute; }
+.static { position: static; }
+.bottom-0 { bottom: 0px; }
+.bottom-60 { bottom: 60px; }
+.left-0 { left: 0px; }
+.left-226 { left: 226px; }
+.left-0 { left: 0px; }
+.left-226 { left: 226px; }
+.left--226 { left: -226px; }
+.left-170 { left: 170px; }
+.right-0 { right: 0px; }
+.right--200 { right: -200px; }
+.right-0 { right: 0px; }
+.right-200 { right: 200px; }
+.right-200 { right: 200px; }
+.top-0 { top: 0px; }
+.top-60 { top: 60px; }
+.top-45 { top: 45px; }
+.z-1 { z-index: 1; }
+.z-2 { z-index: 2; }
+.flex-grow { flex-grow: 1; }
+.flex-center { align-items: center; justify-content: center; }
+.flex-center-y { align-items: center; }
+.basis-half { flex-basis: 50%; }
+.gap-10 { gap: 10px; }
+.scroll-auto { overflow: auto; }
+.scroll-hidden { overflow: hidden; }
+.scroll-x-auto { overflow-x: auto; }
+.scroll-x-hidden { overflow-x: hidden; }
+.scroll-y-auto { overflow-y: auto; }
+.h-full { height: 100%; }
+.h-26 { height: 26px; }
+.h-7289 { height: 7289px; }
+.h-905496362982981723 { height: 905496362982981723px; }
+.h-60 { height: 60px; }
+.h-24 { height: 24px; }
+.h-45 { height: 45px; }
+.h-000000 { height: 000000px; }
+.h-999999 { height: 999999px; }
+.h-10 { height: 10px; }
+.h-32 { height: 32px; }
+.h-36 { height: 36px; }
+.h-140 { height: 140px; }
+.h-calc-full-60 { height: calc(100% - 60px); }
+.h-calc-full-40 { height: calc(100% - 40px); }
+.vh { height: 100vh; }
+.w-full { width: 100%; }
+.w-226 { width: 226px; }
+.w-200 { width: 200px; }
+.w-0 { width: 0px; }
+.w-170 { width: 170px; }
+.w-10 { width: 10px; }
+.bg-primary { background-color: var(--primary) !important; }
+.bg-secondary { background-color: var(--secondary) !important; }
+.bg-black { background-color: var(--black) !important; }
+.bg-white { background-color: var(--white) !important; }
+.bg-info { background-color: var(--info) !important; }
+.bg-error { background-color: var(--error) !important; }
+.bg-warning { background-color: var(--warning) !important; }
+.bg-success { background-color: var(--success) !important; }
+.bg-muted { background-color: var(--muted) !important; }
+.bg-t-1 { background-color: var(--bg-1) !important; }
+.bg-t-2 { background-color: var(--bg-2) !important; }
+.bg-t-0 { background-color: var(--bg-0) !important; }
+.bg-h-cb3837 { background-color: #cb3837; }
+.bg-h-7289da { background-color: #7289da; }
+.bg-h-000000 { background-color: #000000; }
+.bg-h-999999 { background-color: #999999; }
+.tx-5 { font-size: 5px; }
+.tx-14 { font-size: 14px; }
+.tx-16 { font-size: 16px; }
+.tx-30 { font-size: 30px; }
+.tx-26 { font-size: 26px; }
+.tx-22 { font-size: 22px; }
+.tx-lg { font-size: 16px; }
+.tx-5xl { font-size: 26px; }
+.tx-center { text-align: center; }
+.tx-left { text-align: left; }
+.tx-right { text-align: right; }
+.tx-bold { font-weight: bold; }
+.tx-underline { text-decoration: underline; }
+.tx-uppercase { text-transform: uppercase; }
+.tx-nowrap { white-space: nowrap; }
+.tx-nodecor { text-decoration: none; }
+.tx-top { vertical-align: top; }
+.tx-lh-24 { line-height: 24px; }
+.tx-lh-32 { line-height: 32px; }
+.tx-lh-36 { line-height: 36px; }
+.tx-primary { color: var(--primary) !important; }
+.tx-secondary { color: var(--secondary) !important; }
+.tx-black { color: var(--black) !important; }
+.tx-white { color: var(--white) !important; }
+.tx-info { color: var(--info) !important; }
+.tx-error { color: var(--error) !important; }
+.tx-warning { color: var(--warning) !important; }
+.tx-success { color: var(--success) !important; }
+.tx-muted { color: var(--muted) !important; }
+.tx-t-1 { color: var(--tx-1) !important; }
+.tx-t-0 { color: var(--tx-0) !important; }
+.bd-solid { border-style: solid; }
+.bd-collapse { border-collapse: collapse; }
+.bd-primary { border-color: var(--primary) !important; }
+.bd-secondary { border-color: var(--secondary) !important; }
+.bd-info { border-color: var(--info) !important; }
+.bd-error { border-color: var(--error) !important; }
+.bd-warning { border-color: var(--warning) !important; }
+.bd-success { border-color: var(--success) !important; }
+.bd-muted { border-color: var(--muted) !important; }
+.bd-t-2 { border-color: var(--bd-2) !important; }
+.bd-t-1 { border-color: var(--bd-1) !important; }
+.bdb-0 { border-bottom-width: 0px; }
+.bdb-1 { border-bottom-width: 1px; }
+.bdl-0 { border-left-width: 0px; }
+.bdr-1 { border-right-width: 1px; }
+.bdt-0 { border-top-width: 0px; }
+.bdt-1 { border-top-width: 1px; }
+.bdx-0 { border-left-width: 0px; border-right-width: 0px; }
+.bdy-0 { border-top-width: 0px; border-bottom-width: 0px; }
+.curved { border-radius: 4px; }
+.rounded { border-radius: 12px; }
+.pill { border-radius: 10000px; }
+.curve-t-sm { border-radius: 4px 4px 0 0; }
+.m-0 { margin: 0px; }
+.m-0 { margin: 0px; }
+.m-60 { margin: 60px; }
+.mb-0 { margin-bottom: 0px; }
+.mb-100 { margin-bottom: 100px; }
+.mb-20 { margin-bottom: 20px; }
+.ml-10 { margin-left: 10px; }
+.ml-5 { margin-left: 5px; }
+.ml-2 { margin-left: 2px; }
+.mr-10 { margin-right: 10px; }
+.mt-0 { margin-top: 0px; }
+.mt-20 { margin-top: 20px; }
+.my-40 { margin-top: 40px; margin-bottom: 40px; }
+.p-5 { padding: 5px; }
+.p-0 { padding: 0px; }
+.p-60 { padding: 60px; }
+.p-16 { padding: 16px; }
+.p-10 { padding: 10px; }
+.p-45 { padding: 45px; }
+.p-10 { padding: 10px; }
+.pb-10 { padding-bottom: 10px; }
+.pb-20 { padding-bottom: 20px; }
+.pl-10 { padding-left: 10px; }
+.pl-20 { padding-left: 20px; }
+.pl-5 { padding-left: 5px; }
+.pl-15 { padding-left: 15px; }
+.pr-10 { padding-right: 10px; }
+.pr-5 { padding-right: 5px; }
+.pt-20 { padding-top: 20px; }
+.pt-40 { padding-top: 40px; }
+.pt-5 { padding-top: 5px; }
+.pt-10 { padding-top: 10px; }
+.px-20 { padding-left: 20px; padding-right: 20px; }
+.px-4 { padding-left: 4px; padding-right: 4px; }
+.px-8 { padding-left: 8px; padding-right: 8px; }
+.px-12 { padding-left: 12px; padding-right: 12px; }
+.px-16 { padding-left: 16px; padding-right: 16px; }
+.px-24 { padding-left: 24px; padding-right: 24px; }
+.px-28 { padding-left: 28px; padding-right: 28px; }
+.px-32 { padding-left: 32px; padding-right: 32px; }
+.px-36 { padding-left: 36px; padding-right: 36px; }
+.px-10 { padding-left: 10px; padding-right: 10px; }
+.py-15 { padding-top: 15px; padding-bottom: 15px; }
+.py-5 { padding-top: 5px; padding-bottom: 5px; }
+.py-10 { padding-top: 10px; padding-bottom: 10px; }
+.py-2 { padding-top: 2px; padding-bottom: 2px; }
+.py-4 { padding-top: 4px; padding-bottom: 4px; }
+.py-6 { padding-top: 6px; padding-bottom: 6px; }
+.py-8 { padding-top: 8px; padding-bottom: 8px; }
+.py-12 { padding-top: 12px; padding-bottom: 12px; }
+.py-14 { padding-top: 14px; padding-bottom: 14px; }
+.py-16 { padding-top: 16px; padding-bottom: 16px; }
+.py-18 { padding-top: 18px; padding-bottom: 18px; }
+.py-20 { padding-top: 20px; padding-bottom: 20px; }
+.py-40 { padding-top: 40px; padding-bottom: 40px; }
+.cursor-pointer { cursor: pointer; }
+.transition-500 { transition: 500ms; }
+.shadow-0-0-10-0-0-0-5 { box-shadow: 0px 0px 10px rgb(0, 0, 0, 0.5); }
+@media (max-width: 992px) {
+  .lg-block { display: block; }
+  .lg-h-auto { height: auto; }
+}
+@media (max-width: 767px) {
+  .md-inline-block { display: inline-block; }
+  .md-left-0 { left: 0px; }
+  .md-left-226 { left: 226px; }
+  .md-left--226 { left: -226px; }
+  .md-right--200 { right: -200px; }
+  .md-right-0 { right: 0px; }
+  .md-right-200 { right: 200px; }
+}
\ No newline at end of file
diff --git a/docs/build/client/a52462b5d1f8879f7b73.html b/docs/build/client/a52462b5d1f8879f7b73.html
new file mode 100644
index 0000000..dcb276c
--- /dev/null
+++ b/docs/build/client/a52462b5d1f8879f7b73.html
@@ -0,0 +1,376 @@
+
+
+  
+  
+  
+  Temple - The reactive web component template engine.
+  
+  
+  
+  
+  
+  
+  
+  
+  
+  
+  
+  
+  
+  
+  
+  
+  
+  
+  
+
+  
+    
+      
+  
+    
+    

+  
+  
+
+      

+  
+    Temple Logo
+  
+  

+    Temple
+  

+  
+

+
+      
+        
+          

+            On this page
+          

+          
+        
+      
+      
+        
+          

+            Getting Started
+          

+
+          
+            In most cases Temple will be used to render a front end from 
+            a server framework. In this example, we will use the native
+            NodeJS HTTP module to create a server that renders a page
+            using Temple. Start by replacing the 
+            src/index.ts
+            file with the following code. 
+            function() {}
+          
+
+          
+            
+              npm init -y && npm install --save @ossph/temple && npm install --save-dev ts-node typescript @types/node
+            
+          
+
+          

+            1. Add HTTP
+          

+
+          
+            In most cases Temple will be used to render a front end from 
+            a server framework. In this example, we will use the native
+            NodeJS HTTP module to create a server that renders a page
+            using Temple. Start by replacing the 
+            src/index.ts
+            file with the following code. 
+            function() {}
+          
+
+          
+            
+              import temple from '@ossph/temple/compiler';
+              // make a temple compiler
+              const compiler = temple();
+              // render HTML
+              compiler.render('./src/page.dtml').then(console.log);
+              // render CSS
+              compiler.styles('./src/page.dtml').then(console.log);
+              // render JS
+              compiler.client('./src/page.dtml').then(console.log);
+            
+          
+
+          

+            1. Add HTTP
+          

+
+          
+            In most cases Temple will be used to render a front end from 
+            a server framework. In this example, we will use the native
+            NodeJS HTTP module to create a server that renders a page
+            using Temple. Start by replacing the 
+            src/index.ts
+            file with the following code. 
+            function() {}
+          
+
+          
+            

+              
+                <style>
+                  h1 { font-weight: bold; }
+                </style>
+                <script>
+                  const name = 'world';
+                </script>
+                <h1>Hello {name}!</h1>
+              
+              
+                
Hello world!

+              
+            

+          
+
+          
+            
+            Recommended:
+            Download the Temple editor plugin at the Visual Studio Marketplace.
+          
+
+          
+            
+              

+                
+                  src/index.ts
+                
+                
+                  src/page.dtml
+                
+                
+                  package.json
+                
+              

+            
+            
+              

+                
+                src
+              

+              
+                
+                index.ts
+              
+              
+                
+                page.dtml
+              
+              
+                
+                package.json
+              
+            
+            
+              
+                import http from 'http';
+                import temple from '@ossph/temple/compiler';
+
+                // create temple compiler
+                const compiler = temple();
+                // create http server
+                const server = http.createServer(async (req, res) => {
+                  // if build asset...
+                  if (req.url?.startsWith('/build/')) {
+                    // get filename ie. abc123.js
+                    const filename = req.url.substring(7);
+                    // get asset
+                    const { type, content } = await compiler.asset(filename);
+                    // send response
+                    res.writeHead(200, { 'Content-Type': type });
+                    return res.end(content);
+                  // if home page
+                  } else if (req.url === '/') {
+                    // render and send response
+                    res.writeHead(200, { 'Content-Type': 'text/html' });
+                    return res.end(await compiler.render('./src/page.dtml', {
+                      title: 'Hello World'
+                    }));
+                  }
+                });
+                // listen on port 3000
+                server.listen(3000);
+              
+              
+              
+            
+          
+
+          
+
+          
+        
+      
+    
+  
+
\ No newline at end of file
diff --git a/docs/build/client/a52462b5d1f8879f7b73.js b/docs/build/client/a52462b5d1f8879f7b73.js
new file mode 100644
index 0000000..1f61b15
--- /dev/null
+++ b/docs/build/client/a52462b5d1f8879f7b73.js
@@ -0,0 +1,427 @@
+var TempleAPI=(()=>{var ms=Object.create;var Ve=Object.defineProperty;var fs=Object.getOwnPropertyDescriptor;var hs=Object.getOwnPropertyNames;var gs=Object.getPrototypeOf,ys=Object.prototype.hasOwnProperty;var N=(t,e)=>()=>(e||t((e={exports:{}}).exports,e),e.exports),bs=(t,e)=>{for(var s in e)Ve(t,s,{get:e[s],enumerable:!0})},qt=(t,e,s,n)=>{if(e&&typeof e=="object"||typeof e=="function")for(let r of hs(e))!ys.call(t,r)&&r!==s&&Ve(t,r,{get:()=>e[r],enumerable:!(n=fs(e,r))||n.enumerable});return t};var _=(t,e,s)=>(s=t!=null?ms(gs(t)):{},qt(e||!t||!t.__esModule?Ve(s,"default",{value:t,enumerable:!0}):s,t)),xs=t=>qt(Ve({},"__esModule",{value:!0}),t);var De=N(At=>{"use strict";Object.defineProperty(At,"__esModule",{value:!0});var Et=class extends Error{static for(e,...s){return s.forEach(function(n){e=e.replace("%s",n)}),new this(e)}static forErrorsFound(e){let s=new this("Invalid Parameters");return s.errors=e,s}static require(e,s,...n){if(!e){for(let r of n)s=s.replace("%s",r);throw new this(s)}}constructor(e,s=500){super(),this.errors={},this.start=0,this.end=0,this.message=e,this.name=this.constructor.name,this.code=s}withCode(e){return this.code=e,this}withPosition(e,s){return this.start=e,this.end=s,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};At.default=Et});var et=N(I=>{"use strict";var ks=I&&I.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(I,"__esModule",{value:!0});I.match=I.TempleEmitter=I.events=void 0;I.bindAttribute=U;I.unbindAttribute=Jt;var zt=ks(tt());I.events=["click","dblclick","mousedown","mouseup","mousemove","mouseover","mouseout","wheel","keydown","keypress","keyup","blur","change","contextmenu","focus","input","submit","invalid","reset","search","select","copy","cut","paste","drag","dragstart","dragend","dragover","dragenter","dragleave","drop","scroll","durationchange","ended","error","loadeddata","loadedmetadata","loadstart","pause","play","playing","progress","ratechange","seeked","seeking","stalled","suspend","timeupdate","volumechange","waiting","animationstart","animationend","animationiteration","transitionend","toggle"];var Ke=class extends EventTarget{emit(e,s){return this.dispatchEvent(new CustomEvent(e,{detail:s})),this}on(e,s){if(e==="ready"&&document.readyState!=="loading"){let n=new CustomEvent("ready");return setTimeout(()=>s(n),1),this}return this.addEventListener(e,s),this}once(e,s){let n=r=>{this.unbind(e,n),s(r)};return this.on(e,n),this}unbind(e,s){return this.removeEventListener(e,s),this}};I.TempleEmitter=Ke;var vs=(t,e)=>Array.from(t.querySelectorAll("*")).filter(s=>{let n=zt.default.get(s),r=n&&n.hasAttribute(e)&&!n.hasEvent(e);return r&&n.addEvent(e),r}).map(s=>zt.default.get(s));I.match=vs;function U(t,e){Qe.on("mounted",s=>{if(!s.detail)return;let n=s.detail;(0,I.match)(n.shadowRoot||n,t).forEach(e)})}function Jt(t,e){Qe.on("unmounted",s=>{if(!s.detail)return;let n=s.detail;(0,I.match)(n.shadowRoot||n,t).forEach(e)})}var Qe=new Ke;I.default=(document.onreadystatechange=()=>{document.readyState!=="loading"&&Qe.emit("ready")},U("mount",t=>{let e=t.getAttribute("mount");if(typeof e=="function"){let s=new CustomEvent("mount",{detail:{node:t,target:t.element}});e(s)}}),Jt("unmount",t=>{let e=t.getAttribute("unmount");if(typeof e=="function"){let s=new CustomEvent("unmount",{detail:{node:t,target:t.element}});e(s)}}),U("connect",t=>{let e=t.getAttribute("connect");if(typeof e=="function"){let s=new CustomEvent("connect",{detail:{node:t,target:t.element}});e(s)}}),U("disconnect",t=>{let e=t.getAttribute("disconnect");if(typeof e=="function"){let s=new CustomEvent("disconnect",{detail:{node:t,target:t.element}});e(s)}}),U("adopt",t=>{let e=t.getAttribute("adopt");if(typeof e=="function"){let s=new CustomEvent("adopt",{detail:{node:t,target:t.element}});e(s)}}),U("if",t=>{let e=t.getAttribute("if");(e===!1||e==="false"||typeof e=="function"&&!e())&&t.element.remove()}),I.events.forEach(t=>U(t,e=>{let s=e.getAttribute(t);typeof s=="function"&&(e.element.removeEventListener(t,s),e.element.addEventListener(t,s))})),Qe)});var Ft=N(Pe=>{"use strict";var Ts=Pe&&Pe.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Pe,"__esModule",{value:!0});var Lt=Ts(et()),Rt=class{get attributes(){return Object.assign({},this._attributes)}get element(){return this._element}get events(){return this._events}constructor(e,s){this._events=new Set,this._element=e,this._attributes=s}addEvent(e){return this._events.add(e),this}getAttribute(e){return this._attributes[e]}hasAttribute(e){return e in this._attributes}hasEvent(e){return this._events.has(e)}removeAttribute(e,s=!1){let n=this.getAttribute(e);return typeof n>"u"?this:(delete this._attributes[e],this._element.removeAttribute(e),s||Lt.default.emit("attribute-remove",{element:this,key:e,previous:n}),this)}setAttribute(e,s,n=!1){if(typeof s>"u")return this.removeAttribute(e,n);let r=this.getAttribute(e);return r===s?this:(this._attributes[e]=s,typeof s=="string"&&this._element.setAttribute(e,s),n||(typeof r>"u"?Lt.default.emit("attribute-create",{element:this,key:e,value:s}):Lt.default.emit("attribute-update",{element:this,key:e,value:s,previous:r})),this)}setAttributes(e,s=!1){for(let[r,u]of Object.entries(e))this.setAttribute(r,u,s);let n=Object.keys(e);for(let r of Object.keys(this._attributes))n.includes(r)||this.removeAttribute(r,s);return this}};Pe.default=Rt});var tt=N(je=>{"use strict";var _s=je&&je.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(je,"__esModule",{value:!0});var ws=_s(Ft()),Gt=document.createElement("textarea"),Es=t=>(Gt.innerHTML=t,Gt.value),st=class{static get elements(){return this._elements}static createComponent(e,s,n,r=[]){let u=document.createElement("template");u.innerHTML=`<${e}>`;let d=u.content.querySelector(`${e}`);return Object.setPrototypeOf(d,s.prototype),d.constructor=s.constructor,d.constructor.component=s.component,d.register(n,r),d.element}static createElement(e,s,n=[]){let r=document.createElement(e);for(let[u,b]of Object.entries(s))typeof b=="string"?r.setAttribute(u,b):b===!0&&r.setAttribute(u,u);return n.filter(u=>typeof u<"u").forEach(u=>r.appendChild(u)),this.register(r,s)}static createText(e,s=!0){return document.createTextNode(Es(e))}static filter(e){let s=[];return this._elements.forEach((n,r)=>{e(n,r)&&s.push(n)}),s}static get(e){return this._elements.get(e)||null}static has(e){return this._elements.has(e)}static map(e){let s=[];return this._elements.forEach((n,r)=>{s.push(e(n,r))}),s}static register(e,s){if(this.has(e))return this.get(e);let n=new ws.default(e,s||{});return this._elements.set(e,n),n}};st._elements=new Map;je.default=st});var le=N(Me=>{"use strict";Object.defineProperty(Me,"__esModule",{value:!0});Me.TempleDataMap=void 0;var rt=class{constructor(){window.__APP_DATA__||(window.__APP_DATA__={})}clear(){return window.__APP_DATA__={},this}delete(e){return this.has(e)?(delete window.__APP_DATA__[e],!0):!1}entries(){return Object.entries(window.__APP_DATA__)}has(e){return e in window.__APP_DATA__}get(e){return window.__APP_DATA__[e]}keys(){return Object.keys(window.__APP_DATA__)}set(e,s){return window.__APP_DATA__[e]=s,this}values(){return Object.values(window.__APP_DATA__)}};Me.TempleDataMap=rt;var As=new rt;Me.default=As});var Ut=N(Ne=>{"use strict";var it=Ne&&Ne.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Ne,"__esModule",{value:!0});var Wt=it(De()),Z=it(tt()),X=it(et()),nt=it(le()),St=class t extends HTMLElement{static register(){customElements.define(this.component[0],this)}get attr(){return Object.fromEntries(Array.from(this.attributes).map(e=>[e.name,e.value]))}get element(){if(!Z.default.has(this))throw Wt.default.for("Component not mapped.");return Z.default.get(this)}get metadata(){let[e,s]=this.constructor.component;return{tagname:e,classname:s}}get originalChildren(){return this._children}get initiated(){return this._initiated}get props(){return this.getAttributes()}get virtual(){return this._virtual}set props(e){this.setAttributes(e)}constructor(){if(super(),this._initiated=!1,this._template=null,this._children=void 0,this._rendering=!1,this._observer=null,this._virtual=!1,!Z.default.has(this))throw Wt.default.for("Component not mapped.")}adoptedCallback(){this.render(),X.default.emit("adopt",this)}connectedCallback(){this.wait(),X.default.emit("connect",this)}disconnectedCallback(){X.default.emit("disconnect",this)}getAttribute(e){return this.element.getAttribute(e)}getAttributes(){return Object.assign({},this.element.attributes)}getParentComponent(){let e=this.parentElement;for(;e;){if(e instanceof t)return e;e=e.parentElement}return null}hasAttribute(e){return this.element.hasAttribute(e)}register(e={},s=[]){Z.default.has(this)?Z.default.get(this).setAttributes(e):Z.default.register(this,e);for(let[n,r]of Object.entries(e))typeof r=="string"?super.setAttribute(n,r):r===!0&&super.setAttribute(n,n);this._children=s,this._virtual=!0,this.connectedCallback()}removeAttribute(e){this.hasAttribute(e)&&this.element.removeAttribute(e),super.hasAttribute(e)&&super.removeAttribute(e)}render(){let e=this.getParentComponent();if(e&&!e.initiated)return;if(this._rendering)return;this._rendering=!0;let s=nt.default.get("current");nt.default.set("current",this);let n=this.styles();this._template?X.default.emit("unmounted",this):this._template=this.template();let r=this._template().filter(Boolean);if(n.length===0)this.textContent="",r.forEach(u=>this.appendChild(u));else{this.shadowRoot||this.attachShadow({mode:"open"});let u=this.shadowRoot;this.textContent="",u.textContent="";let b=document.createElement("style");b.innerText=n,u.appendChild(b),r.forEach(d=>{var T;return(T=this.shadowRoot)===null||T===void 0?void 0:T.appendChild(d)})}return s?nt.default.set("current",s):nt.default.delete("current"),this._initiated=!0,this._rendering=!1,X.default.emit("mounted",this),this.shadowRoot?this.shadowRoot.innerHTML:this.innerHTML}setAttribute(e,s){this.element.setAttribute(e,s),(typeof s=="string"||s===!0)&&super.setAttribute(e,s)}setAttributes(e){this.element.setAttributes(e)}wait(){if(document.readyState!=="loading")this._update();else{let e=()=>{this._update(),X.default.unbind("ready",e)};X.default.on("ready",e)}}_toNodeList(e){return e instanceof Node?[e]:Array.isArray(e)&&e.every(s=>s instanceof Node)?e:[Z.default.createText(String(e))]}_update(){typeof this._children>"u"&&(this._children=Array.from(this.childNodes||[])),this._initiated||this.render()}};Ne.default=St});var oe=N(Ie=>{"use strict";var Zt=Ie&&Ie.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Ie,"__esModule",{value:!0});Ie.default=Fs;var Ls=Zt(De()),Rs=Zt(le());function Fs(t=null,e=!1){if(!t&&(t=Rs.default.get("current"),!t)){if(!e)throw Ls.default.for("Not called within a Temple component");return null}return t}});var Xt=N(Oe=>{"use strict";var Ss=Oe&&Oe.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Oe,"__esModule",{value:!0});var Cs=Ss(le());function Ds(t){let e=Cs.default.get("env")||{};return t?e[t]||null:e}Oe.default=Ds});var Ct=N($e=>{"use strict";var Yt=$e&&$e.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty($e,"__esModule",{value:!0});$e.default=Ms;var Ps=Yt(oe()),js=Yt(le());function Ms(t=null){let e=(0,Ps.default)(t,!0);return typeof e=="string"?js.default.get("props")||{}:e?e.props:{}}});var Kt=N(pe=>{"use strict";var Vt=pe&&pe.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(pe,"__esModule",{value:!0});pe.classlist=Os;pe.default=$s;var Ns=Vt(oe()),Is=Vt(Ct());function Os(t=null){var e;if(t==="body")return document.body.classList;if(t==="head")return document.head.classList;if(t==="document")return(e=document.body.parentElement)===null||e===void 0?void 0:e.classList;let s=(0,Ns.default)(t);return s?.classList}function $s(t=null){return(0,Is.default)(t).class}});var Qt=N(Y=>{"use strict";var Bs=Y&&Y.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Y,"__esModule",{value:!0});Y.innerHTML=qs;Y.innerText=zs;Y.default=Dt;var Hs=Bs(oe());function qs(t=null){let e=Dt(t),s=document.createElement("template");return s.append(...e.map(n=>n.cloneNode(!0))),s.innerHTML}function zs(t=null){let e=Dt(t),s=document.createElement("template");return s.append(...e.map(n=>n.cloneNode(!0))),s.innerText}function Dt(t=null){let e=(0,Hs.default)(t,!0);return typeof e!="string"&&e?e.originalChildren||[]:[]}});var ts=N(V=>{"use strict";var es=V&&V.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(V,"__esModule",{value:!0});V.SignalRegistry=void 0;V.default=Ws;var Js=es(oe()),Gs=es(De()),ce=class t{static observe(e,s){let n={getter:()=>u.raw,setter:d=>d},r=new Set,u={raw:s,change(d){r.add(d)},getter(d){return n.getter=d,u},setter(d){return n.setter=d,u}};Object.defineProperty(u,"value",{get(){return n.getter()},set(d){let T=n.setter(d),v=t.serialize(T)!==t.serialize(u.raw);u.raw=T,v&&(r.forEach(m=>m(T)),e.render())}});let b=this._observers.get(e);return b?(b.observed++,b.values.push(u)):this._observers.set(e,{observed:1,values:[u]}),u}static observer(e){return this._observers.get(e)||null}static serialize(e){return JSON.stringify(e)}};V.SignalRegistry=ce;ce._observers=new Map;function Ws(t,e=null){let s=(0,Js.default)(e);if(!s.initiated)return ce.observe(s,t);let n=ce.observer(s);if(!n)throw Gs.default.for("Signal state mismatch");return n.values[n.observed++%n.values.length]}});var jt=N(k=>{"use strict";var Us=k&&k.__createBinding||(Object.create?function(t,e,s,n){n===void 0&&(n=s);var r=Object.getOwnPropertyDescriptor(e,s);(!r||("get"in r?!e.__esModule:r.writable||r.configurable))&&(r={enumerable:!0,get:function(){return e[s]}}),Object.defineProperty(t,n,r)}:function(t,e,s,n){n===void 0&&(n=s),t[n]=e[s]}),Zs=k&&k.__setModuleDefault||(Object.create?function(t,e){Object.defineProperty(t,"default",{enumerable:!0,value:e})}:function(t,e){t.default=e}),Be=k&&k.__importStar||function(t){if(t&&t.__esModule)return t;var e={};if(t!=null)for(var s in t)s!=="default"&&Object.prototype.hasOwnProperty.call(t,s)&&Us(e,t,s);return Zs(e,t),e},K=k&&k.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(k,"__esModule",{value:!0});k.SignalRegistry=k.TempleException=k.TempleEmitter=k.TempleElement=k.TempleRegistry=k.TempleComponent=k.TempleDataMap=k.emitter=k.signal=k.innerHTML=k.innerText=k.children=k.classnames=k.classlist=k.props=k.env=k.data=k.component=void 0;var Xs=K(De());k.TempleException=Xs.default;var Ys=K(Ut());k.TempleComponent=Ys.default;var Vs=K(tt());k.TempleRegistry=Vs.default;var Ks=K(Ft());k.TempleElement=Ks.default;var ss=Be(et());k.emitter=ss.default;Object.defineProperty(k,"TempleEmitter",{enumerable:!0,get:function(){return ss.TempleEmitter}});var Qs=K(oe());k.component=Qs.default;var rs=Be(le());k.data=rs.default;Object.defineProperty(k,"TempleDataMap",{enumerable:!0,get:function(){return rs.TempleDataMap}});var er=K(Xt());k.env=er.default;var tr=K(Ct());k.props=tr.default;var ns=Be(Kt());k.classnames=ns.default;Object.defineProperty(k,"classlist",{enumerable:!0,get:function(){return ns.classlist}});var Pt=Be(Qt());k.children=Pt.default;Object.defineProperty(k,"innerHTML",{enumerable:!0,get:function(){return Pt.innerHTML}});Object.defineProperty(k,"innerText",{enumerable:!0,get:function(){return Pt.innerText}});var is=Be(ts());k.signal=is.default;Object.defineProperty(k,"SignalRegistry",{enumerable:!0,get:function(){return is.SignalRegistry}})});var C=N((vr,as)=>{as.exports={...jt()}});var j=N((Tr,ls)=>{ls.exports={...jt()}});var Mt=N((Dr,mt)=>{var sr=typeof window<"u"?window:typeof WorkerGlobalScope<"u"&&self instanceof WorkerGlobalScope?self:{};var f=function(t){var e=/(?:^|\s)lang(?:uage)?-([\w-]+)(?=\s|$)/i,s=0,n={},r={manual:t.Prism&&t.Prism.manual,disableWorkerMessageHandler:t.Prism&&t.Prism.disableWorkerMessageHandler,util:{encode:function i(a){return a instanceof u?new u(a.type,i(a.content),a.alias):Array.isArray(a)?a.map(i):a.replace(/&/g,"&").replace(/"u")return null;if("currentScript"in document)return document.currentScript;try{throw new Error}catch(c){var i=(/at [^(\r\n]*\((.*):[^:]+:[^:]+\)$/i.exec(c.stack)||[])[1];if(i){var a=document.getElementsByTagName("script");for(var p in a)if(a[p].src==i)return a[p]}return null}},isActive:function(i,a,p){for(var c="no-"+a;i;){var o=i.classList;if(o.contains(a))return!0;if(o.contains(c))return!1;i=i.parentElement}return!!p}},languages:{plain:n,plaintext:n,text:n,txt:n,extend:function(i,a){var p=r.util.clone(r.languages[i]);for(var c in a)p[c]=a[c];return p},insertBefore:function(i,a,p,c){c=c||r.languages;var o=c[i],g={};for(var w in o)if(o.hasOwnProperty(w)){if(w==a)for(var y in p)p.hasOwnProperty(y)&&(g[y]=p[y]);p.hasOwnProperty(w)||(g[w]=o[w])}var S=c[i];return c[i]=g,r.languages.DFS(r.languages,function(M,z){z===S&&M!=i&&(this[M]=g)}),g},DFS:function i(a,p,c,o){o=o||{};var g=r.util.objId;for(var w in a)if(a.hasOwnProperty(w)){p.call(a,w,a[w],c||w);var y=a[w],S=r.util.type(y);S==="Object"&&!o[g(y)]?(o[g(y)]=!0,i(y,p,null,o)):S==="Array"&&!o[g(y)]&&(o[g(y)]=!0,i(y,p,w,o))}}},plugins:{},highlightAll:function(i,a){r.highlightAllUnder(document,i,a)},highlightAllUnder:function(i,a,p){var c={callback:p,container:i,selector:'code[class*="language-"], [class*="language-"] code, code[class*="lang-"], [class*="lang-"] code'};r.hooks.run("before-highlightall",c),c.elements=Array.prototype.slice.apply(c.container.querySelectorAll(c.selector)),r.hooks.run("before-all-elements-highlight",c);for(var o=0,g;g=c.elements[o++];)r.highlightElement(g,a===!0,c.callback)},highlightElement:function(i,a,p){var c=r.util.getLanguage(i),o=r.languages[c];r.util.setLanguage(i,c);var g=i.parentElement;g&&g.nodeName.toLowerCase()==="pre"&&r.util.setLanguage(g,c);var w=i.textContent,y={element:i,language:c,grammar:o,code:w};function S(z){y.highlightedCode=z,r.hooks.run("before-insert",y),y.element.innerHTML=y.highlightedCode,r.hooks.run("after-highlight",y),r.hooks.run("complete",y),p&&p.call(y.element)}if(r.hooks.run("before-sanity-check",y),g=y.element.parentElement,g&&g.nodeName.toLowerCase()==="pre"&&!g.hasAttribute("tabindex")&&g.setAttribute("tabindex","0"),!y.code){r.hooks.run("complete",y),p&&p.call(y.element);return}if(r.hooks.run("before-highlight",y),!y.grammar){S(r.util.encode(y.code));return}if(a&&t.Worker){var M=new Worker(r.filename);M.onmessage=function(z){S(z.data)},M.postMessage(JSON.stringify({language:y.language,code:y.code,immediateClose:!0}))}else S(r.highlight(y.code,y.grammar,y.language))},highlight:function(i,a,p){var c={code:i,grammar:a,language:p};if(r.hooks.run("before-tokenize",c),!c.grammar)throw new Error('The language "'+c.language+'" has no grammar.');return c.tokens=r.tokenize(c.code,c.grammar),r.hooks.run("after-tokenize",c),u.stringify(r.util.encode(c.tokens),c.language)},tokenize:function(i,a){var p=a.rest;if(p){for(var c in p)a[c]=p[c];delete a.rest}var o=new T;return v(o,o.head,i),d(i,o,a,o.head,0),A(o)},hooks:{all:{},add:function(i,a){var p=r.hooks.all;p[i]=p[i]||[],p[i].push(a)},run:function(i,a){var p=r.hooks.all[i];if(!(!p||!p.length))for(var c=0,o;o=p[c++];)o(a)}},Token:u};t.Prism=r;function u(i,a,p,c){this.type=i,this.content=a,this.alias=p,this.length=(c||"").length|0}u.stringify=function i(a,p){if(typeof a=="string")return a;if(Array.isArray(a)){var c="";return a.forEach(function(S){c+=i(S,p)}),c}var o={type:a.type,content:i(a.content,p),tag:"span",classes:["token",a.type],attributes:{},language:p},g=a.alias;g&&(Array.isArray(g)?Array.prototype.push.apply(o.classes,g):o.classes.push(g)),r.hooks.run("wrap",o);var w="";for(var y in o.attributes)w+=" "+y+'="'+(o.attributes[y]||"").replace(/"/g,""")+'"';return"<"+o.tag+' class="'+o.classes.join(" ")+'"'+w+">"+o.content+""};function b(i,a,p,c){i.lastIndex=a;var o=i.exec(p);if(o&&c&&o[1]){var g=o[1].length;o.index+=g,o[0]=o[0].slice(g)}return o}function d(i,a,p,c,o,g){for(var w in p)if(!(!p.hasOwnProperty(w)||!p[w])){var y=p[w];y=Array.isArray(y)?y:[y];for(var S=0;S=g.reach);q+=h.value.length,h=h.next){var J=h.value;if(a.length>i.length)return;if(!(J instanceof u)){var G=1,$;if(kt){if($=b(ae,q,i,ie),!$||$.index>=i.length)break;var Ze=$.index,ds=$.index+$[0].length,W=q;for(W+=h.value.length;Ze>=W;)h=h.next,W+=h.value.length;if(W-=h.value.length,q=W,h.value instanceof u)continue;for(var Ce=h;Ce!==a.tail&&(Wg.reach&&(g.reach=_t);var Ye=h.prev;Tt&&(Ye=v(a,Ye,Tt),q+=Tt.length),m(a,Ye,G);var us=new u(w,z?r.tokenize(Xe,z):Xe,Bt,Xe);if(h=v(a,Ye,us),Ht&&v(a,h,Ht),G>1){var wt={cause:w+","+S,reach:_t};d(i,a,p,h.prev,q,wt),g&&wt.reach>g.reach&&(g.reach=wt.reach)}}}}}}function T(){var i={value:null,prev:null,next:null},a={value:null,prev:i,next:null};i.next=a,this.head=i,this.tail=a,this.length=0}function v(i,a,p){var c=a.next,o={value:p,prev:a,next:c};return a.next=o,c.prev=o,i.length++,o}function m(i,a,p){for(var c=a.next,o=0;o/,greedy:!0},prolog:{pattern:/<\?[\s\S]+?\?>/,greedy:!0},doctype:{pattern:/"'[\]]|"[^"]*"|'[^']*')+(?:\[(?:[^<"'\]]|"[^"]*"|'[^']*'|<(?!!--)|)*\]\s*)?>/i,greedy:!0,inside:{"internal-subset":{pattern:/(^[^\[]*\[)[\s\S]+(?=\]>$)/,lookbehind:!0,greedy:!0,inside:null},string:{pattern:/"[^"]*"|'[^']*'/,greedy:!0},punctuation:/^$|[[\]]/,"doctype-tag":/^DOCTYPE/i,name:/[^\s<>'"]+/}},cdata:{pattern://i,greedy:!0},tag:{pattern:/<\/?(?!\d)[^\s>\/=$<%]+(?:\s(?:\s*[^\s>\/=]+(?:\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))|(?=[\s/>])))+)?\s*\/?>/,greedy:!0,inside:{tag:{pattern:/^<\/?[^\s>\/]+/,inside:{punctuation:/^<\/?/,namespace:/^[^\s>\/:]+:/}},"special-attr":[],"attr-value":{pattern:/=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+)/,inside:{punctuation:[{pattern:/^=/,alias:"attr-equals"},{pattern:/^(\s*)["']|["']$/,lookbehind:!0}]}},punctuation:/\/?>/,"attr-name":{pattern:/[^\s>\/]+/,inside:{namespace:/^[^\s>\/:]+:/}}}},entity:[{pattern:/&[\da-z]{1,8};/i,alias:"named-entity"},/&#x?[\da-f]{1,8};/i]};f.languages.markup.tag.inside["attr-value"].inside.entity=f.languages.markup.entity;f.languages.markup.doctype.inside["internal-subset"].inside=f.languages.markup;f.hooks.add("wrap",function(t){t.type==="entity"&&(t.attributes.title=t.content.replace(/&/,"&"))});Object.defineProperty(f.languages.markup.tag,"addInlined",{value:function(e,s){var n={};n["language-"+s]={pattern:/(^$)/i,lookbehind:!0,inside:f.languages[s]},n.cdata=/^$/i;var r={"included-cdata":{pattern://i,inside:n}};r["language-"+s]={pattern:/[\s\S]+/,inside:f.languages[s]};var u={};u[e]={pattern:RegExp(/(<__[^>]*>)(?:))*\]\]>|(?!)/.source.replace(/__/g,function(){return e}),"i"),lookbehind:!0,greedy:!0,inside:r},f.languages.insertBefore("markup","cdata",u)}});Object.defineProperty(f.languages.markup.tag,"addAttribute",{value:function(t,e){f.languages.markup.tag.inside["special-attr"].push({pattern:RegExp(/(^|["'\s])/.source+"(?:"+t+")"+/\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))/.source,"i"),lookbehind:!0,inside:{"attr-name":/^[^\s=]+/,"attr-value":{pattern:/=[\s\S]+/,inside:{value:{pattern:/(^=\s*(["']|(?!["'])))\S[\s\S]*(?=\2$)/,lookbehind:!0,alias:[e,"language-"+e],inside:f.languages[e]},punctuation:[{pattern:/^=/,alias:"attr-equals"},/"|'/]}}}})}});f.languages.html=f.languages.markup;f.languages.mathml=f.languages.markup;f.languages.svg=f.languages.markup;f.languages.xml=f.languages.extend("markup",{});f.languages.ssml=f.languages.xml;f.languages.atom=f.languages.xml;f.languages.rss=f.languages.xml;(function(t){var e=/(?:"(?:\\(?:\r\n|[\s\S])|[^"\\\r\n])*"|'(?:\\(?:\r\n|[\s\S])|[^'\\\r\n])*')/;t.languages.css={comment:/\/\*[\s\S]*?\*\//,atrule:{pattern:RegExp("@[\\w-](?:"+/[^;{\s"']|\s+(?!\s)/.source+"|"+e.source+")*?"+/(?:;|(?=\s*\{))/.source),inside:{rule:/^@[\w-]+/,"selector-function-argument":{pattern:/(\bselector\s*\(\s*(?![\s)]))(?:[^()\s]|\s+(?![\s)])|\((?:[^()]|\([^()]*\))*\))+(?=\s*\))/,lookbehind:!0,alias:"selector"},keyword:{pattern:/(^|[^\w-])(?:and|not|only|or)(?![\w-])/,lookbehind:!0}}},url:{pattern:RegExp("\\burl\\((?:"+e.source+"|"+/(?:[^\\\r\n()"']|\\[\s\S])*/.source+")\\)","i"),greedy:!0,inside:{function:/^url/i,punctuation:/^\(|\)$/,string:{pattern:RegExp("^"+e.source+"$"),alias:"url"}}},selector:{pattern:RegExp(`(^|[{}\\s])[^{}\\s](?:[^{};"'\\s]|\\s+(?![\\s{])|`+e.source+")*(?=\\s*\\{)"),lookbehind:!0},string:{pattern:e,greedy:!0},property:{pattern:/(^|[^-\w\xA0-\uFFFF])(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*(?=\s*:)/i,lookbehind:!0},important:/!important\b/i,function:{pattern:/(^|[^-a-z0-9])[-a-z0-9]+(?=\()/i,lookbehind:!0},punctuation:/[(){};:,]/},t.languages.css.atrule.inside.rest=t.languages.css;var s=t.languages.markup;s&&(s.tag.addInlined("style","css"),s.tag.addAttribute("style","css"))})(f);f.languages.clike={comment:[{pattern:/(^|[^\\])\/\*[\s\S]*?(?:\*\/|$)/,lookbehind:!0,greedy:!0},{pattern:/(^|[^\\:])\/\/.*/,lookbehind:!0,greedy:!0}],string:{pattern:/(["'])(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/,greedy:!0},"class-name":{pattern:/(\b(?:class|extends|implements|instanceof|interface|new|trait)\s+|\bcatch\s+\()[\w.\\]+/i,lookbehind:!0,inside:{punctuation:/[.\\]/}},keyword:/\b(?:break|catch|continue|do|else|finally|for|function|if|in|instanceof|new|null|return|throw|try|while)\b/,boolean:/\b(?:false|true)\b/,function:/\b\w+(?=\()/,number:/\b0x[\da-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:e[+-]?\d+)?/i,operator:/[<>]=?|[!=]=?=?|--?|\+\+?|&&?|\|\|?|[?*/~^%]/,punctuation:/[{}[\];(),.:]/};f.languages.javascript=f.languages.extend("clike",{"class-name":[f.languages.clike["class-name"],{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$A-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\.(?:constructor|prototype))/,lookbehind:!0}],keyword:[{pattern:/((?:^|\})\s*)catch\b/,lookbehind:!0},{pattern:/(^|[^.]|\.\.\.\s*)\b(?:as|assert(?=\s*\{)|async(?=\s*(?:function\b|\(|[$\w\xA0-\uFFFF]|$))|await|break|case|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally(?=\s*(?:\{|$))|for|from(?=\s*(?:['"]|$))|function|(?:get|set)(?=\s*(?:[#\[$\w\xA0-\uFFFF]|$))|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)\b/,lookbehind:!0}],function:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*(?:\.\s*(?:apply|bind|call)\s*)?\()/,number:{pattern:RegExp(/(^|[^\w$])/.source+"(?:"+(/NaN|Infinity/.source+"|"+/0[bB][01]+(?:_[01]+)*n?/.source+"|"+/0[oO][0-7]+(?:_[0-7]+)*n?/.source+"|"+/0[xX][\dA-Fa-f]+(?:_[\dA-Fa-f]+)*n?/.source+"|"+/\d+(?:_\d+)*n/.source+"|"+/(?:\d+(?:_\d+)*(?:\.(?:\d+(?:_\d+)*)?)?|\.\d+(?:_\d+)*)(?:[Ee][+-]?\d+(?:_\d+)*)?/.source)+")"+/(?![\w$])/.source),lookbehind:!0},operator:/--|\+\+|\*\*=?|=>|&&=?|\|\|=?|[!=]==|<<=?|>>>?=?|[-+*/%&|^!=<>]=?|\.{3}|\?\?=?|\?\.?|[~:]/});f.languages.javascript["class-name"][0].pattern=/(\b(?:class|extends|implements|instanceof|interface|new)\s+)[\w.\\]+/;f.languages.insertBefore("javascript","keyword",{regex:{pattern:RegExp(/((?:^|[^$\w\xA0-\uFFFF."'\])\s]|\b(?:return|yield))\s*)/.source+/\//.source+"(?:"+/(?:\[(?:[^\]\\\r\n]|\\.)*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}/.source+"|"+/(?:\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.)*\])*\])*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}v[dgimyus]{0,7}/.source+")"+/(?=(?:\s|\/\*(?:[^*]|\*(?!\/))*\*\/)*(?:$|[\r\n,.;:})\]]|\/\/))/.source),lookbehind:!0,greedy:!0,inside:{"regex-source":{pattern:/^(\/)[\s\S]+(?=\/[a-z]*$)/,lookbehind:!0,alias:"language-regex",inside:f.languages.regex},"regex-delimiter":/^\/|\/$/,"regex-flags":/^[a-z]+$/}},"function-variable":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*[=:]\s*(?:async\s*)?(?:\bfunction\b|(?:\((?:[^()]|\([^()]*\))*\)|(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)\s*=>))/,alias:"function"},parameter:[{pattern:/(function(?:\s+(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)?\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\))/,lookbehind:!0,inside:f.languages.javascript},{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$a-z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*=>)/i,lookbehind:!0,inside:f.languages.javascript},{pattern:/(\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*=>)/,lookbehind:!0,inside:f.languages.javascript},{pattern:/((?:\b|\s|^)(?!(?:as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)(?![$\w\xA0-\uFFFF]))(?:(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*)\(\s*|\]\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*\{)/,lookbehind:!0,inside:f.languages.javascript}],constant:/\b[A-Z](?:[A-Z_]|\dx?)*\b/});f.languages.insertBefore("javascript","string",{hashbang:{pattern:/^#!.*/,greedy:!0,alias:"comment"},"template-string":{pattern:/`(?:\\[\s\S]|\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}|(?!\$\{)[^\\`])*`/,greedy:!0,inside:{"template-punctuation":{pattern:/^`|`$/,alias:"string"},interpolation:{pattern:/((?:^|[^\\])(?:\\{2})*)\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}/,lookbehind:!0,inside:{"interpolation-punctuation":{pattern:/^\$\{|\}$/,alias:"punctuation"},rest:f.languages.javascript}},string:/[\s\S]+/}},"string-property":{pattern:/((?:^|[,{])[ \t]*)(["'])(?:\\(?:\r\n|[\s\S])|(?!\2)[^\\\r\n])*\2(?=\s*:)/m,lookbehind:!0,greedy:!0,alias:"property"}});f.languages.insertBefore("javascript","operator",{"literal-property":{pattern:/((?:^|[,{])[ \t]*)(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*:)/m,lookbehind:!0,alias:"property"}});f.languages.markup&&(f.languages.markup.tag.addInlined("script","javascript"),f.languages.markup.tag.addAttribute(/on(?:abort|blur|change|click|composition(?:end|start|update)|dblclick|error|focus(?:in|out)?|key(?:down|up)|load|mouse(?:down|enter|leave|move|out|over|up)|reset|resize|scroll|select|slotchange|submit|unload|wheel)/.source,"javascript"));f.languages.js=f.languages.javascript;(function(){if(typeof f>"u"||typeof document>"u")return;Element.prototype.matches||(Element.prototype.matches=Element.prototype.msMatchesSelector||Element.prototype.webkitMatchesSelector);var t="Loading\u2026",e=function(L,x){return"\u2716 Error "+L+" while fetching file: "+x},s="\u2716 Error: File does not exist or is empty",n={js:"javascript",py:"python",rb:"ruby",ps1:"powershell",psm1:"powershell",sh:"bash",bat:"batch",h:"c",tex:"latex"},r="data-src-status",u="loading",b="loaded",d="failed",T="pre[data-src]:not(["+r+'="'+b+'"]):not(['+r+'="'+u+'"])';function v(L,x,E){var i=new XMLHttpRequest;i.open("GET",L,!0),i.onreadystatechange=function(){i.readyState==4&&(i.status<400&&i.responseText?x(i.responseText):i.status>=400?E(e(i.status,i.statusText)):E(s))},i.send(null)}function m(L){var x=/^\s*(\d+)\s*(?:(,)\s*(?:(\d+)\s*)?)?$/.exec(L||"");if(x){var E=Number(x[1]),i=x[2],a=x[3];return i?a?[E,Number(a)]:[E,void 0]:[E,E]}}f.hooks.add("before-highlightall",function(L){L.selector+=", "+T}),f.hooks.add("before-sanity-check",function(L){var x=L.element;if(x.matches(T)){L.code="",x.setAttribute(r,u);var E=x.appendChild(document.createElement("CODE"));E.textContent=t;var i=x.getAttribute("data-src"),a=L.language;if(a==="none"){var p=(/\.(\w+)$/.exec(i)||[,"none"])[1];a=n[p]||p}f.util.setLanguage(E,a),f.util.setLanguage(x,a);var c=f.plugins.autoloader;c&&c.loadLanguages(a),v(i,function(o){x.setAttribute(r,b);var g=m(x.getAttribute("data-range"));if(g){var w=o.split(/\r\n?|\n/g),y=g[0],S=g[1]==null?w.length:g[1];y<0&&(y+=w.length),y=Math.max(0,Math.min(y-1,w.length)),S<0&&(S+=w.length),S=Math.max(0,Math.min(S,w.length)),o=w.slice(y,S).join(`
+`),x.hasAttribute("data-start")||x.setAttribute("data-start",String(y+1))}E.textContent=o,f.highlightElement(E)},function(o){x.setAttribute(r,d),E.textContent=o})}}),f.plugins.fileHighlight={highlight:function(x){for(var E=(x||document).querySelectorAll(T),i=0,a;a=E[i++];)f.highlightElement(a)}};var A=!1;f.fileHighlight=function(){A||(console.warn("Prism.fileHighlight is deprecated. Use `Prism.plugins.fileHighlight.highlight` instead."),A=!0),f.plugins.fileHighlight.highlight.apply(this,arguments)}})()});var ar={};bs(ar,{BUILD_ID:()=>ir,TempleComponent:()=>P.TempleComponent,TempleElement:()=>P.TempleElement,TempleEmitter:()=>P.TempleEmitter,TempleException:()=>P.TempleException,TempleRegistry:()=>P.TempleRegistry,children:()=>P.children,components:()=>nr,data:()=>P.data,emitter:()=>P.emitter,props:()=>P.props,signal:()=>P.signal});var B=_(C());var os=_(C()),H=_(j()),de=class extends os.TempleComponent{static component=["layout","Layout_9f3ab204ce271feaf6f7"];styles(){return""}template(){(0,H.classlist)().add("relative","w-full","vh","scroll-hidden");let e=(0,H.children)(),s=e.find(m=>m.nodeName.endsWith("PANEL-MAIN")),n=e.find(m=>m.nodeName.endsWith("PANEL-HEAD")),r=e.find(m=>m.nodeName.endsWith("PANEL-FOOT")),u=e.find(m=>m.nodeName.endsWith("PANEL-LEFT")),b=e.find(m=>m.nodeName.endsWith("PANEL-RIGHT")),d={head:!!n,foot:!!r,left:!!u,right:!!b},T=new Set,v={left:!1,right:!1,change:m=>T.add(m)};return s&&H.TempleRegistry.get(s).setAttribute("show",v).setAttribute("layout",d),n&&H.TempleRegistry.get(n).setAttribute("show",v).setAttribute("layout",d),r&&H.TempleRegistry.get(r).setAttribute("show",v).setAttribute("layout",d),u&&H.TempleRegistry.get(u).setAttribute("show",v).setAttribute("layout",d),b&&H.TempleRegistry.get(b).setAttribute("show",v).setAttribute("layout",d),this.toggle=m=>{v[m]=!v[m],T.forEach(A=>A())},()=>[H.TempleRegistry.createText(`
+`,!1),...this._toNodeList(e)]}};var He=_(C()),at=_(j()),ue=class extends He.TempleComponent{static component=["head","Head_2bf4dff19bc88ba4138b"];styles(){return""}template(){let{layout:e,show:s}=this.element.attributes,n=(0,at.classlist)(),r=u=>{this.classList.add("absolute","top-0","right-0","h-60","transition-500"),e?.left?(this.classList.remove("left-0"),this.classList.add("left-226")):this.classList.add("left-0"),s.left?(this.classList.remove("md-left-0"),this.classList.add("md-left-226")):(this.classList.remove("md-left-226"),this.classList.add("md-left-0"))};return s.change(r),r(),()=>[He.TempleRegistry.createText(`
+`,!1),He.TempleRegistry.createElement("header",{class:"block w-full h-full relative"},[...this._toNodeList((0,at.children)())]).element]}};var qe=_(C()),lt=_(j()),me=class extends qe.TempleComponent{static component=["left","Left_f4ab589e043eee17d229"];styles(){return""}template(){let{layout:e,show:s}=this.element.attributes,n=(0,lt.classlist)(),r=u=>{this.classList.add("w-226","absolute","bottom-0","left-0","top-0","transition-500"),s.left?(this.classList.remove("md-left--226"),this.classList.add("md-left-0")):this.classList.add("md-left--226")};return s.change(r),r(),()=>[qe.TempleRegistry.createText(`
+`,!1),qe.TempleRegistry.createElement("aside",{class:"block w-full h-full relative"},[...this._toNodeList((0,lt.children)())]).element]}};var ze=_(C()),ot=_(j()),fe=class extends ze.TempleComponent{static component=["right","Right_4ce97029791442c57f8d"];styles(){return""}template(){let{layout:e,show:s}=this.element.attributes,n=(0,ot.classlist)(),r=u=>{this.classList.add("w-200","absolute","right-0","transition-500"),e?.foot?(this.classList.remove("bottom-0"),this.classList.add("bottom-60")):this.classList.add("bottom-0"),e?.head?(this.classList.remove("top-0"),this.classList.add("top-60")):this.classList.add("top-0"),s.right?(this.classList.remove("md-right--200"),this.classList.add("md-right-0")):this.classList.add("md-right--200")};return s.change(r),r(),()=>[ze.TempleRegistry.createText(`
+`,!1),ze.TempleRegistry.createElement("aside",{class:"block w-full h-full relative"},[...this._toNodeList((0,ot.children)())]).element]}};var Je=_(C()),pt=_(j()),he=class extends Je.TempleComponent{static component=["main","Main_847772763f4518728ede"];styles(){return""}template(){let{layout:e,show:s}=this.element.attributes,n=(0,pt.classlist)(),r=u=>{this.classList.add("absolute","transition-500"),e?.head?(this.classList.remove("top-0"),this.classList.add("top-60")):this.classList.add("top-0"),e?.foot?(this.classList.remove("bottom-0"),this.classList.add("bottom-60")):this.classList.add("bottom-0"),e?.left?(this.classList.remove("left-0"),this.classList.add("left-226")):this.classList.add("left-0"),e?.right?(this.classList.remove("right-0"),this.classList.add("right-200")):this.classList.add("right-0"),s.left?(this.classList.remove("md-left-0"),this.classList.add("md-left-226")):(this.classList.remove("md-left-226"),this.classList.add("md-left-0")),s.right?(this.classList.remove("md-right-0"),this.classList.add("md-right-200")):(this.classList.remove("md-right-200"),this.classList.add("md-right-0"))};return s.change(r),r(),()=>[Je.TempleRegistry.createText(`
+`,!1),Je.TempleRegistry.createElement("main",{class:"block w-full h-full relative"},[...this._toNodeList((0,pt.children)())]).element]}};var ct=_(C()),ye=_(j()),ge=class extends ct.TempleComponent{static component=["button","Button_d798a3059463b9c4868b"];styles(){return""}template(){let{block:e,full:s,color:n,xs:r,sm:u,md:b,lg:d,xl:T,xl2:v,xl3:m,xl4:A,xl5:L,curved:x,rounded:E,pill:i,info:a,warning:p,success:c,error:o,muted:g,primary:w,secondary:y,outline:S,transparent:M,solid:z,href:ie,style:kt,class:Bt,...vt}=(0,ye.props)(),ae=(0,ye.component)(),h=document.createElement(ie?"a":"button");Object.entries(vt).forEach(([G,$])=>h.setAttribute(G,$)),ie&&h.setAttribute("href",ie),(0,ye.children)().forEach(G=>h.appendChild(G)),h.classList.add("inline-block","tx-center","tx-nodecor","cursor-pointer"),e?(ae.classList.add("block"),h.classList.add("block")):(ae.classList.add("inline-block"),h.classList.add("inline-block")),s&&(ae.classList.add("w-full"),h.classList.add("w-full"));let q=r?h.classList.add("py-2","px-4"):u?h.classList.add("py-4","px-8"):b?h.classList.add("py-6","px-12"):d?h.classList.add("py-8","px-16"):T?h.classList.add("py-10","px-20"):v?h.classList.add("py-12","px-24"):m?h.classList.add("py-14","px-28"):A?h.classList.add("py-16","px-32"):L?h.classList.add("py-18","px-36"):h.classList.add("py-6","px-12");x?h.classList.add("curved"):E?h.classList.add("rounded"):i&&h.classList.add("pill");let J=S?"outline":M?"transparent":"solid";return J==="outline"||J==="transparent"?(h.classList.add("bd-solid","bd-thin"),J==="outline"&&h.classList.add("bg-white"),n?(h.style.color=n,h.style.borderColor=n):a?h.classList.add("bd-info","tx-info"):p?h.classList.add("bd-warning","tx-warning"):c?h.classList.add("bd-success","tx-success"):o?h.classList.add("bd-error","tx-error"):g?h.classList.add("bd-muted","tx-muted"):w?h.classList.add("bd-primary","tx-primary"):y&&h.classList.add("bd-secondary","tx-secondary")):(h.classList.add("tx-white"),n?h.style.backgroundColor=n:a?h.classList.add("bg-info"):p?h.classList.add("bg-warning"):c?h.classList.add("bg-success"):o?h.classList.add("bg-error"):g?h.classList.add("bg-muted"):w?h.classList.add("bg-primary"):y&&h.classList.add("bg-secondary")),()=>[ct.TempleRegistry.createText(`
+`,!1),...this._toNodeList([h])]}};var dt=_(C()),xe=_(j()),be=class extends dt.TempleComponent{static component=["alert","Alert_f0fe98801b4b833c4233"];styles(){return""}template(){let{curved:e,rounded:s,pill:n,info:r,warning:u,success:b,error:d,muted:T,primary:v,color:m,secondary:A,outline:L,transparent:x,solid:E,style:i,class:a,...p}=(0,xe.props)(),c=(0,xe.component)(),o=document.createElement("div");(0,xe.children)().forEach(w=>o.appendChild(w)),c.classList.add("block"),o.classList.add("block","p-16"),e?o.classList.add("curved"):s?o.classList.add("rounded"):n&&o.classList.add("pill");let g=L?"outline":x?"transparent":"solid";return g==="outline"||g==="transparent"?(o.classList.add("bd-solid","bd-thin"),g==="outline"&&o.classList.add("bg-white"),m?(o.style.color=m,o.style.borderColor=m):r?o.classList.add("bd-info","tx-info"):u?o.classList.add("bd-warning","tx-warning"):b?o.classList.add("bd-success","tx-success"):d?o.classList.add("bd-error","tx-error"):T?o.classList.add("bd-muted","tx-muted"):v?o.classList.add("bd-primary","tx-primary"):A&&o.classList.add("bd-secondary","tx-secondary")):(o.classList.add("tx-white"),m?o.style.backgroundColor=m:r?o.classList.add("bg-info"):u?o.classList.add("bg-warning"):b?o.classList.add("bg-success"):d?o.classList.add("bg-error"):T?o.classList.add("bg-muted"):v?o.classList.add("bg-primary"):A&&o.classList.add("bg-secondary")),()=>[dt.TempleRegistry.createText(`
+`,!1),...this._toNodeList([o])]}};var Q=_(C()),ve=_(j()),ke=class extends Q.TempleComponent{static component=["tab","Tab_5a341768ef0a010965e3"];styles(){return""}template(){let{group:e,selector:s="",active:n="",inactive:r="",style:u,class:b,...d}=(0,ve.props)(),T=(0,ve.component)(),v=n.split(" "),m=r.split(" ");T.classList.add("cursor-pointer");let A=()=>{let x=T.hasAttribute("on");T.classList.remove(...x?m:v),T.classList.add(...x?v:m),Array.from(document.querySelectorAll(s)).forEach(E=>{E.style.display=x?"block":"none"})},L=()=>{Array.from(document.querySelectorAll(`[group="${e}"]`)).forEach(x=>{let E=x.getAttribute("selector");s===E&&!x.hasAttribute("on")?(x.setAttribute("on",""),Array.from(document.querySelectorAll(s)).forEach(i=>{i.style.display="block"}),typeof x.render=="function"&&x.render()):s!==E&&x.hasAttribute("on")&&(x.removeAttribute("on"),Array.from(document.querySelectorAll(E)).forEach(i=>{i.style.display="none"}),typeof x.render=="function"&&x.render())})};return()=>[Q.TempleRegistry.createText(`
+`,!1),Q.TempleRegistry.createElement("a",{...d,class:"block h-full w-full",click:L,mount:A},[Q.TempleRegistry.createText(`
+  `,!1),...this._toNodeList((0,ve.children)()),Q.TempleRegistry.createText(`
+`,!1)]).element]}};var Ge=_(C()),ut=_(j()),Te=class extends Ge.TempleComponent{static component=["docs","Docs_40562a7bb56d70d971df"];styles(){return""}template(){return(0,ut.classlist)().add("block","w-full","h-full","scroll-y-auto","scroll-x-hidden"),()=>[Ge.TempleRegistry.createText(`
+`,!1),Ge.TempleRegistry.createElement("article",{class:"block p-10 tx-t-1"},[...this._toNodeList((0,ut.children)())]).element]}};var l=_(C());var R=_(C()),Nt=_(Mt()),ps=_(j()),ee=class extends R.TempleComponent{static component=["code","Code_6f36bc13bb6a166c7abc"];styles(){return`:host {
+    display: block;
+    font-size: 14px;
+    line-height: 20px;
+  }
+  :host([inline]) {
+    display: inline !important;
+  }
+  :host([inline]),
+  :host([inline]) > pre,
+  :host([inline]) > pre > code {
+    display: inline !important;
+  }
+  .snippet {
+    background-color: #000000;
+    color: #ABB2BF;
+    height: 100%;
+    margin: 0;
+    overflow: auto;
+    padding: 0;
+  }
+
+  .line-numbers {
+    position: relative;
+    padding-left: 3.8em;
+    counter-reset: linenumber;
+  }
+  :host([inline]) .line-numbers {
+    position: static;
+    padding-left: 0;
+  }
+
+  .line-numbers > code {
+    position: relative;
+    white-space: inherit;
+  }
+
+  .line-numbers .line-numbers-rows {
+    position: absolute;
+    pointer-events: none;
+    top: 0;
+    font-size: 100%;
+    left: -3.8em;
+    width: 3em; /* works for line-numbers below 1000 lines */
+    letter-spacing: -1px;
+    border-right: 1px solid #999;
+
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+
+  }
+
+  :host([inline]) .line-numbers .line-numbers-rows {
+    display: none;
+  }
+
+  .line-numbers-rows > span {
+    display: block;
+    counter-increment: linenumber;
+  }
+
+  .line-numbers-rows > span:before {
+    content: counter(linenumber);
+    color: #999;
+    display: block;
+    padding-right: 0.8em;
+    text-align: right;
+  }
+  .pad {
+    padding: 5px;
+  }
+
+  .terminal {
+    background-color: #000000;
+    font-family: 'Courier New', Courier, monospace;
+    font-size: 15px;
+    height: 100%;
+    overflow: auto;
+    padding: 10px;
+  }
+  .terminal span {
+    color: #00FF00;
+  }`}template(){let e=this.props,{lang:s="markup",numbers:n=!1,inline:r=!1,trim:u=!1,ltrim:b=!1,rtrim:d=!1,detab:T=0}=e,v=(0,ps.children)(),m=v[0]?.textContent||"";T&&(m=m.replace(new RegExp(`\\n {${T}}`,"g"),`
+`)),u?m=m.trim():b?m=m.replace(/^\s+/,""):d&&(m=m.replace(/\s+$/,""));let A=L=>{if(!m)return;let x=Nt.default.highlight(m,Nt.default.languages[s],s);if(L.detail.target.innerHTML=x,n){let E=x.match(/\n(?!$)/g),i=E?E.length+1:1,a=new Array(i+1).join(""),p=document.createElement("span");p.setAttribute("aria-hidden","true"),p.className="line-numbers-rows",p.innerHTML=a,L.detail.target.appendChild(p)}};return()=>[R.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism.min.css"}).element,R.TempleRegistry.createText(`
+`,!1),R.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism-tomorrow.min.css"}).element,R.TempleRegistry.createText(`
+`,!1),...s==="bash"?[R.TempleRegistry.createText(`
+  `,!1),R.TempleRegistry.createElement("div",{class:"terminal"},[R.TempleRegistry.createElement("span",{},[R.TempleRegistry.createText("$",!1)]).element,R.TempleRegistry.createText(" ",!1),...this._toNodeList(v)]).element,R.TempleRegistry.createText(`
+`,!1)]:m?[,R.TempleRegistry.createText(`
+  `,!1),...n?[R.TempleRegistry.createText(`
+    `,!1),R.TempleRegistry.createElement("pre",{class:"snippet line-numbers"},[R.TempleRegistry.createElement("code",{mount:A},[]).element]).element,R.TempleRegistry.createText(`
+  `,!1)]:[,R.TempleRegistry.createText(`
+    `,!1),R.TempleRegistry.createElement("pre",{class:"snippet pad"},[R.TempleRegistry.createElement("code",{mount:A},[]).element]).element,R.TempleRegistry.createText(`
+  `,!1)],R.TempleRegistry.createText(`
+`,!1)]:[,R.TempleRegistry.createText(`
+  `,!1),R.TempleRegistry.createElement("span",{},[R.TempleRegistry.createText("????",!1)]).element,R.TempleRegistry.createText(`
+`,!1)],R.TempleRegistry.createText(`
+
+`,!1)]}};var te=_(j());var We={Asset:{type:{kind:"property",list:!1,type:["text/html","text/javascript","text/css","text/plain"],description:"The MIME type of the build file asset"},content:{kind:"property",list:!1,type:"string",description:"The source code of the build file asset."}},Path:{path:{kind:"property",list:!1,type:"string",description:"The file path",example:"'/path/to/file'"},type:{kind:"property",list:!1,type:"string",description:"The type of path.",example:"'file'"}},Config:{brand:{kind:"property",list:!1,type:"string",description:"The brand prefixed before the component tag name.",example:"'temple'"},cwd:{kind:"property",list:!1,type:"string",description:"The project's current working directory (cwd).",example:"'/path/to/project'"},fs:{kind:"property",list:!1,type:"FileSystem",description:"The file system being used to read/write files.",example:`import fs from 'fs';
+
+fs`},emitter:{kind:"property",list:!1,type:"EventEmitter",description:"The NodeJS EventEmitter instance being used.",example:`import EventEmitter from 'events';
+
+new EventEmitter();`},"name?":{kind:"property",list:!1,type:"string",description:"Custom name of component."},"type?":{kind:"property",list:!1,type:["document","component","template"],description:"Type of component"},"minify?":{kind:"property",list:!1,type:"boolean",description:"Whether to minify the generated JavaScript code."},"tsconfig?":{kind:"property",list:!1,type:"string",description:"The location of the used tsconfig.json.",example:"'/path/to/tsconfig.json'"},"component_extname?":{kind:"property",list:!1,type:"string",description:"The component file extension.",example:"'.tml'"},"document_extname?":{kind:"property",list:!1,type:"string",description:"The document file extension.",example:"'.dtml'"}},Import:{typeOnly:{kind:"property",list:!1,type:"boolean",description:"Should import as type only.",example:"import type { Foo } from 'bar';"},"names?":{kind:"property",list:!0,type:"string",description:"All the names imported",example:"import { Foo, Bar } from 'foobar';"},default:{kind:"property",list:!1,type:"string",description:"The default import name",example:"import foo from 'bar';"},source:{kind:"property",list:!1,type:"string",description:"The file path where names are imported from.",example:"import * from 'foobar';"}},Build:{source:{kind:"property",list:!1,type:"string",description:"Returns the generated JavaScript source code.",example:"compiler.import('./docs/api.dtml').source; //server js code"},TempleDocument:{kind:"property",list:!1,type:"ServerDocumentClass",description:"Returns a server document class that can be instantiated.",example:"new (compiler.import('./docs/api.dtml').TempleDocument);"},document:{kind:"property",list:!1,type:"ServerDocument",description:"Returns the default instantiated document used to render the final HTML markup.",example:"compiler.import('./docs/api.dtml').document.render(); //..."}},CacheOptions:{buildPath:{kind:"property",list:!1,type:"string",description:"The absolute path the build directory",example:"'/path/to/build'"},"manifestFile?":{kind:"property",list:!1,type:"string",description:"The name of the manifest file.",example:"'manifest.json'"},"environment?":{kind:"property",list:!1,type:"string",description:"The environment mode that will determine the cache strategy.",example:"'production' | 'development'"}},Component:{ast:{kind:"property",list:!1,type:"AST",description:"Returns an abstract syntax tree (AST) interpretation of the component.",example:"component.ast.markup;"},brand:{kind:"property",list:!1,type:"string",description:"Returns the brand prefixed before the component tag name.",example:"component.brand; //--> 'temple'"},classname:{kind:"property",list:!1,type:"string",description:"Returns the suggested class name of the component.",example:"component.classname; //--> 'Button_abc123'"},components:{kind:"property",list:!0,type:"Component",description:"Returns a list of child components imported by this component.",example:"component.components[0].brand; //--> 'temple'"},contents:{kind:"property",list:!1,type:"string",description:"Returns the raw temple source code.",example:"component.contents;"},cwd:{kind:"property",list:!1,type:"string",description:"Returns the project's current working directory (cwd).",example:"component.cwd; //--> '/path/to/project'"},dependencies:{kind:"property",list:!0,type:"{ path: string, type: string }",description:"Returns all the files this component imports sorted by type.",example:"component.dependencies; //--> [{ type: 'file', path: './random/file' }, ...]"},dirname:{kind:"property",list:!1,type:"string",description:"Returns the directory name where this component file exists.",example:"component.dirname;"},fs:{kind:"property",list:!1,type:"FileSystem",description:"Returns the file system being used to read/write files.",example:"component.fs;"},id:{kind:"property",list:!1,type:"string",description:"Returns a unique component ID used for build files.",example:"component.id;"},imports:{kind:"property",list:!0,type:"Import",description:"Returns the files imported by this component. This does not include any component files.",example:"component.imports;"},markup:{kind:"property",list:!0,type:"Token",description:"Returns the markup abstract syntax tree.",example:"component.markup;"},loader:{kind:"property",list:!1,type:"FileLoader",description:"Returns the file loader used to resolve paths of imported files.",example:"component.loader.absolute('./path/to/some/file');"},parent:{kind:"property",list:!1,type:"Component|null",description:"Returns the parent component, if any.",example:"component.parent;"},registry:{kind:"property",list:!1,type:"Record",description:"Returns all child components and sub-child components.",example:"component.registry;"},relative:{kind:"property",list:!1,type:"string",description:"Returns the source file path relative to the current working directory (cwd).",example:"component.contents;"},source:{kind:"property",list:!1,type:"string",description:"Returns the source file path. This may or may not be the absolute path.",example:"component.source;"},scripts:{kind:"property",list:!0,type:"string",description:"Returns all the collective JavaScript in the temple source file.",example:"component.scripts;"},styles:{kind:"property",list:!0,type:"string",description:"Returns all the collective CSS styles in the temple source file.",example:"component.styles;"},tagname:{kind:"property",list:!1,type:"string",description:"Returns the suggested HTML tag name.",example:"component.tagname;"},type:{kind:"property",list:!1,type:["document","component","template"],description:"Returns type of component. Will transpile depending on the type.",example:"component.type;"}},EventEmitter:{render:{kind:"event",params:{builder:{kind:"property",list:!1,type:"DocumentBuilder"},build:{kind:"property",list:!1,type:"Build"},props:{kind:"property",list:!1,type:"Hash"}},data:{kind:"property",list:!1,type:"string"},description:"Triggers before the document is rendered.",example:`compiler.emitter.on('render', e => {
+  const { builder, build, props } = e.params;
+  //...
+  e.data = 'new html...';
+});`},rendered:{kind:"event",params:{builder:{kind:"property",list:!1,type:"DocumentBuilder"},build:{kind:"property",list:!1,type:"Build"},props:{kind:"property",list:!1,type:"Hash"},html:{kind:"property",list:!1,type:"string"}},data:{kind:"property",list:!1,type:"string"},description:"Triggers after the document is rendered.",example:`compiler.emitter.on('rendered', e => {
+  const { builder, build, props, html } = e.params;
+  //...
+  e.data = 'new html...';
+});`},build:{kind:"event",params:{builder:{kind:"property",list:!1,type:"DocumentBuilder"}},data:{kind:"property",list:!1,type:"string"},description:"Triggers before the document is built.",example:`compiler.emitter.on('build', e => {
+  const { builder } = e.params;
+  //...
+  e.data = 'new temple source...';
+});`},built:{kind:"event",params:{builder:{kind:"property",list:!1,type:"DocumentBuilder"},build:{kind:"property",list:!1,type:"Build"}},data:{kind:"property",list:!1,type:"Build"},description:"Triggers after the document is built.",example:`compiler.emitter.on('built', e => {
+  const { builder, build } = e.params;
+  //...
+  e.data = { ...build };
+});`},"build-client":{kind:"event",params:{builder:{kind:"property",list:!1,type:"DocumentBuilder"}},data:{kind:"property",list:!1,type:"string"},description:"Triggers before the client js is rendered.",example:`compiler.emitter.on('build-client', e => {
+  const { builder } = e.params;
+  //...
+  e.data = 'new temple source...';
+});`},"built-client":{kind:"event",params:{builder:{kind:"property",list:!1,type:"DocumentBuilder"},build:{kind:"property",list:!1,type:"Build"}},data:{kind:"property",list:!1,type:"string"},description:"Triggers after the client js is rendered.",example:`compiler.emitter.on('built-client', e => {
+  const { builder, build } = e.params;
+  //...
+  e.data = 'new client js...';
+});`},"build-markup":{kind:"event",params:{builder:{kind:"property",list:!1,type:"DocumentBuilder"}},data:{kind:"property",list:!1,type:"string"},description:"Triggers before markup is rendered.",example:`compiler.emitter.on('build-markup', e => {
+  const { builder } = e.params;
+  //...
+  e.data = 'new temple source...';
+});`},"built-markup":{kind:"event",params:{builder:{kind:"property",list:!1,type:"DocumentBuilder"},build:{kind:"property",list:!1,type:"Build"}},data:{kind:"property",list:!1,type:"string"},description:"Triggers after markup is rendered.",example:`compiler.emitter.on('built-markup', e => {
+  const { builder, build } = e.params;
+  //...
+  e.data = 'new markup...';
+});`},"build-server":{kind:"event",params:{builder:{kind:"property",list:!1,type:"DocumentBuilder"}},data:{kind:"property",list:!1,type:"string"},description:"Triggers before the server js is rendered.",example:`compiler.emitter.on('build-server', e => {
+  const { builder } = e.params;
+  //...
+  e.data = 'new temple source...';
+});`},"built-server":{kind:"event",params:{builder:{kind:"property",list:!1,type:"DocumentBuilder"},build:{kind:"property",list:!1,type:"Build"}},data:{kind:"property",list:!1,type:"string"},description:"Triggers after the server js is rendered.",example:`compiler.emitter.on('built-server', e => {
+  const { builder, build } = e.params;
+  //...
+  e.data = 'new server js...';
+});`},"build-styles":{kind:"event",params:{builder:{kind:"property",list:!1,type:"DocumentBuilder"}},data:{kind:"property",list:!1,type:"string"},description:"Triggers before the css styles are rendered.",example:`compiler.emitter.on('build-styles', e => {
+  const { builder } = e.params;
+  //...
+  e.data = 'new temple source...';
+});`},"built-styles":{kind:"event",params:{builder:{kind:"property",list:!1,type:"DocumentBuilder"},build:{kind:"property",list:!1,type:"Build"}},data:{kind:"property",list:!1,type:"string"},description:"Triggers after the css styles is rendered.",example:`compiler.emitter.on('built-styles', e => {
+  const { builder, build } = e.params;
+  //...
+  e.data = 'new css...';
+});`},"manifest-load":{kind:"event",params:{manifest:{kind:"property",list:!1,type:"DocumentManifest"},map:{kind:"property",list:!1,type:"Map"}},data:{kind:"property",list:!1,type:"Map"},description:"Triggers before the manifest is loaded.",example:`compiler.emitter.on('manifest-load', e => {
+  const { manifest, map } = e.params;
+  //...
+  e.data = new Map();
+});`},"manifest-resolve":{kind:"event",params:{manifest:{kind:"property",list:!1,type:"DocumentManifest"},id:{kind:"property",list:!1,type:"string"}},description:"Triggers before a build ID is resolved.",example:`compiler.emitter.on('manifest-resolve', e => {
+  const { manifest, id } = e.params;
+  //...
+});`},"manifest-resolved":{kind:"event",params:{manifest:{kind:"property",list:!1,type:"DocumentManifest"},id:{kind:"property",list:!1,type:"string"},path:{kind:"property",list:!1,type:"string"}},data:{kind:"property",list:!1,type:"Map"},description:"Triggers after a build ID/entry is set.",example:`compiler.emitter.on('manifest-resolved', e => {
+  const { manifest, id, path } = e.params;
+  //...
+});`},"manifest-unresolved":{kind:"event",params:{manifest:{kind:"property",list:!1,type:"DocumentManifest"},id:{kind:"property",list:!1,type:"string"},path:{kind:"property",list:!1,type:"string|undefined"}},data:{kind:"property",list:!1,type:"Map"},description:"Triggers after a build ID is deleted.",example:`compiler.emitter.on('manifest-unresolved', e => {
+  const { manifest, id, path } = e.params;
+  //...
+});`}},DocumentManifest:{emitter:{kind:"property",list:!1,type:"EventEmitter",description:"The NodeJS EventEmitter instance being used.",example:`compiler.manifest.emitter.on('render', e => {
+  console.log(e.params);
+});`},registry:{kind:"property",list:!1,type:"Map",description:"The manifest registry used to map build IDs to document entry files.",example:"compiler.manifest.registry.entries();"},builder:{kind:"function",async:!1,args:[{kind:"property",list:!1,name:"id",type:"string"}],returns:{kind:"property",list:!1,type:"DocumentBuilder"},description:"Returns a document builder given the build id.",example:"compiler.manifest.builder('abc123');"},delete:{kind:"function",async:!1,args:[{kind:"property",list:!1,name:"id",type:"string"}],returns:{kind:"property",list:!1,type:"DocumentManifest"},description:"Removes an entry file from the manifest given the build id.",example:"compiler.manifest.delete('abc123');"},entries:{kind:"function",async:!1,args:[],returns:{kind:"property",list:!0,type:"[ string, string ]"},description:"Returns an array of build IDs and entry file paths.",example:"compiler.manifest.entries();"},get:{kind:"function",async:!1,args:[{kind:"property",name:"id",type:"string"}],returns:{kind:"property",list:!1,type:"string"},description:"Returns the entry file path given the build id.",example:"compiler.manifest.get('abc123');"},has:{kind:"function",async:!1,args:[{kind:"property",name:"id",type:"string"}],returns:{kind:"property",list:!1,type:"boolean"},description:"Returns true if the build id exists in the manifest.",example:"compiler.manifest.has('abc123');"},load:{kind:"function",async:!1,args:[{kind:"property",name:"manifest",type:"Record"}],returns:{kind:"property",list:!1,type:"DocumentManifest"},description:"Loads an entire manifest object to the registry.",example:"compiler.manifest.load({ abc123: '/path/to/entry.dtml' });"},keys:{kind:"function",async:!1,args:[],returns:{kind:"property",list:!0,type:"string"},description:"Returns an array of build IDs.",example:"compiler.manifest.keys();"},set:{kind:"function",async:!1,args:[{kind:"property",name:"id",type:"string"},{kind:"property",name:"path",type:"string"}],returns:{kind:"property",list:!1,type:"DocumentManifest"},description:"Sets an entry file path to the manifest given the build id.",example:"compiler.manifest.set('abc123', '/path/to/entry.dtml');"},toJson:{kind:"function",async:!1,args:[],returns:{kind:"property",list:!1,type:"string"},description:"Returns the manifest as a JSON string.",example:"compiler.manifest.toJson();"},values:{kind:"function",async:!1,args:[],returns:{kind:"property",list:!0,type:"string"},description:"Returns an array of entry file paths.",example:"compiler.manifest.values();"}},DocumentTranspiler:{directive:{kind:"function",async:!1,args:[{kind:"property",name:"directive",type:"DirectiveInterface"}],returns:{kind:"property",list:!1,type:"DocumentTranspiler"},description:"Adds a directive that transpiles custom markup tags like if/elif/else, each, try/catch.",example:"compiler.fromSource('./docs/api.dtml').transpiler.directive(CustomDirective);"},transpile:{kind:"function",args:[],returns:{kind:"property",list:!1,type:"SourceFile"}},description:"Converts a temple file to server-side JavaScript.",example:"compiler.fromSource('./docs/api.dtml').transpiler.transpile();"},DocumentBuilder:{document:{kind:"property",list:!1,type:"Component",description:"Returns a document component with various meta information, used for transpilation.",example:"compiler.fromSource('./docs/api.dtml').document.classname; //--> 'Index_abc123'"},emitter:{kind:"property",list:!1,type:"EventEmitter",description:"The NodeJS EventEmitter instance being used.",example:`compiler.fromSource('./docs/api.dtml').emitter.on('render', e => {
+  console.log(e.params);
+});`},extnames:{kind:"property",list:!0,type:"string",description:"Returns the file extensions that are recognized to parse as Temple components.",example:"compiler.fromSource('./docs/api.dtml').extnames; //--> [ 'tml', 'dtml' ]"},transpiler:{kind:"property",list:!1,type:"DocumentTranspiler",description:"Returns a transpiler used to convert a temple file to server-side JavaScript.",example:"compiler.fromSource('./docs/api.dtml').transpiler.transpile();"},tsconfig:{kind:"property",list:!1,type:"string",description:"Returns the location of the used tsconfig.json.",example:"compiler.fromSource('./docs/api.dtml').tsconfig; //--> /path/to/tsconfig.json"},build:{kind:"function",async:!0,args:[],returns:{kind:"property",list:!1,type:"Build"},description:"Generates the server-side component and brings it into the runtime.",example:"compiler.fromSource('./docs/api.dtml').build();"},client:{kind:"function",async:!0,args:[],returns:{kind:"property",list:!1,type:"string"},description:"Generates the browser-side JavaScript.",example:"compiler.fromSource('./docs/api.dtml').client(); //client js code"},component:{kind:"function",async:!0,args:[],returns:{kind:"property",list:!1,type:"string"},description:"Generates the source file as an independent component.",example:"compiler.fromSource('./docs/my-button.tml').component(); //component js code"},markup:{kind:"function",async:!0,args:[],returns:{kind:"property",list:!1,type:"string"},description:"Generates the html markup.",example:"compiler.fromSource('./docs/api.dtml').markup(); //..."},server:{kind:"function",async:!0,args:[],returns:{kind:"property",list:!1,type:"string"},description:"Generates the server-side JavaScript.",example:"compiler.fromSource('./docs/api.dtml').markup(); //server js code"},styles:{kind:"function",async:!0,args:[],returns:{kind:"property",list:!1,type:"string"},description:"Generates the css styles.",example:"compiler.fromSource('./docs/api.dtml').styles(); //css code"}},ServerDocumentClass:{component:{kind:"property",list:!1,type:"[ string, string ]",description:"Returns the component tag name and class name.",example:"compiler.import('./docs/api.dtml').TempleDocument.component; //--> [ 'tui-button', 'TuiButton_abc123' ]"},new:{kind:"function",args:[],returns:{kind:"property",list:!1,type:"ServerDocument"},description:"Instantiates the server document class on the server-side used to render the final HTML.",example:"new (compiler.import('./docs/api.dtml').TempleDocument);"}},ServerDocument:{id:{kind:"function",args:[],returns:{kind:"property",list:!1,type:"string"},description:"Returns a unique document ID used to map the build cache.",example:"compiler.import('./docs/api.dtml').document.id(); //--> 'abc123'"},styles:{kind:"function",args:[],returns:{kind:"property",list:!1,type:"string"},description:"Returns the css styles for this document.",example:"compiler.import('./docs/api.dtml').document.styles(); //css styles"},template:{template:"function",args:[],returns:{kind:"property",list:!0,type:"Element"},description:"Returns an array of Element children and sub-children.",example:"compiler.import('./docs/api.dtml').document.template();"},render:{kind:"function",args:[{kind:"property",name:"props",type:"Record"}],returns:{kind:"property",list:!1,type:"string"},description:"Returns the final document HTML markup.",example:"compiler.import('./docs/api.dtml').document.render();"}},TempleOptions:{"brand?":{kind:"property",list:!1,type:"string",description:"The brand prefixed before the component tag name.",example:"const compiler = temple({ brand: 'temple' });"},"cwd?":{kind:"property",list:!1,type:"string",description:"The project's current working directory (cwd).",example:"const compiler = temple({ cwd: '/path/to/project' });'"},"fs?":{kind:"property",list:!1,type:"FileSystem",description:"The file system being used to read/write files.",example:`import fs from 'fs';
+
+const compiler = temple({ fs });'`},"emitter?":{kind:"property",list:!1,type:"EventEmitter",description:"The NodeJS EventEmitter instance being used.",example:`import emitter from 'events';
+
+const compiler = temple({ emitter });'`},"minify?":{kind:"property",list:!1,type:"boolean",description:"Whether to minify the generated JavaScript code.",example:"const compiler = temple({ minify: true });'"},"tsconfig?":{kind:"property",list:!1,type:"string",description:"The location of the used tsconfig.json.",example:"const compiler = temple({ tsconfig: '/path/to/tsconfig.json' });'"},"component_extname?":{kind:"property",list:!1,type:"string",description:"The component file extension.",example:"const compiler = temple({ component_extname: '.tml' });'"},"document_extname?":{kind:"property",list:!1,type:"string",description:"The document file extension.",example:"const compiler = temple({ document_extname: '.dtml' });'"}},TempleCompiler:{config:{kind:"property",list:!1,type:"Config",description:"The Temple configuration",example:"compiler.config.brand; //--> 'temple'"},fs:{kind:"property",list:!1,type:"FileSystem",description:"The file system being used.",example:"compiler.fs.readFileSync('some/file', 'utf8');"},emitter:{kind:"property",list:!1,type:"EventEmitter",description:"The NodeJS EventEmitter instance being used.",example:`compiler.emitter.on('render', e => {
+  console.log(e.params);
+});`},manifest:{kind:"property",list:!1,type:"DocumentManifest",description:"The manifest registry used to map build IDs to document entry files.",example:"compiler.manifest.entries();"},component:{kind:"function",args:[],returns:{kind:"property",list:!1,type:"Component"}},fromId:{kind:"function",args:[{kind:"property",list:!1,name:"id",type:"string"}],returns:{kind:"property",list:!1,type:"DocumentBuilder"},description:"Returns a new DocumentBuilder instance given a build ID.",example:"compiler.fromId('abc123').build();"},fromCache:{kind:"function",args:[{kind:"property",list:!1,name:"cacheFile",type:"string"}],returns:{kind:"property",list:!1,type:"Build"},description:"Returns build information from a compiled template.",example:"compiler.fromCache('/path/to/build/abc123.js').document.render();"},fromSource:{kind:"function",args:[{kind:"property",list:!1,name:"sourceFile",type:"string"}],returns:{kind:"property",list:!1,type:"DocumentBuilder"},description:"Returns a new DocumentBuilder instance given a template source file.",example:"compiler.fromSource('./docs/api.dtml').build();"},use:{kind:"function",args:[{kind:"property",list:!1,name:"options",type:"Function"}],returns:{kind:"property",list:!1,type:"TempleCompiler"},description:"Enables a default build cache strategy.",example:"compiler.use(plugin)"},asset:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"assetFile",type:"string"}],returns:{kind:"property",list:!1,type:"Asset"},description:"Returns a compiled build asset, given an asset file name.",example:"compiler.asset('abc123.css'); //--> { type: 'text/css', content: '...' }"},client:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"sourceFile",type:"string"}],returns:{kind:"property",list:!1,type:"string"},description:"Returns a compiled client script, given the the template source file.",example:"compiler.client('./docs/api.dtml'); //client script"},import:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"sourceFile",type:"string"}],returns:{kind:"property",list:!1,type:"Build"},description:"Returns build information, given the the template source file.",example:"compiler.import('/path/to/build/abc123.js').document.render();"},markup:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"sourceFile",type:"string"}],returns:{kind:"property",list:!1,type:"string"},description:"Returns a compiled markup, given the the template source file.",example:"compiler.markup('./docs/api.dtml'); //--> ..."},render:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"sourceFile",type:"string"},{kind:"property",list:!1,name:"props",type:"Hash"}],returns:{kind:"property",list:!1,type:"string"},description:"Returns the final HTML markup, given the the template source file.",example:`compiler.render('./docs/api.dtml', {
+  title: 'API Documentation'
+});`},server:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"sourceFile",type:"string"}],returns:{kind:"property",list:!1,type:"string"},description:"Returns compiled server code, given the the template source file.",example:"compiler.server('./docs/api.dtml'); // server script"},styles:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"sourceFile",type:"string"}],returns:{kind:"property",list:!1,type:"string"},description:"Returns compiled css styles, given the the template source file.",example:"compiler.styles('./docs/api.dtml'); //css styles"}},TempleComponent:{attr:{kind:"property",list:!1,type:"Hash",description:"Returns only the valid HTML tag attributes (string and true).",example:"this.attr; //--> { disabled: true, type: 'button' }"},props:{kind:"property",list:!1,type:"Hash",description:"Returns all the attributes assigned to the component.",example:"this.props; //--> { disabled: true, count: 4, click: handleClick }"},metadata:{kind:"property",list:!1,type:"[ string, string ]",description:"Returns the tag and class name of the component.",example:"this.metadata; //--> [ 'fancy-button', 'FancyButton_abc123' ]"},styles:{kind:"function",args:[],returns:{kind:"property",list:!1,type:"string"},description:"Returns the css styles used in the component.",example:"this.styles(); //css styles"},template:{kind:"function",args:[],returns:{kind:"property",list:!1,type:"Node[]"},description:"Returns a function that returns an array of elements, text nodes and web components",example:"this.template(); //--> () => [ Element, Text, Element, ... ]"},render:{kind:"function",args:[],returns:{kind:"property",list:!1,type:"string"},description:"Renders the children and returns the final HTML markup.",example:"this.render(); //--> '
...
'"}},TempleRegistry:{elements:{kind:"property",list:!1,type:"Map",description:"Returns a map of elements used in the DOM.",example:"TempleAPI.TempleRegistry.elements.get(component);"},createComponent:{kind:"function",args:[{kind:"property",list:!1,name:"tagname",type:"string"},{kind:"property",list:!1,name:"component",type:"TempleComponent"},{kind:"property",list:!1,name:"props",type:"Hash"},{kind:"property",list:!1,name:"children>",type:"Node[]"}],returns:{kind:"property",list:!1,type:"TempleElement"},description:"Creates a TempleElement from a web component class.",example:"TempleAPI.TempleRegistry.createComponent('fancy-button', TempleComponent, { title: 'Hello' }, children);"},createElement:{kind:"function",args:[{kind:"property",list:!1,name:"tagname",type:"string"},{kind:"property",list:!1,name:"props",type:"Hash"},{kind:"property",list:!1,name:"children>",type:"Node[]"}],returns:{kind:"property",list:!1,type:"TempleElement"},description:"Creates a TempleElement from a string tag name.",example:"TempleAPI.TempleRegistry.createElement('a', { href: '/' }, children);"},createText:{kind:"function",args:[{kind:"property",list:!1,name:"text",type:"string"}],returns:{kind:"property",list:!1,type:"TextNode"},description:"Creates a TextNode from a raw string.",example:"TempleAPI.TempleRegistry.createText('foo');"},get:{kind:"function",args:[{kind:"property",list:!1,name:"element",type:"Element"}],returns:{kind:"property",list:!1,type:"TempleElement"},description:"Returns a TempleElement given a DOM element.",example:"TempleAPI.TempleRegistry.get(element)"},has:{kind:"function",args:[{kind:"property",list:!1,name:"element",type:"Element"}],returns:{kind:"property",list:!1,type:"boolean"},description:"Returns true if the given element exists in the registry",example:"TempleAPI.TempleRegistry.has(element)"},map:{kind:"function",args:[{kind:"property",list:!1,name:"callback",type:"Function"}],returns:{kind:"property",list:!0,type:"T"},description:"Like array map for registry returns an array of whatever the callback returns.",example:"TempleAPI.TempleRegistry.map((temple, element) => [temple, element]);"},register:{kind:"function",args:[{kind:"property",list:!1,name:"element",type:"TempleElement"},{kind:"property",list:!1,name:"props",type:"Hash"}],returns:{kind:"property",list:!1,type:"TempleElement"},description:"Registers a TempleElement to the registry.",example:"TempleAPI.TempleRegistry.register(element, { foo: 'bar' });"}},TempleElement:{attributes:{kind:"property",list:!1,type:"Hash",description:"Returns all the attributes assigned to the element.",example:"element.attributes; //--> { href: '/', title: 'Home' }"},element:{kind:"property",list:!1,type:"Element",description:"Returns the DOM element.",example:"element.element; //--> "},hasAttribute:{kind:"function",args:[{kind:"property",list:!1,name:"name",type:"string"}],returns:{kind:"property",list:!1,type:"boolean"},description:"Returns true if the element has the given attribute.",example:"element.hasAttribute('href');"},getAttribute:{kind:"function",args:[{kind:"property",list:!1,name:"name",type:"string"}],returns:{kind:"property",list:!1,type:"unknown"},description:"Returns the value of the given attribute.",example:"element.getAttribute('href');"},removeAttribute:{kind:"function",args:[{kind:"property",list:!1,name:"name",type:"string"}],returns:{kind:"property",list:!1,type:"TempleElement"},description:"Removes the given attribute from the element.",example:"element.removeAttribute('href');"},setAttribute:{kind:"function",args:[{kind:"property",list:!1,name:"name",type:"string"},{kind:"property",list:!1,name:"value",type:"string"}],returns:{kind:"property",list:!1,type:"TempleElement"},description:"Sets the given attribute to the element.",example:"element.setAttribute('href', '/');"},setAttributes:{kind:"function",args:[{kind:"property",list:!1,name:"attributes",type:"Hash"}],returns:{kind:"property",list:!1,type:"TempleElement"},description:"Sets multiple attributes to the element.",example:"element.setAttributes({ href: '/', title: 'Home' });"}},TempleEmitter:{emit:{kind:"function",args:[{kind:"property",list:!1,name:"event",type:"string"},{kind:"property",list:!1,name:"target",type:"T"}],returns:{kind:"property",list:!1,type:"TempleEmitter"},description:"Emits an event with optional parameters.",example:"emitter.emit('click', { x: 10, y: 20 });"},unbind:{kind:"function",args:[{kind:"property",list:!1,name:"event",type:"string"},{kind:"property",list:!1,name:"listener",type:"Function"}],returns:{kind:"property",list:!1,type:"TempleEmitter"},description:"Removes an event listener.",example:"emitter.unbind('click', handleClick);"},on:{kind:"function",args:[{kind:"property",list:!1,name:"event",type:"string"},{kind:"property",list:!1,name:"listener",type:"Function"}],returns:{kind:"property",list:!1,type:"TempleEmitter"},description:"Adds an event listener.",example:"emitter.on('click', handleClick);"},once:{kind:"function",args:[{kind:"property",list:!1,name:"event",type:"string"},{kind:"property",list:!1,name:"listener",type:"Function"}],returns:{kind:"property",list:!1,type:"TempleEmitter"},description:"Adds an event listener that only fires once.",example:"emitter.once('click', handleClick);"}},TempleAPI:{BUILD_ID:{kind:"property",list:!1,type:"string",description:"The unique build ID used to map the build cache.",example:"TempleAPI.BUILD_ID; //--> 'abc123'"},TempleComponent:{kind:"property",list:!1,type:"TempleComponent",description:"The Temple component class used to create custom elements.",example:"new TempleAPI.TempleComponent();"},TempleElement:{kind:"property",list:!1,type:"TempleElement",description:"The Temple element class used to create custom elements.",example:`new TempleAPI.TempleElement(
+  document.createElement('a'),
+  { href: '/' }
+); ]`},TempleEmitter:{kind:"property",list:!1,type:"TempleEmitter",description:"The Temple emitter class used to create custom events.",example:"new TempleAPI.TempleEmitter();"},TempleException:{kind:"property",list:!1,type:"TempleException",description:"The Temple exception class used to create custom errors.",example:"throw TempleAPI.TempleException.for('error message');"},TempleRegistry:{kind:"property",list:!1,type:"TempleRegistry",description:"The Temple registry class used to store custom elements.",example:"new TempleAPI.TempleRegistry.createElement('a', { href: '/' });"},children:{kind:"function",args:[{kind:"property",list:!1,name:"component",type:"TempleComponent"}],returns:{kind:"property",list:!0,type:"Node"},description:"Returns an array of child nodes.",example:"TempleAPI.children(component); //--> [ Element, Text, Element, ... ]"},components:{kind:"property",list:!1,type:"Record",description:"Returns an object of Temple components classes used in the DOM.",example:"new TempleAPI.components['fancy-button']; //--> TempleComponent"},data:{kind:"property",list:!1,type:"TempleDataMap",description:"The Temple data map used to bring server side data to the client.",example:"TempleAPI.data.get('props');"},emitter:{kind:"property",list:!1,type:"TempleEmitter",description:"The Temple emitter class used to create custom events.",example:"TempleAPI.emitter.on('click', () => {});"},props:{kind:"function",args:[{kind:"property",list:!1,name:"component",type:"TempleComponent"}],returns:{kind:"property",list:!0,type:"Hash"},description:"Returns an object of component attributes",example:"TempleAPI.props(component); //--> { foo: 'bar', count: 4 }"},signal:{kind:"function",args:[{kind:"property",list:!1,name:"component",type:"TempleComponent"}],returns:{kind:"property",list:!1,type:"Signal"},description:"Returns a signal object used to re-render components whenever its value changes",example:"const count = TempleAPI.signal(1, component)"}},"Render Methods":{asset:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"assetFile",type:"string"}],returns:{kind:"property",list:!1,type:"Asset"},description:"Returns a compiled build asset, given an asset file name.",example:"await compiler.asset('abc123.css'); //--> { type: 'text/css', content: '...' }"},client:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"sourceFile",type:"string"}],returns:{kind:"property",list:!1,type:"string"},description:"Returns a compiled client script, given the the template source file.",example:"await compiler.client('./docs/api.dtml'); //client script"},markup:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"sourceFile",type:"string"}],returns:{kind:"property",list:!1,type:"string"},description:"Returns a compiled markup, given the the template source file.",example:"await compiler.markup('./docs/api.dtml'); //--> ..."},render:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"sourceFile",type:"string"},{kind:"property",list:!1,name:"props",type:"Hash"}],returns:{kind:"property",list:!1,type:"string"},description:"Returns the final HTML markup, given the the template source file.",example:`await compiler.render('./docs/api.dtml', {
+  title: 'API Documentation'
+});`},server:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"sourceFile",type:"string"}],returns:{kind:"property",list:!1,type:"string"},description:"Returns compiled server code, given the the template source file.",example:"await compiler.server('./docs/api.dtml'); // server script"},styles:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"sourceFile",type:"string"}],returns:{kind:"property",list:!1,type:"string"},description:"Returns compiled css styles, given the the template source file.",example:"await compiler.styles('./docs/api.dtml'); //css styles"}},DeveloperOptions:{"cwd?":{kind:"property",list:!1,type:"string",description:"The current working directory",example:"const { refresh, router } = dev({ cwd: process.cwd() })"},"emitter?":{kind:"property",list:!1,type:"EventEmitter",description:"The NodeJS EventEmitter instance being used.",example:`import emitter from 'events';
+
+const { refresh, router } = dev({ emitter });'`},"include?":{kind:"property",list:!0,type:"string",description:"An array of extension names to watch for",example:"const { refresh, router } = dev({ include: [ '.js', '.ts', '.tml', '.dtml' ] });'"},"ignore?":{kind:"property",list:!0,type:"(string|RegExp)",description:"An array of extension names to ignore",example:"const { refresh, router } = dev({ ignore: [ '*.test.*' ] });'"},"route?":{kind:"property",list:!1,type:"string",description:"The route path to use for the client watcher",example:"const { refresh, router } = dev({ route: '/__temple_dev__' })"},"tsconfig?":{kind:"property",list:!1,type:"string",description:"The path to the tsconfig.json file",example:"const { refresh, router } = dev({ tsconfig: '/path/to/tsconfig.json' })"},"extname?":{kind:"property",list:!1,type:"string",description:"the component file extension",example:"const { refresh, router } = dev({ extname: '.tml' })"}},RefreshServer:{cwd:{kind:"property",list:!1,type:"string",description:"The current working directory",example:"refresh.cwd"},emitter:{kind:"property",list:!1,type:"EventEmitter",description:"The NodeJS EventEmitter instance being used.",example:`refresh.emitter.on('render', e => {
+  console.log(e.params);
+});`},sync:{kind:"function",args:[{kind:"property",name:"builder",list:!1,type:"DocumentBuilder"}],returns:{kind:"property",list:!1,type:"void"},description:"Registers a document builder to a client watcher list",example:`refresh.emitter.on('render', e => {
+  console.log(e.params);
+});`},close:{kind:"function",args:[],returns:{kind:"property",list:!1,type:"RefreshServer"},description:"Closes the server and stops the watchers.",example:"refresh.close();"},refresh:{kind:"function",args:[{kind:"property",list:!1,name:"filePath",type:"string"}],returns:{kind:"property",list:!1,type:"Promise"},description:"Whenever a file is changed this will be called to instruct each client watcher how to update their document.",example:"await refresh.refresh('/some/file.tml');"},wait:{kind:"function",args:[{kind:"property",list:!1,name:"req",type:"Request"},{kind:"property",list:!1,name:"res",type:"Response"}],returns:{kind:"property",list:!1,type:"RefreshServer"},description:"Opens a connection to the server via SSE and waits for changes.",example:"refresh.wait(req, res);"},watch:{kind:"function",args:[],returns:{kind:"property",list:!1,type:"RefreshServer"},description:"Starts the server that watches for file changes.",example:"refresh.watch();"}},"Developer Tools":{refresh:{kind:"property",list:!1,type:"RefreshServer",description:"The refresh server instance used to update clients.",example:`const { refresh } = dev();
+refresh.sync(builder);`},router:{kind:"property",list:!1,type:"Function",description:"HTTP middleware to handle developer tool routes like '/dev.js' and '/__temple_dev__'.",example:`const { router } = dev();
+app.use(router);`}},"Express Developer Tools":{refresh:{kind:"property",list:!1,type:"RefreshServer",description:"The refresh server instance used to update clients.",example:`const { refresh } = dev();
+refresh.sync(builder);`},router:{kind:"property",list:!1,type:"Function",description:"Express middleware to handle developer tool routes like '/dev.js' and '/__temple_dev__'.",example:`const { router } = dev();
+app.use(router);`},view:{kind:"property",list:!1,type:"Function",description:"Middleware used to setup an express view engine.",example:`const { view } = dev();
+app.engine('dtml', view(compiler));`}}};var _e=class extends l.TempleComponent{static component=["ui","Ui_0ec6f6ca4b362d125365"];styles(){return""}template(){(0,te.classlist)().add("block","my-40","scroll-hidden","curved","shadow-0-0-10-0-0-0-5");let{start:e="TempleCompiler"}=(0,te.props)(),s=(0,te.signal)([e]),n=(0,te.signal)(e),r=b=>{let d=b.target.getAttribute("data-type");s.value=[...s.value,d],n.value=d},u=()=>{s.value=s.value.slice(0,s.value.length-1),n.value=s.value[s.value.length-1]};return()=>[l.TempleRegistry.createText(`
+`,!1),l.TempleRegistry.createElement("h3",{class:"tx-secondary bg-t-2 tx-16 m-0 p-10"},[l.TempleRegistry.createText(`
+  `,!1),...s.value.length>1?[l.TempleRegistry.createText(`
+    `,!1),l.TempleRegistry.createElement("a",{class:"tx-t-1 cursor-pointer",click:u},[l.TempleRegistry.createText(`
+      `,!1),l.TempleRegistry.createElement("i",{class:"fas fa-arrow-left"},[]).element,l.TempleRegistry.createText(`
+    `,!1)]).element,l.TempleRegistry.createText(`
+  `,!1)]:[],l.TempleRegistry.createText(`
+  API: `,!1),...this._toNodeList(n.value),l.TempleRegistry.createText(`
+`,!1)]).element,l.TempleRegistry.createText(`
+`,!1),l.TempleRegistry.createElement("div",{class:"bg-t-0 p-10"},[l.TempleRegistry.createText(`
+  `,!1),l.TempleRegistry.createElement("div",{class:"relative mb-20 scroll-auto"},[l.TempleRegistry.createText(`
+    `,!1),l.TempleRegistry.createElement("table",{class:"w-full bd-collapse"},[l.TempleRegistry.createText(`
+      `,!1),l.TempleRegistry.createElement("thead",{},[l.TempleRegistry.createText(`
+        `,!1),l.TempleRegistry.createElement("th",{class:"p-10 tx-left tx-uppercase"},[l.TempleRegistry.createText("Property",!1)]).element,l.TempleRegistry.createText(`
+        `,!1),...n.value.includes("Emitter")?[]:[l.TempleRegistry.createText(`
+          `,!1),l.TempleRegistry.createElement("th",{class:"p-10 tx-left tx-uppercase"},[l.TempleRegistry.createText("Returns",!1)]).element,l.TempleRegistry.createText(`
+        `,!1)],l.TempleRegistry.createText(`
+        `,!1),l.TempleRegistry.createElement("th",{class:"p-10 tx-left tx-uppercase"},[l.TempleRegistry.createText("Description",!1)]).element,l.TempleRegistry.createText(`
+      `,!1)]).element,l.TempleRegistry.createText(`
+      `,!1),l.TempleRegistry.createElement("tbody",{},[l.TempleRegistry.createText(`
+        `,!1),...Object.entries(We[n.value]).map(([b,d])=>[l.TempleRegistry.createText(`
+          `,!1),l.TempleRegistry.createElement("tr",{},[l.TempleRegistry.createText(`
+            `,!1),...d.kind==="property"?[l.TempleRegistry.createText(`
+              `,!1),l.TempleRegistry.createElement("td",{class:"tx-primary tx-top tx-nowrap bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10"},[l.TempleRegistry.createText(`
+                `,!1),...this._toNodeList(b),l.TempleRegistry.createText(`
+              `,!1)]).element,l.TempleRegistry.createText(`
+              `,!1),...We[d.type]?[l.TempleRegistry.createText(`
+                `,!1),l.TempleRegistry.createElement("td",{class:"tx-top tx-nowrap bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10"},[l.TempleRegistry.createText(`
+                  `,!1),l.TempleRegistry.createElement("a",{"data-type":d.type,click:r},[l.TempleRegistry.createText(`
+                    `,!1),...this._toNodeList(d.type),l.TempleRegistry.createText(`
+                  `,!1)]).element,...this._toNodeList(d.list?"[]":""),l.TempleRegistry.createText(`
+                `,!1)]).element,l.TempleRegistry.createText(`
+              `,!1)]:[,l.TempleRegistry.createText(`
+                `,!1),l.TempleRegistry.createElement("td",{class:"tx-top tx-nowrap bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10"},[l.TempleRegistry.createText(`
+                  `,!1),...this._toNodeList(d.type),...this._toNodeList(d.list?"[]":""),l.TempleRegistry.createText(`
+                `,!1)]).element,l.TempleRegistry.createText(`
+              `,!1)],l.TempleRegistry.createText(`
+            `,!1)]:d.kind==="function"?[,l.TempleRegistry.createText(`
+              `,!1),l.TempleRegistry.createElement("td",{class:"tx-primary tx-top bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10",nowrap:!0},[l.TempleRegistry.createText(`
+                `,!1),...this._toNodeList(b),l.TempleRegistry.createText(`(
+                  `,!1),...Object.entries(d.args).map(([T,v])=>[l.TempleRegistry.createText(`
+                    `,!1),...T>0?[l.TempleRegistry.createText(", ",!1)]:[],l.TempleRegistry.createText(`
+                    `,!1),...this._toNodeList(v.name),l.TempleRegistry.createText(`: 
+                    `,!1),...We[v.type]?[l.TempleRegistry.createText(`
+                      `,!1),l.TempleRegistry.createElement("a",{"data-type":v.type,click:r},[l.TempleRegistry.createText(`
+                        `,!1),...this._toNodeList(v.type),l.TempleRegistry.createText(`
+                      `,!1)]).element,...this._toNodeList(v.list?"[]":""),l.TempleRegistry.createText(`
+                    `,!1)]:[,l.TempleRegistry.createText(`
+                      `,!1),...this._toNodeList(v.type),...this._toNodeList(v.list?"[]":""),l.TempleRegistry.createText(`
+                    `,!1)],l.TempleRegistry.createText(`
+                  `,!1)]).flat(),l.TempleRegistry.createText(`
+                )
+              `,!1)]).element,l.TempleRegistry.createText(`
+              `,!1),...We[d.returns.type]?[l.TempleRegistry.createText(`
+                `,!1),l.TempleRegistry.createElement("td",{class:"tx-top tx-nowrap bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10"},[l.TempleRegistry.createText(`
+                  `,!1),l.TempleRegistry.createElement("a",{"data-type":d.returns.type,click:r},[l.TempleRegistry.createText(`
+                    `,!1),...this._toNodeList(d.returns.type),l.TempleRegistry.createText(`
+                  `,!1)]).element,...this._toNodeList(d.returns.list?"[]":""),l.TempleRegistry.createText(`
+                `,!1)]).element,l.TempleRegistry.createText(`
+              `,!1)]:[,l.TempleRegistry.createText(`
+                `,!1),l.TempleRegistry.createElement("td",{class:"tx-top tx-nowrap bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10"},[l.TempleRegistry.createText(`
+                  `,!1),...this._toNodeList(d.returns.type),...this._toNodeList(d.returns.list?"[]":""),l.TempleRegistry.createText(`
+                `,!1)]).element,l.TempleRegistry.createText(`
+              `,!1)],l.TempleRegistry.createText(`
+            `,!1)]:d.kind==="event"?[,l.TempleRegistry.createText(`
+              `,!1),l.TempleRegistry.createElement("td",{class:"tx-primary tx-top bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10",nowrap:!0},[l.TempleRegistry.createText(`
+                `,!1),...this._toNodeList(`on('${b}', (event: Event) => void)`),l.TempleRegistry.createText(`
+              `,!1)]).element,l.TempleRegistry.createText(`
+            `,!1)]:[],l.TempleRegistry.createText(`
+            `,!1),l.TempleRegistry.createElement("td",{class:"tx-top tx-lh-24 bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10"},[l.TempleRegistry.createText(`
+              `,!1),...d.description?[l.TempleRegistry.createText(`
+                `,!1),l.TempleRegistry.createElement("p",{class:"pb-10"},[...this._toNodeList(d.description)]).element,l.TempleRegistry.createText(`
+                `,!1),...d.example?[l.TempleRegistry.createText(`
+                  `,!1),l.TempleRegistry.createElement("h5",{},[l.TempleRegistry.createText("Example",!1)]).element,l.TempleRegistry.createText(`
+                  `,!1),l.TempleRegistry.createComponent("api-ide-code",ee,{lang:"js"},[...this._toNodeList(d.example)]).element,l.TempleRegistry.createText(` 
+                `,!1)]:[],l.TempleRegistry.createText(`
+              `,!1)]:[],l.TempleRegistry.createText(`
+            `,!1)]).element,l.TempleRegistry.createText(`
+          `,!1)]).element,l.TempleRegistry.createText(`
+        `,!1)]).flat(),l.TempleRegistry.createText(`
+      `,!1)]).element,l.TempleRegistry.createText(`
+    `,!1)]).element,l.TempleRegistry.createText(`
+  `,!1)]).element,l.TempleRegistry.createText(`
+`,!1)]).element]}};var se=_(C()),ft=_(j()),we=class extends se.TempleComponent{static component=["head","Head_939ecb5f22962d8c2924"];styles(){return""}template(){return(0,ft.classlist)().add("absolute","top-0","right-0","left-170","h-45","bg-t-0","z-1"),()=>[se.TempleRegistry.createText(`
+`,!1),se.TempleRegistry.createElement("header",{class:"w-full h-full scroll-x-auto"},[se.TempleRegistry.createText(`
+  `,!1),...this._toNodeList((0,ft.children)()),se.TempleRegistry.createText(`
+`,!1)]).element]}};var re=_(C()),ht=_(j()),Ee=class extends re.TempleComponent{static component=["left","Left_a7102198c3628da88b4f"];styles(){return""}template(){return(0,ht.classlist)().add("absolute","top-0","bottom-0","left-0","w-170","bg-h-000000","bd-solid","bd-t-2","bdy-0","bdl-0","bdr-1","z-2"),()=>[re.TempleRegistry.createText(`
+`,!1),re.TempleRegistry.createElement("aside",{class:"w-full h-full scroll-auto"},[re.TempleRegistry.createText(`
+  `,!1),...this._toNodeList((0,ht.children)()),re.TempleRegistry.createText(`
+`,!1)]).element]}};var ne=_(C()),gt=_(j()),Ae=class extends ne.TempleComponent{static component=["main","Main_bbd0517424ebab9de270"];styles(){return""}template(){return(0,gt.classlist)().add("absolute","top-45","right-0","left-170","bottom-0","bg-black","bd-solid","bd-t-2","bdx-0","bdb-0","bdt-1"),()=>[ne.TempleRegistry.createText(`
+`,!1),ne.TempleRegistry.createElement("main",{class:"w-full h-full scroll-auto"},[ne.TempleRegistry.createText(`
+  `,!1),...this._toNodeList((0,gt.children)()),ne.TempleRegistry.createText(`
+`,!1)]).element]}};var D=_(C()),yt=_(j()),Le=class extends D.TempleComponent{static component=["app","App_381239c61b65b86a1c20"];styles(){return""}template(){let{title:e,height:s}=(0,yt.props)(),n=s?`height:${s}px`:"";return()=>[D.TempleRegistry.createText(`
+`,!1),D.TempleRegistry.createElement("div",{class:"bd-rad-curved scroll-hidden shadow-0-0-10-0-0-0-5"},[D.TempleRegistry.createText(`
+  `,!1),D.TempleRegistry.createElement("div",{class:"relative flex flex-center-y gap-10 p-10 bg-t-1 tx-c-999999 tx-16"},[D.TempleRegistry.createText(`
+    `,!1),D.TempleRegistry.createElement("span",{class:"bg-h-999999 pill h-10 w-10"},[]).element,D.TempleRegistry.createText(`
+    `,!1),D.TempleRegistry.createElement("span",{class:"bg-h-999999 pill h-10 w-10"},[]).element,D.TempleRegistry.createText(`
+    `,!1),D.TempleRegistry.createElement("span",{class:"bg-h-999999 pill h-10 w-10"},[]).element,D.TempleRegistry.createText(`
+    `,!1),D.TempleRegistry.createElement("span",{class:"flex flex-center h-full w-full absolute top-0 left-0"},[D.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(e),D.TempleRegistry.createText(`
+    `,!1)]).element,D.TempleRegistry.createText(`
+  `,!1)]).element,D.TempleRegistry.createText(`
+  `,!1),D.TempleRegistry.createElement("div",{class:"bg-black tx-t-1 relative",style:n},[...this._toNodeList((0,yt.children)())]).element,D.TempleRegistry.createText(`
+`,!1)]).element]}};var F=_(C()),It=_(Mt()),cs=_(j()),Re=class extends F.TempleComponent{static component=["code","Code_5294df1c620ef5ddbd2f"];styles(){return`:host {
+    display: block;
+    font-size: 14px;
+    line-height: 20px;
+  }
+  :host([inline]) {
+    display: inline !important;
+  }
+  :host([inline]),
+  :host([inline]) > pre,
+  :host([inline]) > pre > code {
+    display: inline !important;
+  }
+  .snippet {
+    background-color: #000000;
+    color: #ABB2BF;
+    height: 100%;
+    margin: 0;
+    padding: 0;
+  }
+
+  .line-numbers {
+    position: relative;
+    padding-left: 3.8em;
+    counter-reset: linenumber;
+  }
+  :host([inline]) .line-numbers {
+    position: static;
+    padding-left: 0;
+  }
+
+  .line-numbers > code {
+    position: relative;
+    white-space: inherit;
+  }
+
+  .line-numbers .line-numbers-rows {
+    position: absolute;
+    pointer-events: none;
+    top: 0;
+    font-size: 100%;
+    left: -3.8em;
+    width: 3em; /* works for line-numbers below 1000 lines */
+    letter-spacing: -1px;
+    border-right: 1px solid #999;
+
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+
+  }
+
+  :host([inline]) .line-numbers .line-numbers-rows {
+    display: none;
+  }
+
+  .line-numbers-rows > span {
+    display: block;
+    counter-increment: linenumber;
+  }
+
+  .line-numbers-rows > span:before {
+    content: counter(linenumber);
+    color: #999;
+    display: block;
+    padding-right: 0.8em;
+    text-align: right;
+  }
+  .pad {
+    padding: 5px;
+  }
+
+  .terminal {
+    background-color: #000000;
+    font-family: 'Courier New', Courier, monospace;
+    font-size: 15px;
+    height: 100%;
+    padding: 10px;
+  }
+  .terminal span {
+    color: #00FF00;
+  }`}template(){let e=this.props,{lang:s="markup",numbers:n=!1,inline:r=!1,trim:u=!1,ltrim:b=!1,rtrim:d=!1,detab:T=0}=e,v=(0,cs.children)(),m=v[0]?.textContent||"";T&&(m=m.replace(new RegExp(`\\n {${T}}`,"g"),`
+`)),u?m=m.trim():b?m=m.replace(/^\s+/,""):d&&(m=m.replace(/\s+$/,""));let A=L=>{if(!m)return;let x=It.default.highlight(m,It.default.languages[s],s);if(L.detail.target.innerHTML=x,n){let E=x.match(/\n(?!$)/g),i=E?E.length+1:1,a=new Array(i+1).join(""),p=document.createElement("span");p.setAttribute("aria-hidden","true"),p.className="line-numbers-rows",p.innerHTML=a,L.detail.target.appendChild(p)}};return()=>[F.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism.min.css"}).element,F.TempleRegistry.createText(`
+`,!1),F.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism-tomorrow.min.css"}).element,F.TempleRegistry.createText(`
+`,!1),...s==="bash"?[F.TempleRegistry.createText(`
+  `,!1),F.TempleRegistry.createElement("div",{class:"terminal"},[F.TempleRegistry.createElement("span",{},[F.TempleRegistry.createText("$",!1)]).element,F.TempleRegistry.createText(" ",!1),...this._toNodeList(v)]).element,F.TempleRegistry.createText(`
+`,!1)]:m?[,F.TempleRegistry.createText(`
+  `,!1),...n?[F.TempleRegistry.createText(`
+    `,!1),F.TempleRegistry.createElement("pre",{class:"snippet line-numbers"},[F.TempleRegistry.createElement("code",{mount:A},[]).element]).element,F.TempleRegistry.createText(`
+  `,!1)]:[,F.TempleRegistry.createText(`
+    `,!1),F.TempleRegistry.createElement("pre",{class:"snippet pad"},[F.TempleRegistry.createElement("code",{mount:A},[]).element]).element,F.TempleRegistry.createText(`
+  `,!1)],F.TempleRegistry.createText(`
+`,!1)]:[,F.TempleRegistry.createText(`
+  `,!1),F.TempleRegistry.createElement("span",{},[F.TempleRegistry.createText("????",!1)]).element,F.TempleRegistry.createText(`
+`,!1)],F.TempleRegistry.createText(`
+
+`,!1)]}};var Ue=_(C()),bt=_(j()),Fe=class extends Ue.TempleComponent{static component=["preview","Preview_ab5776d356e4ce3da5d5"];styles(){return""}template(){return(0,bt.classlist)().add("block","w-full","h-full","scroll-auto"),()=>[Ue.TempleRegistry.createText(`
+`,!1),Ue.TempleRegistry.createElement("div",{class:"bg-white tx-black arial p-10 h-full"},[...this._toNodeList((0,bt.children)())]).element]}};var O=_(C());var Ot=function(t,...e){let s=$t(t);for(let n=0;n[O.TempleRegistry.createText(`
+    `,!1),...s?[O.TempleRegistry.createText(`
+      `,!1),O.TempleRegistry.createElement("p",{},[...this._toNodeList(m)]).element,O.TempleRegistry.createText(`
+    `,!1)]:n?[,O.TempleRegistry.createText(`
+      `,!1),O.TempleRegistry.createElement("li",{},[...this._toNodeList(m)]).element,O.TempleRegistry.createText(`
+    `,!1)]:r?[,O.TempleRegistry.createText(`
+      `,!1),O.TempleRegistry.createElement("div",{},[...this._toNodeList(m)]).element,O.TempleRegistry.createText(`
+    `,!1)]:[,O.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(m),O.TempleRegistry.createText(`
+    `,!1)]]}};var P=_(C());B.emitter.once("ready",()=>{let t=document.querySelector("script[data-app]");if(!t)throw B.TempleException.for("APP_DATA not found");try{let b=atob(t.getAttribute("data-app"));window.__APP_DATA__=JSON.parse(b),Object.entries(window.__APP_DATA__).forEach(([d,T])=>{B.data.set(d,T)})}catch{throw B.TempleException.for("APP_DATA is not a valid JSON")}B.data.set("current","document");let e="/temple/panel.html",s=Ot("Temple - The reactive web component template engine."),n=Ot("Temple is a template engine that generates web components and support reactivity."),r=()=>{document.getElementsByTagName("panel-layout")[0].toggle("left")};B.data.delete("current");let u={2:{class:"flex flex-center-y px-20 py-15 m-0 bg-t-1"},3:{class:"fas fa-fw fa-bars cursor-pointer py-5 pr-10 none md-inline-block tx-t-1",click:r},4:{class:"flex-grow"},5:{class:"flex flex-center-y"},6:{class:"tx-white",href:"/temple/docs/index.html"},7:{class:"tx-t-1 tx-5xl ml-10",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},8:{class:"fab fa-github"},9:{class:"bg-h-cb3837 pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},10:{class:"fab fa-npm text-white"},11:{class:"bg-h-7289da pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},12:{class:"fab fa-discord text-white"},14:{class:"flex flex-center-y bg-t-2 py-15 pr-5 pl-10"},15:{href:"/temple"},16:{class:"h-26 mr-10",src:"/temple/temple-icon.png",alt:"Temple Logo"},17:{class:"flex-grow m-0 tx-uppercase"},18:{class:"tx-white",href:"/temple"},19:{class:"fas fa-fw fa-chevron-left cursor-pointer none md-inline-block",click:r},20:{class:"bg-t-1 scroll-auto h-calc-full-60"},21:{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-0 pt-20 pb-10 pl-10 tx-uppercase"},22:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/index.html"},23:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/getting-started.html"},24:{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},25:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/markup-syntax.html"},26:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/state-management.html"},27:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-strategy.html"},28:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/compiler-api.html"},29:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/client-api.html"},30:{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},31:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/template-engine.html"},32:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/single-page.html"},33:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/static-site.html"},34:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-publisher.html"},35:{class:"block tx-t-1 py-10 pl-10 mb-100",href:"/temple/docs/developer-tools.html"},37:{class:"m-0 px-10 py-20 h-calc-full-40 bg-t-2 scroll-auto"},38:{class:"tx-muted tx-14 mb-0 mt-0 pb-10 tx-uppercase"},39:{class:"tx-14 tx-lh-32"},40:{class:"block tx-t-0",href:"#http"},41:{class:"block tx-t-0",href:"#develop"},42:{class:"block tx-t-0",href:"#cache"},43:{class:"block tx-t-0",href:"#tailwind"},44:{class:"block tx-t-0",href:"#express"},45:{class:"pl-20"},46:{class:"block tx-t-1",href:"#http"},47:{class:"block tx-t-1",href:"#develop"},48:{class:"block tx-t-1",href:"#cache"},49:{class:"block tx-t-1",href:"#tailwind"},50:{class:"block tx-t-1",href:"#express"},53:{class:"tx-primary tx-uppercase tx-30 py-20"},54:{p:!0,trim:!0,class:"tx-lh-36 py-20"},55:{inline:!0},56:{inline:!0,lang:"js"},57:{title:"Terminal",class:"py-20"},58:{lang:"bash"},59:{class:"tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0"},60:{p:!0,trim:!0,class:"tx-lh-36 py-20"},61:{inline:!0},62:{inline:!0,lang:"js"},63:{title:"src/index.ts",class:"py-20"},64:{lang:"js",numbers:!0,trim:!0,detab:14},65:{class:"tx-t-1 tx-uppercase tx-22 pt-40 pb-20"},66:{p:!0,trim:!0,class:"tx-lh-36 py-20"},67:{inline:!0},68:{inline:!0,lang:"js"},69:{title:"Basic Example",class:"py-20"},70:{class:"flex bg-h-EFEFEF h-full lg-block"},71:{class:"basis-half",numbers:!0,trim:!0,detab:14},72:{class:"bg-white basis-half h-140 lg-h-auto"},74:{solid:!0,curved:!0,info:!0,class:"py-20 tx-lh-24"},75:{class:"fas fa-info-circle"},77:{target:"_blank",class:"tx-white tx-underline",href:"https://marketplace.visualstudio.com/items?itemName=ossph.temple-language"},78:{height:410,title:"With NodeJS HTTP"},80:{class:"flex scroll-x-auto pt-5 pl-5"},81:{on:!0,class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"http",selector:"#index-ts"},82:{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"http",selector:"#page-dtml"},83:{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"http",selector:"#package-json"},85:{class:"p-5"},86:{class:"fas fa-fw fa-chevron-down"},88:{on:!0,class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"http",selector:"#index-ts"},89:{class:"fas fa-fw fa-file"},90:{class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"http",selector:"#page-dtml"},91:{class:"fas fa-fw fa-file"},92:{class:"pt-10 block",active:"tx-white",inactive:"tx-muted",group:"http",selector:"#package-json"},93:{class:"fas fa-fw fa-file"},95:{id:"index-ts",lang:"js",numbers:!0,trim:!0,detab:16},96:{id:"page-dtml",style:"display:none",numbers:!0,trim:!0,detab:16},97:{id:"package-json",style:"display:none",lang:"js",numbers:!0,trim:!0,detab:16},99:{class:"flex"},100:{class:"tx-primary py-40",href:"/temple/docs/getting-started.html"},101:{class:"fas fa-fw fa-chevron-left tx-t-1"},102:{class:"flex-grow tx-right tx-primary py-40",href:"/temple/docs/getting-started.html"},103:{class:"fas fa-fw fa-chevron-right tx-t-1"}};for(let b of document.body.querySelectorAll("*")){let d=Object.fromEntries(Array.from(b.attributes).map(v=>[v.nodeName,v.nodeValue.length>0?v.nodeValue:!0])),T=String(B.TempleRegistry.elements.size);u[T]&&(Object.assign(d,u[T]),b.TempleAttributes=u[T]),B.TempleRegistry.register(b,d)}customElements.define("panel-layout",de),customElements.define("panel-head",ue),customElements.define("panel-left",me),customElements.define("panel-right",fe),customElements.define("panel-main",he),customElements.define("tui-button",ge),customElements.define("tui-alert",be),customElements.define("tui-tab",ke),customElements.define("api-docs",Te),customElements.define("api-ui",_e),customElements.define("app-head",we),customElements.define("app-left",Ee),customElements.define("app-main",Ae),customElements.define("ide-app",Le),customElements.define("ide-code",Re),customElements.define("ide-preview",Fe),customElements.define("i18n-translate",Se),B.emitter.emit("mounted",document.body)});var nr={PanelLayout_9f3ab204ce271feaf6f7:de,PanelHead_2bf4dff19bc88ba4138b:ue,PanelLeft_f4ab589e043eee17d229:me,PanelRight_4ce97029791442c57f8d:fe,PanelMain_847772763f4518728ede:he,TuiButton_d798a3059463b9c4868b:ge,TuiAlert_f0fe98801b4b833c4233:be,TuiTab_5a341768ef0a010965e3:ke,ApiDocs_40562a7bb56d70d971df:Te,ApiUi_0ec6f6ca4b362d125365:_e,ApiIdeCode_6f36bc13bb6a166c7abc:ee,AppHead_939ecb5f22962d8c2924:we,AppLeft_a7102198c3628da88b4f:Ee,AppMain_bbd0517424ebab9de270:Ae,IdeApp_381239c61b65b86a1c20:Le,IdeCode_5294df1c620ef5ddbd2f:Re,IdePreview_ab5776d356e4ce3da5d5:Fe,I18nTranslate_0014b007fc91289b2776:Se},ir="a52462b5d1f8879f7b73";return xs(ar);})();
+/*! Bundled license information:
+
+prismjs/prism.js:
+  (**
+   * Prism: Lightweight, robust, elegant syntax highlighting
+   *
+   * @license MIT 
+   * @author Lea Verou 
+   * @namespace
+   * @public
+   *)
+*/
diff --git a/docs/build/client/a67341498153885a2fc0.css b/docs/build/client/a67341498153885a2fc0.css
index e69de29..3fe005b 100644
--- a/docs/build/client/a67341498153885a2fc0.css
+++ b/docs/build/client/a67341498153885a2fc0.css
@@ -0,0 +1,274 @@
+html, body {
+  height: 100%;
+  margin: 0;
+  padding: 0;
+  width: 100%;
+}
+
+h1, h2, h3, h4, h5, h6, p {
+  margin: 0;
+  padding: 0;
+}
+
+a {
+  text-decoration: none;
+}
+  html-head:not(:defined) { opacity: 0; }
+html-header:not(:defined) { opacity: 0; }
+html-aside:not(:defined) { opacity: 0; }
+panel-layout:not(:defined) { opacity: 0; }
+panel-head:not(:defined) { opacity: 0; }
+panel-left:not(:defined) { opacity: 0; }
+panel-right:not(:defined) { opacity: 0; }
+panel-main:not(:defined) { opacity: 0; }
+tui-alert:not(:defined) { opacity: 0; }
+tui-tab:not(:defined) { opacity: 0; }
+api-docs:not(:defined) { opacity: 0; }
+api-ui:not(:defined) { opacity: 0; }
+app-head:not(:defined) { opacity: 0; }
+app-left:not(:defined) { opacity: 0; }
+app-main:not(:defined) { opacity: 0; }
+ide-app:not(:defined) { opacity: 0; }
+ide-code:not(:defined) { opacity: 0; }
+i18n-translate:not(:defined) { opacity: 0; }
+  :root {
+  --black: #000000;
+  --white: #FFFFFF;
+  --info: #1474FC;
+  --error: #DC3545;
+  --warning: #FF7B07;
+  --success: #28A745;
+  --muted: #999999;
+}
+
+.light {
+  --bg-0: #EFEFEF;
+  --bg-1: #CFCFCF;
+  --bg-2: #AFAFAF;
+  --bg-3: #8F8F8F;
+  --bg-4: #6F6F6F;
+  --bd-0: #EFEFEF;
+  --bd-1: #CFCFCF;
+  --bd-2: #AFAFAF;
+  --bd-3: #8F8F8F;
+  --bd-4: #6F6F6F;
+  --bg-inverse: #242424;
+  --tx-0: #000000;
+  --tx-1: #242424;
+  --tx-inverse: #CFCFCF;
+}
+
+.dark {
+  --bg-0: #121212;
+  --bg-1: #222222;
+  --bg-2: #323232;
+  --bg-3: #424242;
+  --bg-4: #525252;
+  --bd-0: #121212;
+  --bd-1: #222222;
+  --bd-2: #323232;
+  --bd-3: #424242;
+  --bd-4: #525252;
+  --bg-inverse: #DBDBDB;
+  --tx-0: #FFFFFF;
+  --tx-1: #CFCFCF;
+  --tx-inverse: #222222;
+}
+  html-head { display: block; }
+html-header { display: block; }
+html-aside { display: block; }
+panel-layout { display: block; }
+panel-head { display: block; }
+panel-left { display: block; }
+panel-right { display: block; }
+panel-main { display: block; }
+tui-alert { display: block; }
+tui-tab { display: block; }
+api-docs { display: block; }
+api-ui { display: block; }
+api-ide-code { display: block; }
+app-head { display: block; }
+app-left { display: block; }
+app-main { display: block; }
+ide-app { display: block; }
+ide-code { display: block; }
+i18n-translate { display: block; }
+  .arial { font-family: Arial, sans-serif; }
+.none { display: none; }
+.block { display: block; }
+.flex { display: flex; }
+.inline { display: inline; }
+.transparent { opacity: 0; }
+.relative { position: relative; }
+.absolute { position: absolute; }
+.static { position: static; }
+.bottom-0 { bottom: 0px; }
+.bottom-60 { bottom: 60px; }
+.left-0 { left: 0px; }
+.left-226 { left: 226px; }
+.left-0 { left: 0px; }
+.left-226 { left: 226px; }
+.left--226 { left: -226px; }
+.left-170 { left: 170px; }
+.right-0 { right: 0px; }
+.right--200 { right: -200px; }
+.right-0 { right: 0px; }
+.right-200 { right: 200px; }
+.right-200 { right: 200px; }
+.top-0 { top: 0px; }
+.top-60 { top: 60px; }
+.top-45 { top: 45px; }
+.z-1 { z-index: 1; }
+.z-2 { z-index: 2; }
+.flex-grow { flex-grow: 1; }
+.flex-center { align-items: center; justify-content: center; }
+.flex-center-y { align-items: center; }
+.gap-10 { gap: 10px; }
+.scroll-auto { overflow: auto; }
+.scroll-hidden { overflow: hidden; }
+.scroll-x-auto { overflow-x: auto; }
+.scroll-x-hidden { overflow-x: hidden; }
+.scroll-y-auto { overflow-y: auto; }
+.h-full { height: 100%; }
+.h-26 { height: 26px; }
+.h-7289 { height: 7289px; }
+.h-905496362982981723 { height: 905496362982981723px; }
+.h-60 { height: 60px; }
+.h-24 { height: 24px; }
+.h-45 { height: 45px; }
+.h-000000 { height: 000000px; }
+.h-999999 { height: 999999px; }
+.h-10 { height: 10px; }
+.h-32 { height: 32px; }
+.h-36 { height: 36px; }
+.h-333333 { height: 333333px; }
+.h-calc-full-60 { height: calc(100% - 60px); }
+.h-calc-full-40 { height: calc(100% - 40px); }
+.vh { height: 100vh; }
+.w-full { width: 100%; }
+.w-226 { width: 226px; }
+.w-200 { width: 200px; }
+.w-0 { width: 0px; }
+.w-170 { width: 170px; }
+.w-10 { width: 10px; }
+.bg-primary { background-color: var(--primary) !important; }
+.bg-secondary { background-color: var(--secondary) !important; }
+.bg-black { background-color: var(--black) !important; }
+.bg-white { background-color: var(--white) !important; }
+.bg-info { background-color: var(--info) !important; }
+.bg-error { background-color: var(--error) !important; }
+.bg-warning { background-color: var(--warning) !important; }
+.bg-success { background-color: var(--success) !important; }
+.bg-muted { background-color: var(--muted) !important; }
+.bg-t-1 { background-color: var(--bg-1) !important; }
+.bg-t-2 { background-color: var(--bg-2) !important; }
+.bg-t-0 { background-color: var(--bg-0) !important; }
+.bg-h-cb3837 { background-color: #cb3837; }
+.bg-h-7289da { background-color: #7289da; }
+.bg-h-000000 { background-color: #000000; }
+.bg-h-999999 { background-color: #999999; }
+.tx-5 { font-size: 5px; }
+.tx-14 { font-size: 14px; }
+.tx-16 { font-size: 16px; }
+.tx-30 { font-size: 30px; }
+.tx-26 { font-size: 26px; }
+.tx-22 { font-size: 22px; }
+.tx-lg { font-size: 16px; }
+.tx-5xl { font-size: 26px; }
+.tx-center { text-align: center; }
+.tx-left { text-align: left; }
+.tx-right { text-align: right; }
+.tx-bold { font-weight: bold; }
+.tx-underline { text-decoration: underline; }
+.tx-uppercase { text-transform: uppercase; }
+.tx-nowrap { white-space: nowrap; }
+.tx-top { vertical-align: top; }
+.tx-lh-24 { line-height: 24px; }
+.tx-lh-32 { line-height: 32px; }
+.tx-lh-36 { line-height: 36px; }
+.tx-primary { color: var(--primary) !important; }
+.tx-secondary { color: var(--secondary) !important; }
+.tx-white { color: var(--white) !important; }
+.tx-info { color: var(--info) !important; }
+.tx-error { color: var(--error) !important; }
+.tx-warning { color: var(--warning) !important; }
+.tx-success { color: var(--success) !important; }
+.tx-muted { color: var(--muted) !important; }
+.tx-t-1 { color: var(--tx-1) !important; }
+.tx-t-0 { color: var(--tx-0) !important; }
+.bd-solid { border-style: solid; }
+.bd-collapse { border-collapse: collapse; }
+.bd-primary { border-color: var(--primary) !important; }
+.bd-secondary { border-color: var(--secondary) !important; }
+.bd-info { border-color: var(--info) !important; }
+.bd-error { border-color: var(--error) !important; }
+.bd-warning { border-color: var(--warning) !important; }
+.bd-success { border-color: var(--success) !important; }
+.bd-muted { border-color: var(--muted) !important; }
+.bd-t-2 { border-color: var(--bd-2) !important; }
+.bd-t-1 { border-color: var(--bd-1) !important; }
+.bd-h-333333 { border-color: #333333; }
+.bdb-0 { border-bottom-width: 0px; }
+.bdb-1 { border-bottom-width: 1px; }
+.bdl-0 { border-left-width: 0px; }
+.bdl-1 { border-left-width: 1px; }
+.bdr-1 { border-right-width: 1px; }
+.bdt-0 { border-top-width: 0px; }
+.bdt-1 { border-top-width: 1px; }
+.bdx-0 { border-left-width: 0px; border-right-width: 0px; }
+.bdx-1 { border-left-width: 1px; border-right-width: 1px; }
+.bdy-0 { border-top-width: 0px; border-bottom-width: 0px; }
+.curved { border-radius: 4px; }
+.rounded { border-radius: 12px; }
+.pill { border-radius: 10000px; }
+.curve-t-sm { border-radius: 4px 4px 0 0; }
+.m-0 { margin: 0px; }
+.m-0 { margin: 0px; }
+.m-60 { margin: 60px; }
+.mb-0 { margin-bottom: 0px; }
+.mb-100 { margin-bottom: 100px; }
+.mb-20 { margin-bottom: 20px; }
+.ml-10 { margin-left: 10px; }
+.ml-5 { margin-left: 5px; }
+.ml-2 { margin-left: 2px; }
+.mr-10 { margin-right: 10px; }
+.mt-0 { margin-top: 0px; }
+.mt-20 { margin-top: 20px; }
+.my-40 { margin-top: 40px; margin-bottom: 40px; }
+.p-5 { padding: 5px; }
+.p-0 { padding: 0px; }
+.p-60 { padding: 60px; }
+.p-16 { padding: 16px; }
+.p-10 { padding: 10px; }
+.p-45 { padding: 45px; }
+.p-10 { padding: 10px; }
+.pb-10 { padding-bottom: 10px; }
+.pb-20 { padding-bottom: 20px; }
+.pl-10 { padding-left: 10px; }
+.pl-5 { padding-left: 5px; }
+.pl-15 { padding-left: 15px; }
+.pr-10 { padding-right: 10px; }
+.pr-5 { padding-right: 5px; }
+.pt-20 { padding-top: 20px; }
+.pt-40 { padding-top: 40px; }
+.pt-5 { padding-top: 5px; }
+.pt-10 { padding-top: 10px; }
+.px-20 { padding-left: 20px; padding-right: 20px; }
+.px-10 { padding-left: 10px; padding-right: 10px; }
+.py-15 { padding-top: 15px; padding-bottom: 15px; }
+.py-5 { padding-top: 5px; padding-bottom: 5px; }
+.py-10 { padding-top: 10px; padding-bottom: 10px; }
+.py-20 { padding-top: 20px; padding-bottom: 20px; }
+.py-40 { padding-top: 40px; padding-bottom: 40px; }
+.cursor-pointer { cursor: pointer; }
+.transition-500 { transition: 500ms; }
+.shadow-0-0-10-0-0-0-5 { box-shadow: 0px 0px 10px rgb(0, 0, 0, 0.5); }
+@media (max-width: 767px) {
+  .md-inline-block { display: inline-block; }
+  .md-left-0 { left: 0px; }
+  .md-left-226 { left: 226px; }
+  .md-left--226 { left: -226px; }
+  .md-right--200 { right: -200px; }
+  .md-right-0 { right: 0px; }
+  .md-right-200 { right: 200px; }
+}
\ No newline at end of file
diff --git a/docs/build/client/a67341498153885a2fc0.html b/docs/build/client/a67341498153885a2fc0.html
index 09e4a04..a6fb98d 100644
--- a/docs/build/client/a67341498153885a2fc0.html
+++ b/docs/build/client/a67341498153885a2fc0.html
@@ -18,195 +18,267 @@
   
   
   
-  
+  
   
   
   
   
 
-  
-    

-  
-  
-    Temple Logo
-  
-  
Temple

-  
+      
+        
+          

+            On this page
+          

+          
+        
+      
+      
+        
+          

+            Getting Started
+          

+
+          
+            To try out Temple, run the following commands in terminal: 
+          
+          
+            
+              npm init -y && npm install --save @ossph/temple && npm install --save-dev ts-node typescript @types/node
+            
+          
+          
+            
+            Recommended:
+            Download the Temple editor plugin at the Visual Studio Marketplace.
+          
+          
+            Create a server file called
+            src/index.ts 
+            with the following code that uses the compiler.
+          
+
+          
+            
+              import temple from '@ossph/temple/compiler';
+              // make a temple compiler
+              const compiler = temple();
+              // render HTML
+              compiler.render('./src/page.dtml').then(console.log);
+              // render CSS
+              compiler.styles('./src/page.dtml').then(console.log);
+              // render JS
+              compiler.client('./src/page.dtml').then(console.log);
+            
+          
+          
+            Last, create a document file called
+            src/page.dtml 
+            with the following template code.
+          
+          
+            
+              <style>
+                .center { text-align: center; }
+              </style>
+              <script>
+                import { env } from '@ossph/temple';
+                const { BUILD_ID, APP_DATA } = env();
+                const title = 'Hello World';
+              </script>
+              <html>
+                <head>
+                  <title>{title}</title>
+                  <link rel="stylesheet" type="text/css" href={`/build/${BUILD_ID}.css`} />
+                  <script data-app={APP_DATA} src={`/build/${BUILD_ID}.js`}></script>
+                </head>
+                <body>
+                  <h1 class="center">{title}</h1>
+                </body>
+              </html>
+            
+          
+          
+            To try out the basic implementation of Temple and see the 
+            results, just run the following command in terminal.
+          
+          
+            
+              npx ts-node src/index.ts
+            
+          
+
+          
+          

+            1. Add HTTP
+          

+
+          
+            In most cases Temple will be used to render a front end from 
+            a server framework. In this example, we will use the native
+            NodeJS HTTP module to create a server that renders a page
+            using Temple. Start by replacing the 
+            'src/index.ts'
+            file with the following code. 
+          
+
+          
+            
+            Optional: You can also check your other 
+            files to make sure you are following along.
+          
+
+          
+            
+              

+                
+                  src/index.ts
+                
+                
+                  src/page.dtml
+                
+                
+                  package.json
+                
+              

+            
+            
+              

+                
+                src
+              

+              
+                
+                index.ts
               
-              
-                src/page.dtml
+              
+                
+                page.dtml
               
-              
+              
+                
                 package.json
               
-            
-          
-          

-            

-              
-              src
-            

-            
-              
-              index.ts
-            
-            
-              
-              page.dtml
-            
-            
-              
-              package.json
-            
-          

-          

-            

-              
+            
+            
+              
                 import http from 'http';
                 import temple from '@ossph/temple/compiler';
 
@@ -235,7 +307,7 @@ 

                 // listen on port 3000
                 server.listen(3000);
               
-              

-          

-        
-
-        
-          To run your first Temple web app, just run the following 
-          command in terminal.
-        
-        
-          
-            npx ts-node src/index.ts
-          
-        
-
-        
-          You can now check 
-          http://localhost:3000/ 
-          in your browser to see your Temple application. The 
-          temple() 
-          function takes in the following options, all of 
-          which are optional.
-        
-
-        
-
-        
-          The example above also uses two rendering methods
-          async compiler.asset() which 
-          returns the rendered source code of a build file and 
-          async compiler.render() which
-          returns the rendered source code of a template file.
-          The compiler provides several other methods for
-          generating source code in JavaScript, CSS, and HTML.
-        
-
-        
-
-        
-        
2. Add Developer Tools

-
-        
-          Temple provides a separate package for a better development 
-          experience when working with server frameworks that utilize 
-          the native http module. Start by installing adding 
-          @ossph/temple-dev
-          to your project.
-        
-        
-          
-            npm install --save-dev @ossph/temple-dev
-          
-        
-        
-          Next, import the dev() 
-          function from the package and use it in your existing 
-          src/index.ts 
-          file to create a development server as shown in the example below.
-        
-        
-          
-            // ...
-            import { dev } from '@ossph/temple-dev';
-            // ...create temple compiler...
-            // 1. create dev tools
-            const { router, refresh } = dev();
-
-            const server = http.createServer(async (req, res) => {
-              // 2. Add dev router
-              if (router(req, res)) return;
-
-              if (req.url?.startsWith('/build/')) {
-                // ...
-              } else if (req.url === '/') {
-                // 3. sync builder with refresh server
-                refresh.sync(compiler.fromSource('./src/page.dtml'));
-                // ... compile and send response ...
-              }
-            });
-            //...listen on port 3000...
-          
-        
-        
-          The dev() export 
-          from  @ossph/temple-dev
-          exports tools that supports development mode and accepts the 
-          following options.
-        
-
-        
-
-        
-          This returns several tools you can use in your server app.
-        
-
-        
-
-        
-          Lastly, update the document file 
-          src/page.dtml 
-          to include the development script 
-          <script src="/dev.js"></script> 
-          as shown below.
-        
-        
-          
-            <style>
-              /* ... */
-            </style>
-            <script>
-              //... 
-            </script>
-            <html>
-              <head>
-                <!-- ... -->
-                <!-- 4. include dev script -->
-                <script src="/dev.js"></script>
-              </head>
-              <body>
-                <!-- ... -->
-              </body>
-            </html>
-          
-        
-
-        
-          The project should now look like the example below.
-        
-
-        
-          

-            

-              
-                src/index.ts
+            
+          
+
+          
+            To run your first Temple web app, just run the following 
+            command in terminal.
+          
+          
+            
+              npx ts-node src/index.ts
+            
+          
+
+          
+            You can now check 
+            http://localhost:3000/ 
+            in your browser to see your Temple application. The 
+            temple() 
+            function takes in the following options, all of 
+            which are optional.
+          
+
+          
+
+          
+          

+            2. Add Developer Tools
+          

+
+          
+            Temple provides a separate package for a better development 
+            experience when working with server frameworks that utilize 
+            the native http module. Start by installing adding 
+            @ossph/temple-dev
+            to your project.
+          
+          
+            
+              npm install --save-dev @ossph/temple-dev
+            
+          
+          
+            Next, import the dev() 
+            function from the package and use it in your existing 
+            src/index.ts 
+            file to create a development server as shown in the example below.
+          
+          
+            
+              // ...
+              import { dev } from '@ossph/temple-dev';
+              // ...create temple compiler...
+              // 1. create dev tools
+              const { router, refresh } = dev();
+
+              const server = http.createServer(async (req, res) => {
+                // 2. Add dev router
+                if (router(req, res)) return;
+
+                if (req.url?.startsWith('/build/')) {
+                  // ...
+                } else if (req.url === '/') {
+                  // 3. sync builder with refresh server
+                  refresh.sync(compiler.fromSource('./src/page.dtml'));
+                  // ... compile and send response ...
+                }
+              });
+              //...listen on port 3000...
+            
+          
+          
+            The dev() export 
+            from  @ossph/temple-dev
+            exports tools that supports development mode and accepts the 
+            following options.
+          
+
+          
+
+          
+            This returns several tools you can use in your server app.
+          
+
+          
+
+          
+            Lastly, update the document file 
+            src/page.dtml 
+            to include the development script 
+            <script src="/dev.js"></script> 
+            as shown below.
+          
+          
+            
+              <style>
+                /* ... */
+              </style>
+              <script>
+                //... 
+              </script>
+              <html>
+                <head>
+                  <!-- ... -->
+                  <!-- 4. include dev script -->
+                  <script src="/dev.js"></script>
+                </head>
+                <body>
+                  <!-- ... -->
+                </body>
+              </html>
+            
+          
+
+          
+            The project should now look like the example below.
+          
+
+          
+            
+              

+                
+                  src/index.ts
+                
+                
+                  src/page.dtml
+                
+                
+                  package.json
+                
+              

+            
+            
+              

+                
+                src
+              

+              
+                
+                index.ts
               
-              
-                src/page.dtml
+              
+                
+                page.dtml
               
-              
+              
+                
                 package.json
               
-            

-          

-          

-            

-              
-              src
-            

-            
-              
-              index.ts
-            
-            
-              
-              page.dtml
-            
-            
-              
-              package.json
-            
-          

-          

-            

-              
+            
+            
+              
                 import http from 'http';
                 import temple from '@ossph/temple/compiler';
                 import { dev } from '@ossph/temple-dev';
@@ -465,7 +525,7 @@ 

                 });
                 server.listen(3000);
               
-              

-          

-        
-
-        
-          Re-run the following command in terminal. It shouldn't look 
-          like anything has changed, but the development server is now
-          running in the background. Try to change
-          src/page.dtml.
-        
-        
-          
-            npx ts-node src/index.ts
-          
-        
-        
-          Whenever src/page.dtml 
-          is saved, the development server will automatically refresh 
-          the page. Components will also be updated in real-time without
-          the page reloading.
-        
-
-        
-        
3. Add Cache Files

-
-        
-          Temple has an out-of-the-box cache and build strategy that
-          can be used to store and serve pre-compiled files. To use the
-          cache, you just need to import it from the 
-          @ossph/temple/compiler 
-          module and use it like the following example.
-        
-
-        
-          
-            // ...
-            import path from 'path';
-            import { cache } from '@ossph/temple/compiler';
-            // ...create temple compiler...
-            // 1. use cache
-            compiler.use(cache({
-              buildPath: path.join(__dirname, '../build')
-            }));
-            // ...create dev tools...
-            // ...create http server...
-            // ...listen on port 3000...
-          
-        
-
-        
-          The src/index.ts 
-          file should now look like the example below.
-        
-
-        
-          
-            import path from 'path';
-            import http from 'http';
-            import temple, { cache } from '@ossph/temple/compiler';
-            import { dev } from '@ossph/temple-dev';
-
-            const compiler = temple();
-            // 1. use cache
-            compiler.use(cache({
-              buildPath: path.join(__dirname, '../build')
-            }));
-            const { router, refresh } = dev();
-            const server = http.createServer(async (req, res) => {
-              if (router(req, res)) return;
-              if (req.url?.startsWith('/build/')) {
-                const filename = req.url.substring(7);
-                const { type, content } = await compiler.asset(filename);
-                res.writeHead(200, { 'Content-Type': type });
-                return res.end(content);
-              } else if (req.url === '/') {
-                refresh.sync(compiler.fromSource('./src/page.dtml'));
-                res.writeHead(200, { 'Content-Type': 'text/html' });
-                return res.end(await compiler.render('./src/page.dtml', {
-                  title: 'Hello World'
-                }));
-              }
-            });
-            server.listen(3000);
-          
-        
-
-        
-          Re-run the following command in terminal to start the cache 
-          server.
-        
-        
-          
-            npx ts-node src/index.ts
-          
-        
-        
-          Load 
-          http://localhost:3000/ 
-          in your browser. After loading you should see files that were 
-          generated in a new build folder found in your project root. 
-          The cache() plugin is 
-          just a wrapper that listens for build related events and
-          stores the generated files in the specified build path.
-        
-
-        
-          
-            emitter.on('manifest-resolved', (event: Event<string>) => {
-              const manifest = event.params.manifest as Manifest
-              //write the manifest to the file system
-              writeFile(paths.manifest, manifest.toJson());
-            });
-
-            // on pre render, try to use cache if live
-            emitter.on('render', (event: Event<string>) => {
-              //if not live, dont retrieve from cache
-              if (environment !== 'production') return;
-              //extract props and builder from params
-              const props = (event.params.props || {}) as Hash;
-              const builder = event.params.builder as Builder;
-              //get fs and id ie. abc123c
-              const { fs, id } = builder.document;
-              //get cache file path ie. /path/to/docs/build/client/abc123c.js
-              const cache = path.join(paths.build, 'server', `${id}.js`);
-              //if production and cache file exists
-              if (fs.existsSync(cache)) {
-                //get the build object
-                const build = compiler.fromCache(cache);
-                //render the document
-                const html = build.document.render(props);
-                //return the cached content
-                event.set(html);
-              }
-            });
-
-            // on post render, cache (dev and live)
-            emitter.on('rendered', (event: Event<string>) => {
-              //extract build and builder from params
-              const builder = event.params.builder as Builder;
-              const html = event.params.html as string;
-              //get fs and id ie. abc123c
-              const { id } = builder.document;
-              //get cache file path ie. /path/to/docs/build/client/abc123c.html
-              const cache = path.join(paths.build, 'client', `${id}.html`);
-              //write the server source code to cache
-              writeFile(cache, html);
-            });
-
-            // on pre client build, try to use cache if live
-            emitter.on('build-client', (event: Event<string>) => {
-              //if not live, dont retrieve from cache
-              if (environment !== 'production') return;
-              //extract builder from params
-              const builder = event.params.builder as Builder;
-              //get fs and id ie. abc123c
-              const id = builder.document.id;
-              //get cache file path ie. /path/to/docs/build/client/abc123c.js
-              const cache = path.join(paths.build, 'client', `${id}.js`);
-              //if cache file exists, send it
-              if (fs.existsSync(cache)) {
-                event.set(fs.readFileSync(cache, 'utf8'));
+            
+          
+
+          
+            Re-run the following command in terminal. It shouldn't look 
+            like anything has changed, but the development server is now
+            running in the background. Try to change
+            src/page.dtml.
+          
+          
+            
+              npx ts-node src/index.ts
+            
+          
+          
+            Whenever src/page.dtml 
+            is saved, the development server will automatically refresh 
+            the page. Components will also be updated in real-time without
+            the page reloading.
+          
+
+          
+          

+            3. Add Cache Files
+          

+
+          
+            Temple has an out-of-the-box cache and build strategy that
+            can be used to store and serve pre-compiled files. To use the
+            cache, you just need to import it from the 
+            @ossph/temple/compiler 
+            module and use it like the following example.
+          
+
+          
+            
+              // ...
+              import path from 'path';
+              import { cache } from '@ossph/temple/compiler';
+              // ...create temple compiler...
+              // 1. use cache
+              compiler.use(cache({
+                buildPath: path.join(__dirname, '../build')
+              }));
+              // ...create dev tools...
+              // ...create http server...
+              // ...listen on port 3000...
+            
+          
+
+          
+            The src/index.ts 
+            file should now look like the example below.
+          
+
+          
+            
+              import path from 'path';
+              import http from 'http';
+              import temple, { cache } from '@ossph/temple/compiler';
+              import { dev } from '@ossph/temple-dev';
+
+              const compiler = temple();
+              // 1. use cache
+              compiler.use(cache({
+                buildPath: path.join(__dirname, '../build')
+              }));
+              const { router, refresh } = dev();
+              const server = http.createServer(async (req, res) => {
+                if (router(req, res)) return;
+                if (req.url?.startsWith('/build/')) {
+                  const filename = req.url.substring(7);
+                  const { type, content } = await compiler.asset(filename);
+                  res.writeHead(200, { 'Content-Type': type });
+                  return res.end(content);
+                } else if (req.url === '/') {
+                  refresh.sync(compiler.fromSource('./src/page.dtml'));
+                  res.writeHead(200, { 'Content-Type': 'text/html' });
+                  return res.end(await compiler.render('./src/page.dtml', {
+                    title: 'Hello World'
+                  }));
+                }
+              });
+              server.listen(3000);
+            
+          
+
+          
+            Re-run the following command in terminal to start the cache 
+            server.
+          
+          
+            
+              npx ts-node src/index.ts
+            
+          
+          
+            Load 
+            http://localhost:3000/ 
+            in your browser. After loading you should see files that were 
+            generated in a new build folder found in your project root. 
+            The cache() plugin is 
+            just a wrapper that listens for build related events and
+            stores the generated files in the specified build path.
+          
+
+          
+            
+              emitter.on('manifest-resolved', (event: Event<string>) => {
+                const manifest = event.params.manifest as Manifest
+                //write the manifest to the file system
+                writeFile(paths.manifest, manifest.toJson());
+              });
+
+              // on pre render, try to use cache if live
+              emitter.on('render', (event: Event<string>) => {
+                //if not live, dont retrieve from cache
+                if (environment !== 'production') return;
+                //extract props and builder from params
+                const props = (event.params.props || {}) as Hash;
+                const builder = event.params.builder as Builder;
+                //get fs and id ie. abc123c
+                const { fs, id } = builder.document;
+                //get cache file path ie. /path/to/docs/build/client/abc123c.js
+                const cache = path.join(paths.build, 'server', `${id}.js`);
+                //if production and cache file exists
+                if (fs.existsSync(cache)) {
+                  //get the build object
+                  const build = compiler.fromCache(cache);
+                  //render the document
+                  const html = build.document.render(props);
+                  //return the cached content
+                  event.set(html);
+                }
+              });
+
+              // on post render, cache (dev and live)
+              emitter.on('rendered', (event: Event<string>) => {
+                //extract build and builder from params
+                const builder = event.params.builder as Builder;
+                const html = event.params.html as string;
+                //get fs and id ie. abc123c
+                const { id } = builder.document;
+                //get cache file path ie. /path/to/docs/build/client/abc123c.html
+                const cache = path.join(paths.build, 'client', `${id}.html`);
+                //write the server source code to cache
+                writeFile(cache, html);
+              });
+
+              // on pre client build, try to use cache if live
+              emitter.on('build-client', (event: Event<string>) => {
+                //if not live, dont retrieve from cache
+                if (environment !== 'production') return;
+                //extract builder from params
+                const builder = event.params.builder as Builder;
+                //get fs and id ie. abc123c
+                const id = builder.document.id;
+                //get cache file path ie. /path/to/docs/build/client/abc123c.js
+                const cache = path.join(paths.build, 'client', `${id}.js`);
+                //if cache file exists, send it
+                if (fs.existsSync(cache)) {
+                  event.set(fs.readFileSync(cache, 'utf8'));
+                }
+              });
+
+              // on post client build, cache (dev and live)
+              emitter.on('built-client', (event: Event<string>) => {
+                //extract builder and sourcecode from params
+                const builder = event.params.builder as Builder;
+                const sourceCode = event.params.sourceCode as string;
+                //get fs and id ie. abc123c
+                const id = builder.document.id;
+                //get cache file path ie. /path/to/docs/build/client/abc123c.js
+                const cache = path.join(paths.build, 'client', `${id}.js`);
+                //write the client source code to cache
+                writeFile(cache, sourceCode);
+              });
+
+              // on pre markup build, try to use cache if live
+              emitter.on('build-markup', /* ... */);
+              //on post markup build, cache (dev and live)
+              emitter.on('built-markup', /* ... */);
+              //on pre server build, try to use cache if live
+              emitter.on('build-server', /* ... */);
+              //on post server build, cache (dev and live)
+              emitter.on('built-server', /* ... */);
+              //on pre styles build, try to use cache if live
+              emitter.on('build-styles', /* ... */);
+              //on post styles build, cache (dev and live)
+              emitter.on('built-styles', /* ... */);
+
+              // Initialize: if there's a manifest
+              if (fs.existsSync(paths.manifest)) {
+                //load the manifest file
+                compiler.manifest.load(
+                  JSON.parse(fs.readFileSync(paths.manifest, 'utf-8'))
+                );
               }
-            });
-
-            // on post client build, cache (dev and live)
-            emitter.on('built-client', (event: Event<string>) => {
-              //extract builder and sourcecode from params
-              const builder = event.params.builder as Builder;
-              const sourceCode = event.params.sourceCode as string;
-              //get fs and id ie. abc123c
-              const id = builder.document.id;
-              //get cache file path ie. /path/to/docs/build/client/abc123c.js
-              const cache = path.join(paths.build, 'client', `${id}.js`);
-              //write the client source code to cache
-              writeFile(cache, sourceCode);
-            });
-
-            // on pre markup build, try to use cache if live
-            emitter.on('build-markup', /* ... */);
-            //on post markup build, cache (dev and live)
-            emitter.on('built-markup', /* ... */);
-            //on pre server build, try to use cache if live
-            emitter.on('build-server', /* ... */);
-            //on post server build, cache (dev and live)
-            emitter.on('built-server', /* ... */);
-            //on pre styles build, try to use cache if live
-            emitter.on('build-styles', /* ... */);
-            //on post styles build, cache (dev and live)
-            emitter.on('built-styles', /* ... */);
-
-            // Initialize: if there's a manifest
-            if (fs.existsSync(paths.manifest)) {
-              //load the manifest file
-              compiler.manifest.load(
-                JSON.parse(fs.readFileSync(paths.manifest, 'utf-8'))
-              );
-            }
-          
-        
-
-        
-          This means you can also use your own cache strategy by 
-          listening to the events emitted by the compiler. The
-          following table lists all the events that the compiler
-          emits during the build cycle of a document.
-        
-
-        
-
-        
-        
4. Add TailwindCSS

-
-        
-          Tailwind is an atomic CSS collection of styles that favours 
-          small, single-purpose classes with their selector names based 
-          on its visual function. It works by using a build process to
-          read your source files to generate its styles based only on 
-          what is being used. This makes using Tailwind optimal because
-          it doesn't bloat your CSS with unused styles.
-        
-
-        
-          At the same time, web components with the
-          <style> tag imply using the 
-          component's shadow DOM which will encapsulate the styles within
-          the component and not be affected by global styles. Since 
-          Tailwind in turn implies that you do not need to (necessarily) 
-          define styles, you do not need to use the shadow DOM at all if
-          you are using Tailwind.
-        
-
-        
-          
-          Warning:
-          The caveat for using TailwindCSS, means that web components 
-          using it will not be shippable to other projects that do not
-          use Tailwind. It all comes down to preference in the end.
-        
-
-        
-          Temple has a separate package called
-          @ossph/temple-tailwind
-          to use TailwindCSS with Temple. This is just another wrapper 
-          class that listens to the compiler's build events. You can 
-          install this plugin by running the following command in terminal.
-        
-
-        
-          
-            npm install --save-dev @ossph/temple-tailwind autoprefixer postcss tailwindcss
-          
-        
-
-        
-          Next, in src/index.ts
-          import the tailwind()
-          plugin from the package and use it in the compiler as shown
-          in the example below.
-        
-
-        
-          
-            // ...
-            import { tailwind } from '@ossph/temple-tailwind';
-            // ...create temple compiler...
-            // ...use cache...
-            // 1. Use Tailwind
-            compiler.use(tailwind({
-              darkMode: 'class',
-              theme: { extend: {} },
-              plugins: [],
-              content: []
-            }));
-
-            // ...create dev tools...
-            // ...create http server...
-            // ...listen on port 3000...
-          
-        
-
-        
-          Lastly, in src/page.dtml
-          add the Tailwind directives inside the 
-          <style> tag like the code 
-          below. Also add a tailwind class, (like 
-          <style>) to the 
-          markup to verify that the plugin is working and the styles 
-          are being applied.
-        
-        
-        
-          
-            <style>
-              /* 2. Add tailwind directives */
-              @tailwind base;
-              @tailwind components;
-              @tailwind utilities;
-
-              /* ...Other styles... */
-            </style>
-            <script>
-              //... 
-            </script>
-            <html>
-              <head>
-                <!-- ... -->
-              </head>
-              <body>
-                <h1 class="text-center">{title}</h1>
-              </body>
-            </html>
-          
-        
-
-        
-          Check to see if the project files look like the example below.
-        
-
-        
-          

-            

-              
-                src/index.ts
+            
+          
+
+          
+            This means you can also use your own cache strategy by 
+            listening to the events emitted by the compiler. The
+            following table lists all the events that the compiler
+            emits during the build cycle of a document.
+          
+
+          
+
+          
+          

+            4. Add TailwindCSS
+          

+
+          
+            Tailwind is an atomic CSS collection of styles that favours 
+            small, single-purpose classes with their selector names based 
+            on its visual function. It works by using a build process to
+            read your source files to generate its styles based only on 
+            what is being used. This makes using Tailwind optimal because
+            it doesn't bloat your CSS with unused styles.
+          
+
+          
+            At the same time, web components with the
+            <style> tag imply using the 
+            component's shadow DOM which will encapsulate the styles within
+            the component and not be affected by global styles. Since 
+            Tailwind in turn implies that you do not need to (necessarily) 
+            define styles, you do not need to use the shadow DOM at all if
+            you are using Tailwind.
+          
+
+          
+            
+            Warning:
+            The caveat for using TailwindCSS, means that web components 
+            using it will not be shippable to other projects that do not
+            use Tailwind. It all comes down to preference in the end.
+          
+
+          
+            Temple has a separate package called
+            @ossph/temple-tailwind
+            to use TailwindCSS with Temple. This is just another wrapper 
+            class that listens to the compiler's build events. You can 
+            install this plugin by running the following command in terminal.
+          
+
+          
+            
+              npm install --save-dev @ossph/temple-tailwind autoprefixer postcss tailwindcss
+            
+          
+
+          
+            Next, in src/index.ts
+            import the tailwind()
+            plugin from the package and use it in the compiler as shown
+            in the example below.
+          
+
+          
+            
+              // ...
+              import { tailwind } from '@ossph/temple-tailwind';
+              // ...create temple compiler...
+              // ...use cache...
+              // 1. Use Tailwind
+              compiler.use(tailwind({
+                darkMode: 'class',
+                theme: { extend: {} },
+                plugins: [],
+                content: []
+              }));
+
+              // ...create dev tools...
+              // ...create http server...
+              // ...listen on port 3000...
+            
+          
+
+          
+            Lastly, in src/page.dtml
+            add the Tailwind directives inside the 
+            <style> tag like the code 
+            below. Also add a tailwind class, (like 
+            <style>) to the 
+            markup to verify that the plugin is working and the styles 
+            are being applied.
+          
+          
+          
+            
+              <style>
+                /* 2. Add tailwind directives */
+                @tailwind base;
+                @tailwind components;
+                @tailwind utilities;
+
+                /* ...Other styles... */
+              </style>
+              <script>
+                //... 
+              </script>
+              <html>
+                <head>
+                  <!-- ... -->
+                </head>
+                <body>
+                  <h1 class="text-center">{title}</h1>
+                </body>
+              </html>
+            
+          
+
+          
+            Check to see if the project files look like the example below.
+          
+
+          
+            
+              

+                
+                  src/index.ts
+                
+                
+                  src/page.dtml
+                
+                
+                  package.json
+                
+              

+            
+            
+              

+                
+                src
+              

+              
+                
+                index.ts
               
-              
-                src/page.dtml
+              
+                
+                page.dtml
               
-              
+              
+                
                 package.json
               
-            

-          

-          

-            

-              
-              src
-            

-            
-              
-              index.ts
-            
-            
-              
-              page.dtml
-            
-            
-              
-              package.json
-            
-          

-          

-            

-              
+            
+            
+              
                 import path from 'path';
                 import http from 'http';
                 import temple, { cache } from '@ossph/temple/compiler';
@@ -894,7 +956,7 @@ 

                 });
                 server.listen(3000);
               
-              

-          

-        
-
-        
-          Re-run the following command in terminal to initialize the 
-          tailwind plugin.
-        
-        
-          
-            npx ts-node src/index.ts
+            
+          
+
+          
+            Re-run the following command in terminal to initialize the 
+            tailwind plugin.
+          
+          
+            
+              npx ts-node src/index.ts
+            
+          
+          
+            Load 
+            http://localhost:3000/ 
+            in your browser. After loading you should see files that were 
+            generated in a new build folder found in your project root. 
+            Try to add a Tailwind class to the markup in
+            src/page.dtml and 
+            save. The development server will automatically refresh 
+            the styles and component styles will also be update in 
+            real-time without the page reloading.
+          
+
+          
+          

+            5. Add ExpressJS
+          

+
+          
+            Temple has a separate package called
+            @ossph/temple-express
+            to use Express with Temple. You can install this plugin by 
+            running the following command in terminal.
+          
+
+          
+            
+              npm install --save @ossph/temple-express express && npm install --save-dev @types/express
+            
+          
+
+          
+            The package 
+            @ossph/temple-express
+            exports two plugins for express.
+            view() is the view 
+            engine for production (live) environments. It can be used with
+            an express app like 
+            app.use(view(compiler)).
+            The other export, dev() 
+            is the same export from the Developer Tools documentation above, 
+            but returns several tools used to integrate with express.
+          
+
+          
+
+          
+            Example logic to use the all the Temple Express tools together
+            with Temple developer tools could look like the following code
+            that cases for 
+            development and 
+            production modes.
+          
+
+          
+            import { view, dev } from '@ossph/temple-express';
+
+            //create temple compiler
+            const compiler = temple({ cwd: __dirname, minify: false });
+            //create express app
+            const app = express();
+            //set the view engine to temple
+            app.set('views', path.join(__dirname, 'pages'));
+            app.set('view engine', 'dtml');
+
+            //if production (live)
+            if (process.env.NODE_ENV === 'production') {
+              //let's use express' template engine feature
+              app.engine('dtml', view(compiler));
+              //...other production settings...
+            //if development mode
+            } else {
+              //get development middleware
+              const { router, view } = dev({ cwd: __dirname });
+              //use development middleware
+              app.use(router);
+              //let's use express' template engine feature
+              app.engine('dtml', view(compiler));
+            }
           
-        
-        
-          Load 
-          http://localhost:3000/ 
-          in your browser. After loading you should see files that were 
-          generated in a new build folder found in your project root. 
-          Try to add a Tailwind class to the markup in
-          src/page.dtml and 
-          save. The development server will automatically refresh 
-          the styles and component styles will also be update in 
-          real-time without the page reloading.
-        
-
-        
-        
5. Add ExpressJS

-
-        
-          Temple has a separate package called
-          @ossph/temple-express
-          to use Express with Temple. You can install this plugin by 
-          running the following command in terminal.
-        
-
-        
-          
-            npm install --save @ossph/temple-express express && npm install --save-dev @types/express
+
+          
+            And you can now case for development mode in 
+            src/page.dtml
+            like in the example below
+          
+
+          
+            <style>
+              /* ... */
+            </style>
+            <script>
+              import { env } from '@ossph/temple';
+              const { NODE_ENV } = env();
+            </script>
+            <html>
+              <head>
+                <!-- ... -->
+                <if true={NODE_ENV !== 'production'}>
+                  <script src="/dev.js"></script>
+                </if>
+              </head>
+              <body>
+                <!-- ... -->
+              </body>
+            </html>
           
-        
-
-        
-          The package 
-          @ossph/temple-express
-          exports two plugins for express.
-          view() is the view 
-          engine for production (live) environments. It can be used with
-          an express app like 
-          app.use(view(compiler)).
-          The other export, dev() 
-          is the same export from the Developer Tools documentation above, 
-          but returns several tools used to integrate with express.
-        
-
-        
-
-        
-          Example logic to use the all the Temple Express tools together
-          with Temple developer tools could look like the following code
-          that cases for 
-          development and 
-          production modes.
-        
-
-        
-          import { view, dev } from '@ossph/temple-express';
-
-          //create temple compiler
-          const compiler = temple({ cwd: __dirname, minify: false });
-          //create express app
-          const app = express();
-          //set the view engine to temple
-          app.set('views', path.join(__dirname, 'pages'));
-          app.set('view engine', 'dtml');
-
-          //if production (live)
-          if (process.env.NODE_ENV === 'production') {
-            //let's use express' template engine feature
-            app.engine('dtml', view(compiler));
-            //...other production settings...
-          //if development mode
-          } else {
-            //get development middleware
-            const { router, view } = dev({ cwd: __dirname });
-            //use development middleware
-            app.use(router);
-            //let's use express' template engine feature
-            app.engine('dtml', view(compiler));
-          }
-        
-
-        
-          And you can now case for development mode in 
-          src/page.dtml
-          like in the example below
-        
-
-        
-          <style>
-            /* ... */
-          </style>
-          <script>
-            import { env } from '@ossph/temple';
-            const { NODE_ENV } = env();
-          </script>
-          <html>
-            <head>
-              <!-- ... -->
-              <if true={NODE_ENV !== 'production'}>
-                <script src="/dev.js"></script>
-              </if>
-            </head>
-            <body>
-              <!-- ... -->
-            </body>
-          </html>
-        
-
-        
-          Check to see if the project files look like the example below.
-        
-
-        
-          

-            

-              
-                src/index.ts
+
+          
+            Check to see if the project files look like the example below.
+          
+
+          
+            
+              

+                
+                  src/index.ts
+                
+                
+                  src/page.dtml
+                
+                
+                  package.json
+                
+              

+            
+            
+              

+                
+                src
+              

+              
+                
+                index.ts
               
-              
-                src/page.dtml
+              
+                
+                page.dtml
               
-              
+              
+                
                 package.json
               
-            

-          

-          

-            

-              
-              src
-            

-            
-              
-              index.ts
-            
-            
-              
-              page.dtml
-            
-            
-              
-              package.json
-            
-          

-          

-            

-              
+            
+            
+              
                 import path from 'path';
                 import express from 'express';
                 import temple, { cache } from '@ossph/temple/compiler';
@@ -1161,7 +1223,7 @@ 

                   console.log('HTTP server is running on http://localhost:3000');
                 });
               
-              

-          

-        
-
-        
-          Re-run the following command in terminal to initialize the 
-          re-run your application using Express.
-        
-        
-          
-            npx ts-node src/index.ts
-          
-        
-        
-          Load 
-          http://localhost:3000/ 
-          in your browser. After loading you should see everything is 
-          exactly as it was, but you now benefit from using ExpressJS.
-        
-
-        
-- Read On --

-
-        
-          To see other getting started examples with various frameworks,
-          you can check out the following project examples in the 
-          official repository.
-        
-         
-        
-          Depending on how you plan to use Temple, you can also look at 
-          the following project setups.
-        
-        
-        
-        
-      
-      

-    
+          
+          

+        
+      
+    
   
 
\ No newline at end of file
diff --git a/docs/build/client/a67341498153885a2fc0.js b/docs/build/client/a67341498153885a2fc0.js
index 3c4b240..c850089 100644
--- a/docs/build/client/a67341498153885a2fc0.js
+++ b/docs/build/client/a67341498153885a2fc0.js
@@ -1,21 +1,33 @@
-var TempleAPI=(()=>{var Rt=Object.create;var ve=Object.defineProperty;var Dt=Object.getOwnPropertyDescriptor;var Ct=Object.getOwnPropertyNames;var Pt=Object.getPrototypeOf,Mt=Object.prototype.hasOwnProperty;var C=(t,e)=>()=>(e||t((e={exports:{}}).exports,e),e.exports),Lt=(t,e)=>{for(var r in e)ve(t,r,{get:e[r],enumerable:!0})},tt=(t,e,r,l)=>{if(e&&typeof e=="object"||typeof e=="function")for(let s of Ct(e))!Mt.call(t,s)&&s!==r&&ve(t,s,{get:()=>e[s],enumerable:!(l=Dt(e,s))||l.enumerable});return t};var P=(t,e,r)=>(r=t!=null?Rt(Pt(t)):{},tt(e||!t||!t.__esModule?ve(r,"default",{value:t,enumerable:!0}):r,t)),Ot=t=>tt(ve({},"__esModule",{value:!0}),t);var Ne=C($e=>{"use strict";Object.defineProperty($e,"__esModule",{value:!0});var Ie=class extends Error{static for(e,...r){return r.forEach(function(l){e=e.replace("%s",l)}),new this(e)}static forErrorsFound(e){let r=new this("Invalid Parameters");return r.errors=e,r}static require(e,r,...l){if(!e){for(let s of l)r=r.replace("%s",s);throw new this(r)}}constructor(e,r=500){super(),this.errors={},this.start=0,this.end=0,this.message=e,this.name=this.constructor.name,this.code=r}withCode(e){return this.code=e,this}withPosition(e,r){return this.start=e,this.end=r,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};$e.default=Ie});var ie=C(se=>{"use strict";Object.defineProperty(se,"__esModule",{value:!0});se.TempleEmitter=void 0;var Te=class extends EventTarget{emit(e,r){return this.dispatchEvent(new CustomEvent(e,{detail:r})),this}on(e,r){if(e==="ready"&&document.readyState!=="loading"){let l=new CustomEvent("ready");return setTimeout(()=>r(l),1),this}return this.addEventListener(e,r),this}once(e,r){let l=s=>{this.unbind(e,l),r(s)};return this.on(e,l),this}unbind(e,r){return this.removeEventListener(e,r),this}};se.TempleEmitter=Te;var rt=new Te;document.onreadystatechange=()=>{document.readyState!=="loading"&&rt.emit("ready")};se.default=rt});var qe=C(ae=>{"use strict";var It=ae&&ae.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ae,"__esModule",{value:!0});var Be=It(ie()),He=class{get attributes(){return Object.assign({},this._attributes)}get element(){return this._element}constructor(e,r){this._element=e,this._attributes=r}hasAttribute(e){return e in this._attributes}getAttribute(e){return this._attributes[e]}removeAttribute(e,r=!1){let l=this.getAttribute(e);return typeof l>"u"?this:(delete this._attributes[e],this._element.removeAttribute(e),r||Be.default.emit("attribute-remove",{element:this,key:e,previous:l}),this)}setAttribute(e,r,l=!1){if(typeof r>"u")return this.removeAttribute(e,l);let s=this.getAttribute(e);return s===r?this:(this._attributes[e]=r,typeof r=="string"&&this._element.setAttribute(e,r),l||(typeof s>"u"?Be.default.emit("attribute-create",{element:this,key:e,value:r}):Be.default.emit("attribute-update",{element:this,key:e,value:r,previous:s})),this)}setAttributes(e,r=!1){for(let[s,m]of Object.entries(e))this.setAttribute(s,m,r);let l=Object.keys(e);for(let s of Object.keys(this._attributes))l.includes(s)||this.removeAttribute(s,r);return this}};ae.default=He});var _e=C(le=>{"use strict";var $t=le&&le.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(le,"__esModule",{value:!0});var Nt=$t(qe()),we=class{static get elements(){return this._elements}static createComponent(e,r,l,s=[]){let m=document.createElement("template");m.innerHTML=`<${e}>`;let d=m.content.querySelector(`${e}`);Object.setPrototypeOf(d,r.prototype),d.constructor=r.constructor,d.constructor.component=r.component;for(let[x,b]of Object.entries(l))typeof b=="string"?d.setAttribute(x,b):b===!0&&d.setAttribute(x,x);return d._TempleAttributes=l,d.props=l,s.forEach(x=>d.appendChild(x)),d.register(),customElements.get(e)||d.connectedCallback(),this.register(d,l)}static createElement(e,r,l=[]){let s=document.createElement(e);for(let[m,h]of Object.entries(r))typeof h=="string"?s.setAttribute(m,h):h===!0&&s.setAttribute(m,m);return l.filter(m=>typeof m<"u").forEach(m=>s.appendChild(m)),this.register(s,r)}static createText(e,r=!1){return document.createTextNode(e)}static filter(e){let r=[];return this._elements.forEach((l,s)=>{e(l,s)&&r.push(l)}),r}static get(e){return this._elements.get(e)||null}static has(e){return this._elements.has(e)}static map(e){let r=[];return this._elements.forEach((l,s)=>{r.push(e(l,s))}),r}static register(e,r){if(this.has(e))return this.get(e);let l=new Nt.default(e,r||{});return this._elements.set(e,l),l}};we._elements=new Map;le.default=we});var z=C(oe=>{"use strict";Object.defineProperty(oe,"__esModule",{value:!0});oe.TempleDataMap=void 0;var Ee=class{constructor(){window.__APP_DATA__||(window.__APP_DATA__={})}clear(){return window.__APP_DATA__={},this}delete(e){return this.has(e)?(delete window.__APP_DATA__[e],!0):!1}entries(){return Object.entries(window.__APP_DATA__)}has(e){return e in window.__APP_DATA__}get(e){return window.__APP_DATA__[e]}keys(){return Object.keys(window.__APP_DATA__)}set(e,r){return window.__APP_DATA__[e]=r,this}values(){return Object.values(window.__APP_DATA__)}};oe.TempleDataMap=Ee;var Bt=new Ee;oe.default=Bt});var st=C(ce=>{"use strict";var Je=ce&&ce.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ce,"__esModule",{value:!0});var pe=Je(_e()),Ae=Je(ie()),nt=Je(z()),ze=class t extends HTMLElement{constructor(){super(...arguments),this._initiated=!1,this._template=null,this._attributes={},this._props={},this._children=void 0,this._rendering=!1}static register(){customElements.define(this.component[0],this)}get attr(){return this._attributes}get element(){return pe.default.has(this)?pe.default.get(this):pe.default.register(this,this._TempleAttributes||{})}get metadata(){let[e,r]=this.constructor.component;return{tagname:e,classname:r}}get originalChildren(){return this._children}get initiated(){return this._initiated}get props(){return this._props}set props(e){this._props=Object.assign({},e),this._attributes=Object.fromEntries(Object.entries(e).filter(r=>typeof r[1]=="string"||r[1]===!0))}adoptedCallback(){this.render()}attributeChangedCallback(e,r,l){this.props=Object.assign(Object.assign({},this.props),{[e]:l}),this.render()}connectedCallback(){this.wait()}disconnectedCallback(){}getParentComponent(){let e=this.parentElement;for(;e;){if(e instanceof t)return e;e=e.parentElement}return null}register(){pe.default.register(this,this._props)}render(){let e=this.getParentComponent();if(e&&!e.initiated)return;if(this._rendering)return;this._rendering=!0,nt.default.set("current",this);let r=this.styles();this._template?Ae.default.emit("unmounted",this):this._template=this.template();let l=this._template().filter(Boolean);if(r.length===0)this.textContent="",l.forEach(s=>this.appendChild(s));else{this.shadowRoot||this.attachShadow({mode:"open"});let s=this.shadowRoot;this.textContent="",s.textContent="";let m=document.createElement("style");m.innerText=r,s.appendChild(m),l.forEach(h=>{var d;return(d=this.shadowRoot)===null||d===void 0?void 0:d.appendChild(h)})}return nt.default.delete("current"),this._initiated=!0,Ae.default.emit("mounted",this),this._rendering=!1,this.shadowRoot?this.shadowRoot.innerHTML:this.innerHTML}wait(){if(document.readyState!=="loading")this._update();else{let e=()=>{this._update(),Ae.default.unbind("ready",e)};Ae.default.on("ready",e)}}_toNodeList(e){return e instanceof Node?[e]:Array.isArray(e)&&e.every(r=>r instanceof Node)?e:[pe.default.createText(String(e))]}_update(){typeof this._children>"u"&&(this._children=Array.from(this.childNodes||[]));let e=this.element;e&&(this.props=Object.assign({},e.attributes),this.render()),this._initiated||this.render()}};ce.default=ze});var it=C(de=>{"use strict";var Ht=de&&de.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(de,"__esModule",{value:!0});var qt=Ht(z());function zt(t){let e=qt.default.get("env")||{};return t?e[t]||null:e}de.default=zt});var Ge=C(ue=>{"use strict";var Jt=ue&&ue.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ue,"__esModule",{value:!0});ue.default=Gt;var at=Jt(z());function Gt(t=null){return t||(t=at.default.get("current")||null),t?t==="document"?at.default.get("props")||{}:t.props:{}}});var lt=C(me=>{"use strict";var Wt=me&&me.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(me,"__esModule",{value:!0});me.default=Zt;var Ut=Wt(Ge());function Zt(t=null){return(0,Ut.default)(t).class}});var pt=C(Z=>{"use strict";var Xt=Z&&Z.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Z,"__esModule",{value:!0});Z.innerHTML=Vt;Z.default=ot;var Yt=Xt(z());function Vt(t=null){let e=ot(t),r=document.createElement("template");return r.append(...e),r.innerHTML}function ot(t=null){return t||(t=Yt.default.get("current")||null),t?t.originalChildren||[]:[]}});var ut=C(J=>{"use strict";var dt=J&&J.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(J,"__esModule",{value:!0});J.SignalRegistry=void 0;J.default=Qt;var ct=dt(Ne()),Kt=dt(z()),X=class t{static observe(e,r){let l={getter:()=>s.raw,setter:h=>h},s={raw:r,getter(h){return l.getter=h,s},setter(h){return l.setter=h,s}};Object.defineProperty(s,"value",{get(){return l.getter()},set(h){let d=l.setter(h),x=t.serialize(d)!==t.serialize(s.raw);s.raw=d,x&&e.render()}});let m=this._observers.get(e);return m?(m.observed++,m.values.push(s)):this._observers.set(e,{observed:1,values:[s]}),s}static observer(e){return this._observers.get(e)||null}static serialize(e){return JSON.stringify(e)}};J.SignalRegistry=X;X._observers=new Map;function Qt(t,e=null){if(e||(e=Kt.default.get("current")||null),!e)throw ct.default.for("Signals can only be created within a Temple component");if(!e.initiated)return X.observe(e,t);let r=X.observer(e);if(!r)throw ct.default.for("State mismatch");return r.values[r.observed++%r.values.length]}});var yt=C(je=>{"use strict";var ft=je&&je.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(je,"__esModule",{value:!0});var mt=ft(_e()),gt=ft(ie()),ht=(t,e)=>Array.from(t.querySelectorAll("*")).filter(r=>{let l=mt.default.get(r);return l&&l.hasAttribute(e)}).map(r=>mt.default.get(r));function We(t,e){gt.default.on("mounted",r=>{if(!r.detail)return;let l=r.detail;ht(l.shadowRoot||l,t).forEach(e)})}function er(t,e){gt.default.on("unmounted",r=>{if(!r.detail)return;let l=r.detail;ht(l.shadowRoot||l,t).forEach(e)})}We("mount",t=>{let e=t.getAttribute("mount");if(typeof e=="function"){let r=new CustomEvent("mount",{detail:{node:t,target:t.element}});e(r)}});er("unmount",t=>{let e=t.getAttribute("unmount");if(typeof e=="function"){let r=new CustomEvent("unmount",{detail:{node:t,target:t.element}});e(r)}});We("if",t=>{let e=t.getAttribute("if");(e===!1||e==="false"||typeof e=="function"&&!e())&&t.element.remove()});["click","dblclick","mousedown","mouseup","mousemove","mouseover","mouseout","wheel","keydown","keypress","keyup","blur","change","contextmenu","focus","input","submit","invalid","reset","search","select","copy","cut","paste","drag","dragstart","dragend","dragover","dragenter","dragleave","drop","scroll","durationchange","ended","error","loadeddata","loadedmetadata","loadstart","pause","play","playing","progress","ratechange","seeked","seeking","stalled","suspend","timeupdate","volumechange","waiting","animationstart","animationend","animationiteration","transitionend","toggle"].forEach(t=>We(t,e=>{let r=e.getAttribute(t);typeof r=="function"&&(e.element.removeEventListener(t,r),e.element.addEventListener(t,r))}))});var Ue=C(y=>{"use strict";var tr=y&&y.__createBinding||(Object.create?function(t,e,r,l){l===void 0&&(l=r);var s=Object.getOwnPropertyDescriptor(e,r);(!s||("get"in s?!e.__esModule:s.writable||s.configurable))&&(s={enumerable:!0,get:function(){return e[r]}}),Object.defineProperty(t,l,s)}:function(t,e,r,l){l===void 0&&(l=r),t[l]=e[r]}),rr=y&&y.__setModuleDefault||(Object.create?function(t,e){Object.defineProperty(t,"default",{enumerable:!0,value:e})}:function(t,e){t.default=e}),Fe=y&&y.__importStar||function(t){if(t&&t.__esModule)return t;var e={};if(t!=null)for(var r in t)r!=="default"&&Object.prototype.hasOwnProperty.call(t,r)&&tr(e,t,r);return rr(e,t),e},G=y&&y.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(y,"__esModule",{value:!0});y.SignalRegistry=y.TempleException=y.TempleEmitter=y.TempleElement=y.TempleRegistry=y.TempleComponent=y.TempleDataMap=y.emitter=y.signal=y.innerHTML=y.children=y.classnames=y.props=y.env=y.data=void 0;var nr=G(Ne());y.TempleException=nr.default;var sr=G(st());y.TempleComponent=sr.default;var ir=G(_e());y.TempleRegistry=ir.default;var ar=G(qe());y.TempleElement=ar.default;var bt=Fe(ie());y.emitter=bt.default;Object.defineProperty(y,"TempleEmitter",{enumerable:!0,get:function(){return bt.TempleEmitter}});var xt=Fe(z());y.data=xt.default;Object.defineProperty(y,"TempleDataMap",{enumerable:!0,get:function(){return xt.TempleDataMap}});var lr=G(it());y.env=lr.default;var or=G(Ge());y.props=or.default;var pr=G(lt());y.classnames=pr.default;var kt=Fe(pt());y.children=kt.default;Object.defineProperty(y,"innerHTML",{enumerable:!0,get:function(){return kt.innerHTML}});var vt=Fe(ut());y.signal=vt.default;Object.defineProperty(y,"SignalRegistry",{enumerable:!0,get:function(){return vt.SignalRegistry}});yt()});var $=C((Sr,Tt)=>{Tt.exports={...Ue()}});var wt=C((Dr,Re)=>{var cr=typeof window<"u"?window:typeof WorkerGlobalScope<"u"&&self instanceof WorkerGlobalScope?self:{};var u=function(t){var e=/(?:^|\s)lang(?:uage)?-([\w-]+)(?=\s|$)/i,r=0,l={},s={manual:t.Prism&&t.Prism.manual,disableWorkerMessageHandler:t.Prism&&t.Prism.disableWorkerMessageHandler,util:{encode:function n(i){return i instanceof m?new m(i.type,n(i.content),i.alias):Array.isArray(i)?i.map(n):i.replace(/&/g,"&").replace(/"u")return null;if("currentScript"in document)return document.currentScript;try{throw new Error}catch(p){var n=(/at [^(\r\n]*\((.*):[^:]+:[^:]+\)$/i.exec(p.stack)||[])[1];if(n){var i=document.getElementsByTagName("script");for(var o in i)if(i[o].src==n)return i[o]}return null}},isActive:function(n,i,o){for(var p="no-"+i;n;){var c=n.classList;if(c.contains(i))return!0;if(c.contains(p))return!1;n=n.parentElement}return!!o}},languages:{plain:l,plaintext:l,text:l,txt:l,extend:function(n,i){var o=s.util.clone(s.languages[n]);for(var p in i)o[p]=i[p];return o},insertBefore:function(n,i,o,p){p=p||s.languages;var c=p[n],g={};for(var k in c)if(c.hasOwnProperty(k)){if(k==i)for(var f in o)o.hasOwnProperty(f)&&(g[f]=o[f]);o.hasOwnProperty(k)||(g[k]=c[k])}var j=p[n];return p[n]=g,s.languages.DFS(s.languages,function(R,N){N===j&&R!=n&&(this[R]=g)}),g},DFS:function n(i,o,p,c){c=c||{};var g=s.util.objId;for(var k in i)if(i.hasOwnProperty(k)){o.call(i,k,i[k],p||k);var f=i[k],j=s.util.type(f);j==="Object"&&!c[g(f)]?(c[g(f)]=!0,n(f,o,null,c)):j==="Array"&&!c[g(f)]&&(c[g(f)]=!0,n(f,o,k,c))}}},plugins:{},highlightAll:function(n,i){s.highlightAllUnder(document,n,i)},highlightAllUnder:function(n,i,o){var p={callback:o,container:n,selector:'code[class*="language-"], [class*="language-"] code, code[class*="lang-"], [class*="lang-"] code'};s.hooks.run("before-highlightall",p),p.elements=Array.prototype.slice.apply(p.container.querySelectorAll(p.selector)),s.hooks.run("before-all-elements-highlight",p);for(var c=0,g;g=p.elements[c++];)s.highlightElement(g,i===!0,p.callback)},highlightElement:function(n,i,o){var p=s.util.getLanguage(n),c=s.languages[p];s.util.setLanguage(n,p);var g=n.parentElement;g&&g.nodeName.toLowerCase()==="pre"&&s.util.setLanguage(g,p);var k=n.textContent,f={element:n,language:p,grammar:c,code:k};function j(N){f.highlightedCode=N,s.hooks.run("before-insert",f),f.element.innerHTML=f.highlightedCode,s.hooks.run("after-highlight",f),s.hooks.run("complete",f),o&&o.call(f.element)}if(s.hooks.run("before-sanity-check",f),g=f.element.parentElement,g&&g.nodeName.toLowerCase()==="pre"&&!g.hasAttribute("tabindex")&&g.setAttribute("tabindex","0"),!f.code){s.hooks.run("complete",f),o&&o.call(f.element);return}if(s.hooks.run("before-highlight",f),!f.grammar){j(s.util.encode(f.code));return}if(i&&t.Worker){var R=new Worker(s.filename);R.onmessage=function(N){j(N.data)},R.postMessage(JSON.stringify({language:f.language,code:f.code,immediateClose:!0}))}else j(s.highlight(f.code,f.grammar,f.language))},highlight:function(n,i,o){var p={code:n,grammar:i,language:o};if(s.hooks.run("before-tokenize",p),!p.grammar)throw new Error('The language "'+p.language+'" has no grammar.');return p.tokens=s.tokenize(p.code,p.grammar),s.hooks.run("after-tokenize",p),m.stringify(s.util.encode(p.tokens),p.language)},tokenize:function(n,i){var o=i.rest;if(o){for(var p in o)i[p]=o[p];delete i.rest}var c=new x;return b(c,c.head,n),d(n,c,i,c.head,0),A(c)},hooks:{all:{},add:function(n,i){var o=s.hooks.all;o[n]=o[n]||[],o[n].push(i)},run:function(n,i){var o=s.hooks.all[n];if(!(!o||!o.length))for(var p=0,c;c=o[p++];)c(i)}},Token:m};t.Prism=s;function m(n,i,o,p){this.type=n,this.content=i,this.alias=o,this.length=(p||"").length|0}m.stringify=function n(i,o){if(typeof i=="string")return i;if(Array.isArray(i)){var p="";return i.forEach(function(j){p+=n(j,o)}),p}var c={type:i.type,content:n(i.content,o),tag:"span",classes:["token",i.type],attributes:{},language:o},g=i.alias;g&&(Array.isArray(g)?Array.prototype.push.apply(c.classes,g):c.classes.push(g)),s.hooks.run("wrap",c);var k="";for(var f in c.attributes)k+=" "+f+'="'+(c.attributes[f]||"").replace(/"/g,""")+'"';return"<"+c.tag+' class="'+c.classes.join(" ")+'"'+k+">"+c.content+""};function h(n,i,o,p){n.lastIndex=i;var c=n.exec(o);if(c&&p&&c[1]){var g=c[1].length;c.index+=g,c[0]=c[0].slice(g)}return c}function d(n,i,o,p,c,g){for(var k in o)if(!(!o.hasOwnProperty(k)||!o[k])){var f=o[k];f=Array.isArray(f)?f:[f];for(var j=0;j=g.reach);I+=D.value.length,D=D.next){var U=D.value;if(i.length>n.length)return;if(!(U instanceof m)){var ye=1,O;if(Ke){if(O=h(Qe,I,n,Ve),!O||O.index>=n.length)break;var be=O.index,Ft=O.index+O[0].length,B=I;for(B+=D.value.length;be>=B;)D=D.next,B+=D.value.length;if(B-=D.value.length,I=B,D.value instanceof m)continue;for(var ne=D;ne!==i.tail&&(Bg.reach&&(g.reach=Le);var ke=D.prev;Me&&(ke=b(i,ke,Me),I+=Me.length),T(i,ke,ye);var St=new m(k,N?s.tokenize(xe,N):xe,At,xe);if(D=b(i,ke,St),et&&b(i,D,et),ye>1){var Oe={cause:k+","+j,reach:Le};d(n,i,o,D.prev,I,Oe),g&&Oe.reach>g.reach&&(g.reach=Oe.reach)}}}}}}function x(){var n={value:null,prev:null,next:null},i={value:null,prev:n,next:null};n.next=i,this.head=n,this.tail=i,this.length=0}function b(n,i,o){var p=i.next,c={value:o,prev:i,next:p};return i.next=c,p.prev=c,n.length++,c}function T(n,i,o){for(var p=i.next,c=0;c/,greedy:!0},prolog:{pattern:/<\?[\s\S]+?\?>/,greedy:!0},doctype:{pattern:/"'[\]]|"[^"]*"|'[^']*')+(?:\[(?:[^<"'\]]|"[^"]*"|'[^']*'|<(?!!--)|)*\]\s*)?>/i,greedy:!0,inside:{"internal-subset":{pattern:/(^[^\[]*\[)[\s\S]+(?=\]>$)/,lookbehind:!0,greedy:!0,inside:null},string:{pattern:/"[^"]*"|'[^']*'/,greedy:!0},punctuation:/^$|[[\]]/,"doctype-tag":/^DOCTYPE/i,name:/[^\s<>'"]+/}},cdata:{pattern://i,greedy:!0},tag:{pattern:/<\/?(?!\d)[^\s>\/=$<%]+(?:\s(?:\s*[^\s>\/=]+(?:\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))|(?=[\s/>])))+)?\s*\/?>/,greedy:!0,inside:{tag:{pattern:/^<\/?[^\s>\/]+/,inside:{punctuation:/^<\/?/,namespace:/^[^\s>\/:]+:/}},"special-attr":[],"attr-value":{pattern:/=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+)/,inside:{punctuation:[{pattern:/^=/,alias:"attr-equals"},{pattern:/^(\s*)["']|["']$/,lookbehind:!0}]}},punctuation:/\/?>/,"attr-name":{pattern:/[^\s>\/]+/,inside:{namespace:/^[^\s>\/:]+:/}}}},entity:[{pattern:/&[\da-z]{1,8};/i,alias:"named-entity"},/&#x?[\da-f]{1,8};/i]};u.languages.markup.tag.inside["attr-value"].inside.entity=u.languages.markup.entity;u.languages.markup.doctype.inside["internal-subset"].inside=u.languages.markup;u.hooks.add("wrap",function(t){t.type==="entity"&&(t.attributes.title=t.content.replace(/&/,"&"))});Object.defineProperty(u.languages.markup.tag,"addInlined",{value:function(e,r){var l={};l["language-"+r]={pattern:/(^$)/i,lookbehind:!0,inside:u.languages[r]},l.cdata=/^$/i;var s={"included-cdata":{pattern://i,inside:l}};s["language-"+r]={pattern:/[\s\S]+/,inside:u.languages[r]};var m={};m[e]={pattern:RegExp(/(<__[^>]*>)(?:))*\]\]>|(?!)/.source.replace(/__/g,function(){return e}),"i"),lookbehind:!0,greedy:!0,inside:s},u.languages.insertBefore("markup","cdata",m)}});Object.defineProperty(u.languages.markup.tag,"addAttribute",{value:function(t,e){u.languages.markup.tag.inside["special-attr"].push({pattern:RegExp(/(^|["'\s])/.source+"(?:"+t+")"+/\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))/.source,"i"),lookbehind:!0,inside:{"attr-name":/^[^\s=]+/,"attr-value":{pattern:/=[\s\S]+/,inside:{value:{pattern:/(^=\s*(["']|(?!["'])))\S[\s\S]*(?=\2$)/,lookbehind:!0,alias:[e,"language-"+e],inside:u.languages[e]},punctuation:[{pattern:/^=/,alias:"attr-equals"},/"|'/]}}}})}});u.languages.html=u.languages.markup;u.languages.mathml=u.languages.markup;u.languages.svg=u.languages.markup;u.languages.xml=u.languages.extend("markup",{});u.languages.ssml=u.languages.xml;u.languages.atom=u.languages.xml;u.languages.rss=u.languages.xml;(function(t){var e=/(?:"(?:\\(?:\r\n|[\s\S])|[^"\\\r\n])*"|'(?:\\(?:\r\n|[\s\S])|[^'\\\r\n])*')/;t.languages.css={comment:/\/\*[\s\S]*?\*\//,atrule:{pattern:RegExp("@[\\w-](?:"+/[^;{\s"']|\s+(?!\s)/.source+"|"+e.source+")*?"+/(?:;|(?=\s*\{))/.source),inside:{rule:/^@[\w-]+/,"selector-function-argument":{pattern:/(\bselector\s*\(\s*(?![\s)]))(?:[^()\s]|\s+(?![\s)])|\((?:[^()]|\([^()]*\))*\))+(?=\s*\))/,lookbehind:!0,alias:"selector"},keyword:{pattern:/(^|[^\w-])(?:and|not|only|or)(?![\w-])/,lookbehind:!0}}},url:{pattern:RegExp("\\burl\\((?:"+e.source+"|"+/(?:[^\\\r\n()"']|\\[\s\S])*/.source+")\\)","i"),greedy:!0,inside:{function:/^url/i,punctuation:/^\(|\)$/,string:{pattern:RegExp("^"+e.source+"$"),alias:"url"}}},selector:{pattern:RegExp(`(^|[{}\\s])[^{}\\s](?:[^{};"'\\s]|\\s+(?![\\s{])|`+e.source+")*(?=\\s*\\{)"),lookbehind:!0},string:{pattern:e,greedy:!0},property:{pattern:/(^|[^-\w\xA0-\uFFFF])(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*(?=\s*:)/i,lookbehind:!0},important:/!important\b/i,function:{pattern:/(^|[^-a-z0-9])[-a-z0-9]+(?=\()/i,lookbehind:!0},punctuation:/[(){};:,]/},t.languages.css.atrule.inside.rest=t.languages.css;var r=t.languages.markup;r&&(r.tag.addInlined("style","css"),r.tag.addAttribute("style","css"))})(u);u.languages.clike={comment:[{pattern:/(^|[^\\])\/\*[\s\S]*?(?:\*\/|$)/,lookbehind:!0,greedy:!0},{pattern:/(^|[^\\:])\/\/.*/,lookbehind:!0,greedy:!0}],string:{pattern:/(["'])(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/,greedy:!0},"class-name":{pattern:/(\b(?:class|extends|implements|instanceof|interface|new|trait)\s+|\bcatch\s+\()[\w.\\]+/i,lookbehind:!0,inside:{punctuation:/[.\\]/}},keyword:/\b(?:break|catch|continue|do|else|finally|for|function|if|in|instanceof|new|null|return|throw|try|while)\b/,boolean:/\b(?:false|true)\b/,function:/\b\w+(?=\()/,number:/\b0x[\da-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:e[+-]?\d+)?/i,operator:/[<>]=?|[!=]=?=?|--?|\+\+?|&&?|\|\|?|[?*/~^%]/,punctuation:/[{}[\];(),.:]/};u.languages.javascript=u.languages.extend("clike",{"class-name":[u.languages.clike["class-name"],{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$A-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\.(?:constructor|prototype))/,lookbehind:!0}],keyword:[{pattern:/((?:^|\})\s*)catch\b/,lookbehind:!0},{pattern:/(^|[^.]|\.\.\.\s*)\b(?:as|assert(?=\s*\{)|async(?=\s*(?:function\b|\(|[$\w\xA0-\uFFFF]|$))|await|break|case|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally(?=\s*(?:\{|$))|for|from(?=\s*(?:['"]|$))|function|(?:get|set)(?=\s*(?:[#\[$\w\xA0-\uFFFF]|$))|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)\b/,lookbehind:!0}],function:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*(?:\.\s*(?:apply|bind|call)\s*)?\()/,number:{pattern:RegExp(/(^|[^\w$])/.source+"(?:"+(/NaN|Infinity/.source+"|"+/0[bB][01]+(?:_[01]+)*n?/.source+"|"+/0[oO][0-7]+(?:_[0-7]+)*n?/.source+"|"+/0[xX][\dA-Fa-f]+(?:_[\dA-Fa-f]+)*n?/.source+"|"+/\d+(?:_\d+)*n/.source+"|"+/(?:\d+(?:_\d+)*(?:\.(?:\d+(?:_\d+)*)?)?|\.\d+(?:_\d+)*)(?:[Ee][+-]?\d+(?:_\d+)*)?/.source)+")"+/(?![\w$])/.source),lookbehind:!0},operator:/--|\+\+|\*\*=?|=>|&&=?|\|\|=?|[!=]==|<<=?|>>>?=?|[-+*/%&|^!=<>]=?|\.{3}|\?\?=?|\?\.?|[~:]/});u.languages.javascript["class-name"][0].pattern=/(\b(?:class|extends|implements|instanceof|interface|new)\s+)[\w.\\]+/;u.languages.insertBefore("javascript","keyword",{regex:{pattern:RegExp(/((?:^|[^$\w\xA0-\uFFFF."'\])\s]|\b(?:return|yield))\s*)/.source+/\//.source+"(?:"+/(?:\[(?:[^\]\\\r\n]|\\.)*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}/.source+"|"+/(?:\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.)*\])*\])*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}v[dgimyus]{0,7}/.source+")"+/(?=(?:\s|\/\*(?:[^*]|\*(?!\/))*\*\/)*(?:$|[\r\n,.;:})\]]|\/\/))/.source),lookbehind:!0,greedy:!0,inside:{"regex-source":{pattern:/^(\/)[\s\S]+(?=\/[a-z]*$)/,lookbehind:!0,alias:"language-regex",inside:u.languages.regex},"regex-delimiter":/^\/|\/$/,"regex-flags":/^[a-z]+$/}},"function-variable":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*[=:]\s*(?:async\s*)?(?:\bfunction\b|(?:\((?:[^()]|\([^()]*\))*\)|(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)\s*=>))/,alias:"function"},parameter:[{pattern:/(function(?:\s+(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)?\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\))/,lookbehind:!0,inside:u.languages.javascript},{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$a-z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*=>)/i,lookbehind:!0,inside:u.languages.javascript},{pattern:/(\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*=>)/,lookbehind:!0,inside:u.languages.javascript},{pattern:/((?:\b|\s|^)(?!(?:as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)(?![$\w\xA0-\uFFFF]))(?:(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*)\(\s*|\]\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*\{)/,lookbehind:!0,inside:u.languages.javascript}],constant:/\b[A-Z](?:[A-Z_]|\dx?)*\b/});u.languages.insertBefore("javascript","string",{hashbang:{pattern:/^#!.*/,greedy:!0,alias:"comment"},"template-string":{pattern:/`(?:\\[\s\S]|\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}|(?!\$\{)[^\\`])*`/,greedy:!0,inside:{"template-punctuation":{pattern:/^`|`$/,alias:"string"},interpolation:{pattern:/((?:^|[^\\])(?:\\{2})*)\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}/,lookbehind:!0,inside:{"interpolation-punctuation":{pattern:/^\$\{|\}$/,alias:"punctuation"},rest:u.languages.javascript}},string:/[\s\S]+/}},"string-property":{pattern:/((?:^|[,{])[ \t]*)(["'])(?:\\(?:\r\n|[\s\S])|(?!\2)[^\\\r\n])*\2(?=\s*:)/m,lookbehind:!0,greedy:!0,alias:"property"}});u.languages.insertBefore("javascript","operator",{"literal-property":{pattern:/((?:^|[,{])[ \t]*)(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*:)/m,lookbehind:!0,alias:"property"}});u.languages.markup&&(u.languages.markup.tag.addInlined("script","javascript"),u.languages.markup.tag.addAttribute(/on(?:abort|blur|change|click|composition(?:end|start|update)|dblclick|error|focus(?:in|out)?|key(?:down|up)|load|mouse(?:down|enter|leave|move|out|over|up)|reset|resize|scroll|select|slotchange|submit|unload|wheel)/.source,"javascript"));u.languages.js=u.languages.javascript;(function(){if(typeof u>"u"||typeof document>"u")return;Element.prototype.matches||(Element.prototype.matches=Element.prototype.msMatchesSelector||Element.prototype.webkitMatchesSelector);var t="Loading\u2026",e=function(w,v){return"\u2716 Error "+w+" while fetching file: "+v},r="\u2716 Error: File does not exist or is empty",l={js:"javascript",py:"python",rb:"ruby",ps1:"powershell",psm1:"powershell",sh:"bash",bat:"batch",h:"c",tex:"latex"},s="data-src-status",m="loading",h="loaded",d="failed",x="pre[data-src]:not(["+s+'="'+h+'"]):not(['+s+'="'+m+'"])';function b(w,v,_){var n=new XMLHttpRequest;n.open("GET",w,!0),n.onreadystatechange=function(){n.readyState==4&&(n.status<400&&n.responseText?v(n.responseText):n.status>=400?_(e(n.status,n.statusText)):_(r))},n.send(null)}function T(w){var v=/^\s*(\d+)\s*(?:(,)\s*(?:(\d+)\s*)?)?$/.exec(w||"");if(v){var _=Number(v[1]),n=v[2],i=v[3];return n?i?[_,Number(i)]:[_,void 0]:[_,_]}}u.hooks.add("before-highlightall",function(w){w.selector+=", "+x}),u.hooks.add("before-sanity-check",function(w){var v=w.element;if(v.matches(x)){w.code="",v.setAttribute(s,m);var _=v.appendChild(document.createElement("CODE"));_.textContent=t;var n=v.getAttribute("data-src"),i=w.language;if(i==="none"){var o=(/\.(\w+)$/.exec(n)||[,"none"])[1];i=l[o]||o}u.util.setLanguage(_,i),u.util.setLanguage(v,i);var p=u.plugins.autoloader;p&&p.loadLanguages(i),b(n,function(c){v.setAttribute(s,h);var g=T(v.getAttribute("data-range"));if(g){var k=c.split(/\r\n?|\n/g),f=g[0],j=g[1]==null?k.length:g[1];f<0&&(f+=k.length),f=Math.max(0,Math.min(f-1,k.length)),j<0&&(j+=k.length),j=Math.max(0,Math.min(j,k.length)),c=k.slice(f,j).join(`
-`),v.hasAttribute("data-start")||v.setAttribute("data-start",String(f+1))}_.textContent=c,u.highlightElement(_)},function(c){v.setAttribute(s,d),_.textContent=c})}}),u.plugins.fileHighlight={highlight:function(v){for(var _=(v||document).querySelectorAll(x),n=0,i;i=_[n++];)u.highlightElement(i)}};var A=!1;u.fileHighlight=function(){A||(console.warn("Prism.fileHighlight is deprecated. Use `Prism.plugins.fileHighlight.highlight` instead."),A=!0),u.plugins.fileHighlight.highlight.apply(this,arguments)}})()});var W=C((Cr,_t)=>{_t.exports={...Ue()}});var fr={};Lt(fr,{BUILD_ID:()=>mr,TempleComponent:()=>F.TempleComponent,TempleElement:()=>F.TempleElement,TempleEmitter:()=>F.TempleEmitter,TempleException:()=>F.TempleException,TempleRegistry:()=>F.TempleRegistry,children:()=>F.children,components:()=>ur,data:()=>F.data,emitter:()=>F.emitter,props:()=>F.props,signal:()=>F.signal});var L=P($());var Se=P($()),Y=class extends Se.TempleComponent{static component=["main","Main_fd7f1af6410c5b5c8e1f"];styles(){return""}template(){let e=this.props,r=()=>this.originalChildren;return()=>[Se.TempleRegistry.createElement("main",{},[...this._toNodeList(r())]).element]}};var E=P($()),Ze=P(wt()),Et=P(W()),H=class extends E.TempleComponent{static component=["code","Code_6f36bc13bb6a166c7abc"];styles(){return`:host {
+var TempleAPI=(()=>{var ls=Object.create;var We=Object.defineProperty;var os=Object.getOwnPropertyDescriptor;var ps=Object.getOwnPropertyNames;var cs=Object.getPrototypeOf,ds=Object.prototype.hasOwnProperty;var N=(t,e)=>()=>(e||t((e={exports:{}}).exports,e),e.exports),us=(t,e)=>{for(var s in e)We(t,s,{get:e[s],enumerable:!0})},Ct=(t,e,s,n)=>{if(e&&typeof e=="object"||typeof e=="function")for(let r of ps(e))!ds.call(t,r)&&r!==s&&We(t,r,{get:()=>e[r],enumerable:!(n=os(e,r))||n.enumerable});return t};var T=(t,e,s)=>(s=t!=null?ls(cs(t)):{},Ct(e||!t||!t.__esModule?We(s,"default",{value:t,enumerable:!0}):s,t)),ms=t=>Ct(We({},"__esModule",{value:!0}),t);var Ae=N(gt=>{"use strict";Object.defineProperty(gt,"__esModule",{value:!0});var ht=class extends Error{static for(e,...s){return s.forEach(function(n){e=e.replace("%s",n)}),new this(e)}static forErrorsFound(e){let s=new this("Invalid Parameters");return s.errors=e,s}static require(e,s,...n){if(!e){for(let r of n)s=s.replace("%s",r);throw new this(s)}}constructor(e,s=500){super(),this.errors={},this.start=0,this.end=0,this.message=e,this.name=this.constructor.name,this.code=s}withCode(e){return this.code=e,this}withPosition(e,s){return this.start=e,this.end=s,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};gt.default=ht});var Ze=N(I=>{"use strict";var fs=I&&I.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(I,"__esModule",{value:!0});I.match=I.TempleEmitter=I.events=void 0;I.bindAttribute=W;I.unbindAttribute=Mt;var Pt=fs(Xe());I.events=["click","dblclick","mousedown","mouseup","mousemove","mouseover","mouseout","wheel","keydown","keypress","keyup","blur","change","contextmenu","focus","input","submit","invalid","reset","search","select","copy","cut","paste","drag","dragstart","dragend","dragover","dragenter","dragleave","drop","scroll","durationchange","ended","error","loadeddata","loadedmetadata","loadstart","pause","play","playing","progress","ratechange","seeked","seeking","stalled","suspend","timeupdate","volumechange","waiting","animationstart","animationend","animationiteration","transitionend","toggle"];var Ge=class extends EventTarget{emit(e,s){return this.dispatchEvent(new CustomEvent(e,{detail:s})),this}on(e,s){if(e==="ready"&&document.readyState!=="loading"){let n=new CustomEvent("ready");return setTimeout(()=>s(n),1),this}return this.addEventListener(e,s),this}once(e,s){let n=r=>{this.unbind(e,n),s(r)};return this.on(e,n),this}unbind(e,s){return this.removeEventListener(e,s),this}};I.TempleEmitter=Ge;var hs=(t,e)=>Array.from(t.querySelectorAll("*")).filter(s=>{let n=Pt.default.get(s),r=n&&n.hasAttribute(e)&&!n.hasEvent(e);return r&&n.addEvent(e),r}).map(s=>Pt.default.get(s));I.match=hs;function W(t,e){Ue.on("mounted",s=>{if(!s.detail)return;let n=s.detail;(0,I.match)(n.shadowRoot||n,t).forEach(e)})}function Mt(t,e){Ue.on("unmounted",s=>{if(!s.detail)return;let n=s.detail;(0,I.match)(n.shadowRoot||n,t).forEach(e)})}var Ue=new Ge;I.default=(document.onreadystatechange=()=>{document.readyState!=="loading"&&Ue.emit("ready")},W("mount",t=>{let e=t.getAttribute("mount");if(typeof e=="function"){let s=new CustomEvent("mount",{detail:{node:t,target:t.element}});e(s)}}),Mt("unmount",t=>{let e=t.getAttribute("unmount");if(typeof e=="function"){let s=new CustomEvent("unmount",{detail:{node:t,target:t.element}});e(s)}}),W("connect",t=>{let e=t.getAttribute("connect");if(typeof e=="function"){let s=new CustomEvent("connect",{detail:{node:t,target:t.element}});e(s)}}),W("disconnect",t=>{let e=t.getAttribute("disconnect");if(typeof e=="function"){let s=new CustomEvent("disconnect",{detail:{node:t,target:t.element}});e(s)}}),W("adopt",t=>{let e=t.getAttribute("adopt");if(typeof e=="function"){let s=new CustomEvent("adopt",{detail:{node:t,target:t.element}});e(s)}}),W("if",t=>{let e=t.getAttribute("if");(e===!1||e==="false"||typeof e=="function"&&!e())&&t.element.remove()}),I.events.forEach(t=>W(t,e=>{let s=e.getAttribute(t);typeof s=="function"&&(e.element.removeEventListener(t,s),e.element.addEventListener(t,s))})),Ue)});var xt=N(Le=>{"use strict";var gs=Le&&Le.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Le,"__esModule",{value:!0});var yt=gs(Ze()),bt=class{get attributes(){return Object.assign({},this._attributes)}get element(){return this._element}get events(){return this._events}constructor(e,s){this._events=new Set,this._element=e,this._attributes=s}addEvent(e){return this._events.add(e),this}getAttribute(e){return this._attributes[e]}hasAttribute(e){return e in this._attributes}hasEvent(e){return this._events.has(e)}removeAttribute(e,s=!1){let n=this.getAttribute(e);return typeof n>"u"?this:(delete this._attributes[e],this._element.removeAttribute(e),s||yt.default.emit("attribute-remove",{element:this,key:e,previous:n}),this)}setAttribute(e,s,n=!1){if(typeof s>"u")return this.removeAttribute(e,n);let r=this.getAttribute(e);return r===s?this:(this._attributes[e]=s,typeof s=="string"&&this._element.setAttribute(e,s),n||(typeof r>"u"?yt.default.emit("attribute-create",{element:this,key:e,value:s}):yt.default.emit("attribute-update",{element:this,key:e,value:s,previous:r})),this)}setAttributes(e,s=!1){for(let[r,u]of Object.entries(e))this.setAttribute(r,u,s);let n=Object.keys(e);for(let r of Object.keys(this._attributes))n.includes(r)||this.removeAttribute(r,s);return this}};Le.default=bt});var Xe=N(Re=>{"use strict";var ys=Re&&Re.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Re,"__esModule",{value:!0});var bs=ys(xt()),Nt=document.createElement("textarea"),xs=t=>(Nt.innerHTML=t,Nt.value),Ye=class{static get elements(){return this._elements}static createComponent(e,s,n,r=[]){let u=document.createElement("template");u.innerHTML=`<${e}>`;let d=u.content.querySelector(`${e}`);return Object.setPrototypeOf(d,s.prototype),d.constructor=s.constructor,d.constructor.component=s.component,d.register(n,r),d.element}static createElement(e,s,n=[]){let r=document.createElement(e);for(let[u,v]of Object.entries(s))typeof v=="string"?r.setAttribute(u,v):v===!0&&r.setAttribute(u,u);return n.filter(u=>typeof u<"u").forEach(u=>r.appendChild(u)),this.register(r,s)}static createText(e,s=!0){return document.createTextNode(xs(e))}static filter(e){let s=[];return this._elements.forEach((n,r)=>{e(n,r)&&s.push(n)}),s}static get(e){return this._elements.get(e)||null}static has(e){return this._elements.has(e)}static map(e){let s=[];return this._elements.forEach((n,r)=>{s.push(e(n,r))}),s}static register(e,s){if(this.has(e))return this.get(e);let n=new bs.default(e,s||{});return this._elements.set(e,n),n}};Ye._elements=new Map;Re.default=Ye});var ne=N(je=>{"use strict";Object.defineProperty(je,"__esModule",{value:!0});je.TempleDataMap=void 0;var Ve=class{constructor(){window.__APP_DATA__||(window.__APP_DATA__={})}clear(){return window.__APP_DATA__={},this}delete(e){return this.has(e)?(delete window.__APP_DATA__[e],!0):!1}entries(){return Object.entries(window.__APP_DATA__)}has(e){return e in window.__APP_DATA__}get(e){return window.__APP_DATA__[e]}keys(){return Object.keys(window.__APP_DATA__)}set(e,s){return window.__APP_DATA__[e]=s,this}values(){return Object.values(window.__APP_DATA__)}};je.TempleDataMap=Ve;var vs=new Ve;je.default=vs});var Ot=N(Se=>{"use strict";var Qe=Se&&Se.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Se,"__esModule",{value:!0});var It=Qe(Ae()),G=Qe(Xe()),U=Qe(Ze()),Ke=Qe(ne()),vt=class t extends HTMLElement{static register(){customElements.define(this.component[0],this)}get attr(){return Object.fromEntries(Array.from(this.attributes).map(e=>[e.name,e.value]))}get element(){if(!G.default.has(this))throw It.default.for("Component not mapped.");return G.default.get(this)}get metadata(){let[e,s]=this.constructor.component;return{tagname:e,classname:s}}get originalChildren(){return this._children}get initiated(){return this._initiated}get props(){return this.getAttributes()}get virtual(){return this._virtual}set props(e){this.setAttributes(e)}constructor(){if(super(),this._initiated=!1,this._template=null,this._children=void 0,this._rendering=!1,this._observer=null,this._virtual=!1,!G.default.has(this))throw It.default.for("Component not mapped.")}adoptedCallback(){this.render(),U.default.emit("adopt",this)}connectedCallback(){this.wait(),U.default.emit("connect",this)}disconnectedCallback(){U.default.emit("disconnect",this)}getAttribute(e){return this.element.getAttribute(e)}getAttributes(){return Object.assign({},this.element.attributes)}getParentComponent(){let e=this.parentElement;for(;e;){if(e instanceof t)return e;e=e.parentElement}return null}hasAttribute(e){return this.element.hasAttribute(e)}register(e={},s=[]){G.default.has(this)?G.default.get(this).setAttributes(e):G.default.register(this,e);for(let[n,r]of Object.entries(e))typeof r=="string"?super.setAttribute(n,r):r===!0&&super.setAttribute(n,n);this._children=s,this._virtual=!0,this.connectedCallback()}removeAttribute(e){this.hasAttribute(e)&&this.element.removeAttribute(e),super.hasAttribute(e)&&super.removeAttribute(e)}render(){let e=this.getParentComponent();if(e&&!e.initiated)return;if(this._rendering)return;this._rendering=!0;let s=Ke.default.get("current");Ke.default.set("current",this);let n=this.styles();this._template?U.default.emit("unmounted",this):this._template=this.template();let r=this._template().filter(Boolean);if(n.length===0)this.textContent="",r.forEach(u=>this.appendChild(u));else{this.shadowRoot||this.attachShadow({mode:"open"});let u=this.shadowRoot;this.textContent="",u.textContent="";let v=document.createElement("style");v.innerText=n,u.appendChild(v),r.forEach(d=>{var k;return(k=this.shadowRoot)===null||k===void 0?void 0:k.appendChild(d)})}return s?Ke.default.set("current",s):Ke.default.delete("current"),this._initiated=!0,this._rendering=!1,U.default.emit("mounted",this),this.shadowRoot?this.shadowRoot.innerHTML:this.innerHTML}setAttribute(e,s){this.element.setAttribute(e,s),(typeof s=="string"||s===!0)&&super.setAttribute(e,s)}setAttributes(e){this.element.setAttributes(e)}wait(){if(document.readyState!=="loading")this._update();else{let e=()=>{this._update(),U.default.unbind("ready",e)};U.default.on("ready",e)}}_toNodeList(e){return e instanceof Node?[e]:Array.isArray(e)&&e.every(s=>s instanceof Node)?e:[G.default.createText(String(e))]}_update(){typeof this._children>"u"&&(this._children=Array.from(this.childNodes||[])),this._initiated||this.render()}};Se.default=vt});var ie=N(Fe=>{"use strict";var $t=Fe&&Fe.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Fe,"__esModule",{value:!0});Fe.default=ws;var ks=$t(Ae()),Ts=$t(ne());function ws(t=null,e=!1){if(!t&&(t=Ts.default.get("current"),!t)){if(!e)throw ks.default.for("Not called within a Temple component");return null}return t}});var Ht=N(De=>{"use strict";var _s=De&&De.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(De,"__esModule",{value:!0});var Es=_s(ne());function As(t){let e=Es.default.get("env")||{};return t?e[t]||null:e}De.default=As});var kt=N(Ce=>{"use strict";var Bt=Ce&&Ce.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Ce,"__esModule",{value:!0});Ce.default=js;var Ls=Bt(ie()),Rs=Bt(ne());function js(t=null){let e=(0,Ls.default)(t,!0);return typeof e=="string"?Rs.default.get("props")||{}:e?e.props:{}}});var zt=N(ae=>{"use strict";var qt=ae&&ae.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ae,"__esModule",{value:!0});ae.classlist=Ds;ae.default=Cs;var Ss=qt(ie()),Fs=qt(kt());function Ds(t=null){var e;if(t==="body")return document.body.classList;if(t==="head")return document.head.classList;if(t==="document")return(e=document.body.parentElement)===null||e===void 0?void 0:e.classList;let s=(0,Ss.default)(t);return s?.classList}function Cs(t=null){return(0,Fs.default)(t).class}});var Jt=N(Z=>{"use strict";var Ps=Z&&Z.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Z,"__esModule",{value:!0});Z.innerHTML=Ns;Z.innerText=Is;Z.default=Tt;var Ms=Ps(ie());function Ns(t=null){let e=Tt(t),s=document.createElement("template");return s.append(...e.map(n=>n.cloneNode(!0))),s.innerHTML}function Is(t=null){let e=Tt(t),s=document.createElement("template");return s.append(...e.map(n=>n.cloneNode(!0))),s.innerText}function Tt(t=null){let e=(0,Ms.default)(t,!0);return typeof e!="string"&&e?e.originalChildren||[]:[]}});var Gt=N(X=>{"use strict";var Wt=X&&X.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(X,"__esModule",{value:!0});X.SignalRegistry=void 0;X.default=Hs;var Os=Wt(ie()),$s=Wt(Ae()),le=class t{static observe(e,s){let n={getter:()=>u.raw,setter:d=>d},r=new Set,u={raw:s,change(d){r.add(d)},getter(d){return n.getter=d,u},setter(d){return n.setter=d,u}};Object.defineProperty(u,"value",{get(){return n.getter()},set(d){let k=n.setter(d),x=t.serialize(k)!==t.serialize(u.raw);u.raw=k,x&&(r.forEach(m=>m(k)),e.render())}});let v=this._observers.get(e);return v?(v.observed++,v.values.push(u)):this._observers.set(e,{observed:1,values:[u]}),u}static observer(e){return this._observers.get(e)||null}static serialize(e){return JSON.stringify(e)}};X.SignalRegistry=le;le._observers=new Map;function Hs(t,e=null){let s=(0,Os.default)(e);if(!s.initiated)return le.observe(s,t);let n=le.observer(s);if(!n)throw $s.default.for("Signal state mismatch");return n.values[n.observed++%n.values.length]}});var _t=N(b=>{"use strict";var Bs=b&&b.__createBinding||(Object.create?function(t,e,s,n){n===void 0&&(n=s);var r=Object.getOwnPropertyDescriptor(e,s);(!r||("get"in r?!e.__esModule:r.writable||r.configurable))&&(r={enumerable:!0,get:function(){return e[s]}}),Object.defineProperty(t,n,r)}:function(t,e,s,n){n===void 0&&(n=s),t[n]=e[s]}),qs=b&&b.__setModuleDefault||(Object.create?function(t,e){Object.defineProperty(t,"default",{enumerable:!0,value:e})}:function(t,e){t.default=e}),Pe=b&&b.__importStar||function(t){if(t&&t.__esModule)return t;var e={};if(t!=null)for(var s in t)s!=="default"&&Object.prototype.hasOwnProperty.call(t,s)&&Bs(e,t,s);return qs(e,t),e},Y=b&&b.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(b,"__esModule",{value:!0});b.SignalRegistry=b.TempleException=b.TempleEmitter=b.TempleElement=b.TempleRegistry=b.TempleComponent=b.TempleDataMap=b.emitter=b.signal=b.innerHTML=b.innerText=b.children=b.classnames=b.classlist=b.props=b.env=b.data=b.component=void 0;var zs=Y(Ae());b.TempleException=zs.default;var Js=Y(Ot());b.TempleComponent=Js.default;var Ws=Y(Xe());b.TempleRegistry=Ws.default;var Gs=Y(xt());b.TempleElement=Gs.default;var Ut=Pe(Ze());b.emitter=Ut.default;Object.defineProperty(b,"TempleEmitter",{enumerable:!0,get:function(){return Ut.TempleEmitter}});var Us=Y(ie());b.component=Us.default;var Zt=Pe(ne());b.data=Zt.default;Object.defineProperty(b,"TempleDataMap",{enumerable:!0,get:function(){return Zt.TempleDataMap}});var Zs=Y(Ht());b.env=Zs.default;var Xs=Y(kt());b.props=Xs.default;var Xt=Pe(zt());b.classnames=Xt.default;Object.defineProperty(b,"classlist",{enumerable:!0,get:function(){return Xt.classlist}});var wt=Pe(Jt());b.children=wt.default;Object.defineProperty(b,"innerHTML",{enumerable:!0,get:function(){return wt.innerHTML}});Object.defineProperty(b,"innerText",{enumerable:!0,get:function(){return wt.innerText}});var Yt=Pe(Gt());b.signal=Yt.default;Object.defineProperty(b,"SignalRegistry",{enumerable:!0,get:function(){return Yt.SignalRegistry}})});var D=N((gr,Vt)=>{Vt.exports={..._t()}});var C=N((yr,Kt)=>{Kt.exports={..._t()}});var Et=N((Ar,at)=>{var Ys=typeof window<"u"?window:typeof WorkerGlobalScope<"u"&&self instanceof WorkerGlobalScope?self:{};var f=function(t){var e=/(?:^|\s)lang(?:uage)?-([\w-]+)(?=\s|$)/i,s=0,n={},r={manual:t.Prism&&t.Prism.manual,disableWorkerMessageHandler:t.Prism&&t.Prism.disableWorkerMessageHandler,util:{encode:function a(l){return l instanceof u?new u(l.type,a(l.content),l.alias):Array.isArray(l)?l.map(a):l.replace(/&/g,"&").replace(/"u")return null;if("currentScript"in document)return document.currentScript;try{throw new Error}catch(c){var a=(/at [^(\r\n]*\((.*):[^:]+:[^:]+\)$/i.exec(c.stack)||[])[1];if(a){var l=document.getElementsByTagName("script");for(var p in l)if(l[p].src==a)return l[p]}return null}},isActive:function(a,l,p){for(var c="no-"+l;a;){var o=a.classList;if(o.contains(l))return!0;if(o.contains(c))return!1;a=a.parentElement}return!!p}},languages:{plain:n,plaintext:n,text:n,txt:n,extend:function(a,l){var p=r.util.clone(r.languages[a]);for(var c in l)p[c]=l[c];return p},insertBefore:function(a,l,p,c){c=c||r.languages;var o=c[a],h={};for(var w in o)if(o.hasOwnProperty(w)){if(w==l)for(var g in p)p.hasOwnProperty(g)&&(h[g]=p[g]);p.hasOwnProperty(w)||(h[w]=o[w])}var j=c[a];return c[a]=h,r.languages.DFS(r.languages,function(P,z){z===j&&P!=a&&(this[P]=h)}),h},DFS:function a(l,p,c,o){o=o||{};var h=r.util.objId;for(var w in l)if(l.hasOwnProperty(w)){p.call(l,w,l[w],c||w);var g=l[w],j=r.util.type(g);j==="Object"&&!o[h(g)]?(o[h(g)]=!0,a(g,p,null,o)):j==="Array"&&!o[h(g)]&&(o[h(g)]=!0,a(g,p,w,o))}}},plugins:{},highlightAll:function(a,l){r.highlightAllUnder(document,a,l)},highlightAllUnder:function(a,l,p){var c={callback:p,container:a,selector:'code[class*="language-"], [class*="language-"] code, code[class*="lang-"], [class*="lang-"] code'};r.hooks.run("before-highlightall",c),c.elements=Array.prototype.slice.apply(c.container.querySelectorAll(c.selector)),r.hooks.run("before-all-elements-highlight",c);for(var o=0,h;h=c.elements[o++];)r.highlightElement(h,l===!0,c.callback)},highlightElement:function(a,l,p){var c=r.util.getLanguage(a),o=r.languages[c];r.util.setLanguage(a,c);var h=a.parentElement;h&&h.nodeName.toLowerCase()==="pre"&&r.util.setLanguage(h,c);var w=a.textContent,g={element:a,language:c,grammar:o,code:w};function j(z){g.highlightedCode=z,r.hooks.run("before-insert",g),g.element.innerHTML=g.highlightedCode,r.hooks.run("after-highlight",g),r.hooks.run("complete",g),p&&p.call(g.element)}if(r.hooks.run("before-sanity-check",g),h=g.element.parentElement,h&&h.nodeName.toLowerCase()==="pre"&&!h.hasAttribute("tabindex")&&h.setAttribute("tabindex","0"),!g.code){r.hooks.run("complete",g),p&&p.call(g.element);return}if(r.hooks.run("before-highlight",g),!g.grammar){j(r.util.encode(g.code));return}if(l&&t.Worker){var P=new Worker(r.filename);P.onmessage=function(z){j(z.data)},P.postMessage(JSON.stringify({language:g.language,code:g.code,immediateClose:!0}))}else j(r.highlight(g.code,g.grammar,g.language))},highlight:function(a,l,p){var c={code:a,grammar:l,language:p};if(r.hooks.run("before-tokenize",c),!c.grammar)throw new Error('The language "'+c.language+'" has no grammar.');return c.tokens=r.tokenize(c.code,c.grammar),r.hooks.run("after-tokenize",c),u.stringify(r.util.encode(c.tokens),c.language)},tokenize:function(a,l){var p=l.rest;if(p){for(var c in p)l[c]=p[c];delete l.rest}var o=new k;return x(o,o.head,a),d(a,o,l,o.head,0),E(o)},hooks:{all:{},add:function(a,l){var p=r.hooks.all;p[a]=p[a]||[],p[a].push(l)},run:function(a,l){var p=r.hooks.all[a];if(!(!p||!p.length))for(var c=0,o;o=p[c++];)o(l)}},Token:u};t.Prism=r;function u(a,l,p,c){this.type=a,this.content=l,this.alias=p,this.length=(c||"").length|0}u.stringify=function a(l,p){if(typeof l=="string")return l;if(Array.isArray(l)){var c="";return l.forEach(function(j){c+=a(j,p)}),c}var o={type:l.type,content:a(l.content,p),tag:"span",classes:["token",l.type],attributes:{},language:p},h=l.alias;h&&(Array.isArray(h)?Array.prototype.push.apply(o.classes,h):o.classes.push(h)),r.hooks.run("wrap",o);var w="";for(var g in o.attributes)w+=" "+g+'="'+(o.attributes[g]||"").replace(/"/g,""")+'"';return"<"+o.tag+' class="'+o.classes.join(" ")+'"'+w+">"+o.content+""};function v(a,l,p,c){a.lastIndex=l;var o=a.exec(p);if(o&&c&&o[1]){var h=o[1].length;o.index+=h,o[0]=o[0].slice(h)}return o}function d(a,l,p,c,o,h){for(var w in p)if(!(!p.hasOwnProperty(w)||!p[w])){var g=p[w];g=Array.isArray(g)?g:[g];for(var j=0;j=h.reach);q+=M.value.length,M=M.next){var re=M.value;if(l.length>a.length)return;if(!(re instanceof u)){var Be=1,B;if(St){if(B=v(Ft,q,a,jt),!B||B.index>=a.length)break;var qe=B.index,is=B.index+B[0].length,J=q;for(J+=M.value.length;qe>=J;)M=M.next,J+=M.value.length;if(J-=M.value.length,q=J,M.value instanceof u)continue;for(var Ee=M;Ee!==l.tail&&(Jh.reach&&(h.reach=mt);var Je=M.prev;ut&&(Je=x(l,Je,ut),q+=ut.length),m(l,Je,Be);var as=new u(w,z?r.tokenize(ze,z):ze,rs,ze);if(M=x(l,Je,as),Dt&&x(l,M,Dt),Be>1){var ft={cause:w+","+j,reach:mt};d(a,l,p,M.prev,q,ft),h&&ft.reach>h.reach&&(h.reach=ft.reach)}}}}}}function k(){var a={value:null,prev:null,next:null},l={value:null,prev:a,next:null};a.next=l,this.head=a,this.tail=l,this.length=0}function x(a,l,p){var c=l.next,o={value:p,prev:l,next:c};return l.next=o,c.prev=o,a.length++,o}function m(a,l,p){for(var c=l.next,o=0;o/,greedy:!0},prolog:{pattern:/<\?[\s\S]+?\?>/,greedy:!0},doctype:{pattern:/"'[\]]|"[^"]*"|'[^']*')+(?:\[(?:[^<"'\]]|"[^"]*"|'[^']*'|<(?!!--)|)*\]\s*)?>/i,greedy:!0,inside:{"internal-subset":{pattern:/(^[^\[]*\[)[\s\S]+(?=\]>$)/,lookbehind:!0,greedy:!0,inside:null},string:{pattern:/"[^"]*"|'[^']*'/,greedy:!0},punctuation:/^$|[[\]]/,"doctype-tag":/^DOCTYPE/i,name:/[^\s<>'"]+/}},cdata:{pattern://i,greedy:!0},tag:{pattern:/<\/?(?!\d)[^\s>\/=$<%]+(?:\s(?:\s*[^\s>\/=]+(?:\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))|(?=[\s/>])))+)?\s*\/?>/,greedy:!0,inside:{tag:{pattern:/^<\/?[^\s>\/]+/,inside:{punctuation:/^<\/?/,namespace:/^[^\s>\/:]+:/}},"special-attr":[],"attr-value":{pattern:/=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+)/,inside:{punctuation:[{pattern:/^=/,alias:"attr-equals"},{pattern:/^(\s*)["']|["']$/,lookbehind:!0}]}},punctuation:/\/?>/,"attr-name":{pattern:/[^\s>\/]+/,inside:{namespace:/^[^\s>\/:]+:/}}}},entity:[{pattern:/&[\da-z]{1,8};/i,alias:"named-entity"},/&#x?[\da-f]{1,8};/i]};f.languages.markup.tag.inside["attr-value"].inside.entity=f.languages.markup.entity;f.languages.markup.doctype.inside["internal-subset"].inside=f.languages.markup;f.hooks.add("wrap",function(t){t.type==="entity"&&(t.attributes.title=t.content.replace(/&/,"&"))});Object.defineProperty(f.languages.markup.tag,"addInlined",{value:function(e,s){var n={};n["language-"+s]={pattern:/(^$)/i,lookbehind:!0,inside:f.languages[s]},n.cdata=/^$/i;var r={"included-cdata":{pattern://i,inside:n}};r["language-"+s]={pattern:/[\s\S]+/,inside:f.languages[s]};var u={};u[e]={pattern:RegExp(/(<__[^>]*>)(?:))*\]\]>|(?!)/.source.replace(/__/g,function(){return e}),"i"),lookbehind:!0,greedy:!0,inside:r},f.languages.insertBefore("markup","cdata",u)}});Object.defineProperty(f.languages.markup.tag,"addAttribute",{value:function(t,e){f.languages.markup.tag.inside["special-attr"].push({pattern:RegExp(/(^|["'\s])/.source+"(?:"+t+")"+/\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))/.source,"i"),lookbehind:!0,inside:{"attr-name":/^[^\s=]+/,"attr-value":{pattern:/=[\s\S]+/,inside:{value:{pattern:/(^=\s*(["']|(?!["'])))\S[\s\S]*(?=\2$)/,lookbehind:!0,alias:[e,"language-"+e],inside:f.languages[e]},punctuation:[{pattern:/^=/,alias:"attr-equals"},/"|'/]}}}})}});f.languages.html=f.languages.markup;f.languages.mathml=f.languages.markup;f.languages.svg=f.languages.markup;f.languages.xml=f.languages.extend("markup",{});f.languages.ssml=f.languages.xml;f.languages.atom=f.languages.xml;f.languages.rss=f.languages.xml;(function(t){var e=/(?:"(?:\\(?:\r\n|[\s\S])|[^"\\\r\n])*"|'(?:\\(?:\r\n|[\s\S])|[^'\\\r\n])*')/;t.languages.css={comment:/\/\*[\s\S]*?\*\//,atrule:{pattern:RegExp("@[\\w-](?:"+/[^;{\s"']|\s+(?!\s)/.source+"|"+e.source+")*?"+/(?:;|(?=\s*\{))/.source),inside:{rule:/^@[\w-]+/,"selector-function-argument":{pattern:/(\bselector\s*\(\s*(?![\s)]))(?:[^()\s]|\s+(?![\s)])|\((?:[^()]|\([^()]*\))*\))+(?=\s*\))/,lookbehind:!0,alias:"selector"},keyword:{pattern:/(^|[^\w-])(?:and|not|only|or)(?![\w-])/,lookbehind:!0}}},url:{pattern:RegExp("\\burl\\((?:"+e.source+"|"+/(?:[^\\\r\n()"']|\\[\s\S])*/.source+")\\)","i"),greedy:!0,inside:{function:/^url/i,punctuation:/^\(|\)$/,string:{pattern:RegExp("^"+e.source+"$"),alias:"url"}}},selector:{pattern:RegExp(`(^|[{}\\s])[^{}\\s](?:[^{};"'\\s]|\\s+(?![\\s{])|`+e.source+")*(?=\\s*\\{)"),lookbehind:!0},string:{pattern:e,greedy:!0},property:{pattern:/(^|[^-\w\xA0-\uFFFF])(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*(?=\s*:)/i,lookbehind:!0},important:/!important\b/i,function:{pattern:/(^|[^-a-z0-9])[-a-z0-9]+(?=\()/i,lookbehind:!0},punctuation:/[(){};:,]/},t.languages.css.atrule.inside.rest=t.languages.css;var s=t.languages.markup;s&&(s.tag.addInlined("style","css"),s.tag.addAttribute("style","css"))})(f);f.languages.clike={comment:[{pattern:/(^|[^\\])\/\*[\s\S]*?(?:\*\/|$)/,lookbehind:!0,greedy:!0},{pattern:/(^|[^\\:])\/\/.*/,lookbehind:!0,greedy:!0}],string:{pattern:/(["'])(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/,greedy:!0},"class-name":{pattern:/(\b(?:class|extends|implements|instanceof|interface|new|trait)\s+|\bcatch\s+\()[\w.\\]+/i,lookbehind:!0,inside:{punctuation:/[.\\]/}},keyword:/\b(?:break|catch|continue|do|else|finally|for|function|if|in|instanceof|new|null|return|throw|try|while)\b/,boolean:/\b(?:false|true)\b/,function:/\b\w+(?=\()/,number:/\b0x[\da-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:e[+-]?\d+)?/i,operator:/[<>]=?|[!=]=?=?|--?|\+\+?|&&?|\|\|?|[?*/~^%]/,punctuation:/[{}[\];(),.:]/};f.languages.javascript=f.languages.extend("clike",{"class-name":[f.languages.clike["class-name"],{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$A-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\.(?:constructor|prototype))/,lookbehind:!0}],keyword:[{pattern:/((?:^|\})\s*)catch\b/,lookbehind:!0},{pattern:/(^|[^.]|\.\.\.\s*)\b(?:as|assert(?=\s*\{)|async(?=\s*(?:function\b|\(|[$\w\xA0-\uFFFF]|$))|await|break|case|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally(?=\s*(?:\{|$))|for|from(?=\s*(?:['"]|$))|function|(?:get|set)(?=\s*(?:[#\[$\w\xA0-\uFFFF]|$))|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)\b/,lookbehind:!0}],function:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*(?:\.\s*(?:apply|bind|call)\s*)?\()/,number:{pattern:RegExp(/(^|[^\w$])/.source+"(?:"+(/NaN|Infinity/.source+"|"+/0[bB][01]+(?:_[01]+)*n?/.source+"|"+/0[oO][0-7]+(?:_[0-7]+)*n?/.source+"|"+/0[xX][\dA-Fa-f]+(?:_[\dA-Fa-f]+)*n?/.source+"|"+/\d+(?:_\d+)*n/.source+"|"+/(?:\d+(?:_\d+)*(?:\.(?:\d+(?:_\d+)*)?)?|\.\d+(?:_\d+)*)(?:[Ee][+-]?\d+(?:_\d+)*)?/.source)+")"+/(?![\w$])/.source),lookbehind:!0},operator:/--|\+\+|\*\*=?|=>|&&=?|\|\|=?|[!=]==|<<=?|>>>?=?|[-+*/%&|^!=<>]=?|\.{3}|\?\?=?|\?\.?|[~:]/});f.languages.javascript["class-name"][0].pattern=/(\b(?:class|extends|implements|instanceof|interface|new)\s+)[\w.\\]+/;f.languages.insertBefore("javascript","keyword",{regex:{pattern:RegExp(/((?:^|[^$\w\xA0-\uFFFF."'\])\s]|\b(?:return|yield))\s*)/.source+/\//.source+"(?:"+/(?:\[(?:[^\]\\\r\n]|\\.)*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}/.source+"|"+/(?:\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.)*\])*\])*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}v[dgimyus]{0,7}/.source+")"+/(?=(?:\s|\/\*(?:[^*]|\*(?!\/))*\*\/)*(?:$|[\r\n,.;:})\]]|\/\/))/.source),lookbehind:!0,greedy:!0,inside:{"regex-source":{pattern:/^(\/)[\s\S]+(?=\/[a-z]*$)/,lookbehind:!0,alias:"language-regex",inside:f.languages.regex},"regex-delimiter":/^\/|\/$/,"regex-flags":/^[a-z]+$/}},"function-variable":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*[=:]\s*(?:async\s*)?(?:\bfunction\b|(?:\((?:[^()]|\([^()]*\))*\)|(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)\s*=>))/,alias:"function"},parameter:[{pattern:/(function(?:\s+(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)?\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\))/,lookbehind:!0,inside:f.languages.javascript},{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$a-z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*=>)/i,lookbehind:!0,inside:f.languages.javascript},{pattern:/(\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*=>)/,lookbehind:!0,inside:f.languages.javascript},{pattern:/((?:\b|\s|^)(?!(?:as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)(?![$\w\xA0-\uFFFF]))(?:(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*)\(\s*|\]\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*\{)/,lookbehind:!0,inside:f.languages.javascript}],constant:/\b[A-Z](?:[A-Z_]|\dx?)*\b/});f.languages.insertBefore("javascript","string",{hashbang:{pattern:/^#!.*/,greedy:!0,alias:"comment"},"template-string":{pattern:/`(?:\\[\s\S]|\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}|(?!\$\{)[^\\`])*`/,greedy:!0,inside:{"template-punctuation":{pattern:/^`|`$/,alias:"string"},interpolation:{pattern:/((?:^|[^\\])(?:\\{2})*)\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}/,lookbehind:!0,inside:{"interpolation-punctuation":{pattern:/^\$\{|\}$/,alias:"punctuation"},rest:f.languages.javascript}},string:/[\s\S]+/}},"string-property":{pattern:/((?:^|[,{])[ \t]*)(["'])(?:\\(?:\r\n|[\s\S])|(?!\2)[^\\\r\n])*\2(?=\s*:)/m,lookbehind:!0,greedy:!0,alias:"property"}});f.languages.insertBefore("javascript","operator",{"literal-property":{pattern:/((?:^|[,{])[ \t]*)(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*:)/m,lookbehind:!0,alias:"property"}});f.languages.markup&&(f.languages.markup.tag.addInlined("script","javascript"),f.languages.markup.tag.addAttribute(/on(?:abort|blur|change|click|composition(?:end|start|update)|dblclick|error|focus(?:in|out)?|key(?:down|up)|load|mouse(?:down|enter|leave|move|out|over|up)|reset|resize|scroll|select|slotchange|submit|unload|wheel)/.source,"javascript"));f.languages.js=f.languages.javascript;(function(){if(typeof f>"u"||typeof document>"u")return;Element.prototype.matches||(Element.prototype.matches=Element.prototype.msMatchesSelector||Element.prototype.webkitMatchesSelector);var t="Loading\u2026",e=function(A,y){return"\u2716 Error "+A+" while fetching file: "+y},s="\u2716 Error: File does not exist or is empty",n={js:"javascript",py:"python",rb:"ruby",ps1:"powershell",psm1:"powershell",sh:"bash",bat:"batch",h:"c",tex:"latex"},r="data-src-status",u="loading",v="loaded",d="failed",k="pre[data-src]:not(["+r+'="'+v+'"]):not(['+r+'="'+u+'"])';function x(A,y,_){var a=new XMLHttpRequest;a.open("GET",A,!0),a.onreadystatechange=function(){a.readyState==4&&(a.status<400&&a.responseText?y(a.responseText):a.status>=400?_(e(a.status,a.statusText)):_(s))},a.send(null)}function m(A){var y=/^\s*(\d+)\s*(?:(,)\s*(?:(\d+)\s*)?)?$/.exec(A||"");if(y){var _=Number(y[1]),a=y[2],l=y[3];return a?l?[_,Number(l)]:[_,void 0]:[_,_]}}f.hooks.add("before-highlightall",function(A){A.selector+=", "+k}),f.hooks.add("before-sanity-check",function(A){var y=A.element;if(y.matches(k)){A.code="",y.setAttribute(r,u);var _=y.appendChild(document.createElement("CODE"));_.textContent=t;var a=y.getAttribute("data-src"),l=A.language;if(l==="none"){var p=(/\.(\w+)$/.exec(a)||[,"none"])[1];l=n[p]||p}f.util.setLanguage(_,l),f.util.setLanguage(y,l);var c=f.plugins.autoloader;c&&c.loadLanguages(l),x(a,function(o){y.setAttribute(r,v);var h=m(y.getAttribute("data-range"));if(h){var w=o.split(/\r\n?|\n/g),g=h[0],j=h[1]==null?w.length:h[1];g<0&&(g+=w.length),g=Math.max(0,Math.min(g-1,w.length)),j<0&&(j+=w.length),j=Math.max(0,Math.min(j,w.length)),o=w.slice(g,j).join(`
+`),y.hasAttribute("data-start")||y.setAttribute("data-start",String(g+1))}_.textContent=o,f.highlightElement(_)},function(o){y.setAttribute(r,d),_.textContent=o})}}),f.plugins.fileHighlight={highlight:function(y){for(var _=(y||document).querySelectorAll(k),a=0,l;l=_[a++];)f.highlightElement(l)}};var E=!1;f.fileHighlight=function(){E||(console.warn("Prism.fileHighlight is deprecated. Use `Prism.plugins.fileHighlight.highlight` instead."),E=!0),f.plugins.fileHighlight.highlight.apply(this,arguments)}})()});var tr={};us(tr,{BUILD_ID:()=>er,TempleComponent:()=>F.TempleComponent,TempleElement:()=>F.TempleElement,TempleEmitter:()=>F.TempleEmitter,TempleException:()=>F.TempleException,TempleRegistry:()=>F.TempleRegistry,children:()=>F.children,components:()=>Qs,data:()=>F.data,emitter:()=>F.emitter,props:()=>F.props,signal:()=>F.signal});var $=T(D());var Qt=T(D()),H=T(C()),oe=class extends Qt.TempleComponent{static component=["layout","Layout_9f3ab204ce271feaf6f7"];styles(){return""}template(){(0,H.classlist)().add("relative","w-full","vh","scroll-hidden");let e=(0,H.children)(),s=e.find(m=>m.nodeName.endsWith("PANEL-MAIN")),n=e.find(m=>m.nodeName.endsWith("PANEL-HEAD")),r=e.find(m=>m.nodeName.endsWith("PANEL-FOOT")),u=e.find(m=>m.nodeName.endsWith("PANEL-LEFT")),v=e.find(m=>m.nodeName.endsWith("PANEL-RIGHT")),d={head:!!n,foot:!!r,left:!!u,right:!!v},k=new Set,x={left:!1,right:!1,change:m=>k.add(m)};return s&&H.TempleRegistry.get(s).setAttribute("show",x).setAttribute("layout",d),n&&H.TempleRegistry.get(n).setAttribute("show",x).setAttribute("layout",d),r&&H.TempleRegistry.get(r).setAttribute("show",x).setAttribute("layout",d),u&&H.TempleRegistry.get(u).setAttribute("show",x).setAttribute("layout",d),v&&H.TempleRegistry.get(v).setAttribute("show",x).setAttribute("layout",d),this.toggle=m=>{x[m]=!x[m],k.forEach(E=>E())},()=>[H.TempleRegistry.createText(`
+`,!1),...this._toNodeList(e)]}};var Me=T(D()),et=T(C()),pe=class extends Me.TempleComponent{static component=["head","Head_2bf4dff19bc88ba4138b"];styles(){return""}template(){let{layout:e,show:s}=this.element.attributes,n=(0,et.classlist)(),r=u=>{this.classList.add("absolute","top-0","right-0","h-60","transition-500"),e?.left?(this.classList.remove("left-0"),this.classList.add("left-226")):this.classList.add("left-0"),s.left?(this.classList.remove("md-left-0"),this.classList.add("md-left-226")):(this.classList.remove("md-left-226"),this.classList.add("md-left-0"))};return s.change(r),r(),()=>[Me.TempleRegistry.createText(`
+`,!1),Me.TempleRegistry.createElement("header",{class:"block w-full h-full relative"},[...this._toNodeList((0,et.children)())]).element]}};var Ne=T(D()),tt=T(C()),ce=class extends Ne.TempleComponent{static component=["left","Left_f4ab589e043eee17d229"];styles(){return""}template(){let{layout:e,show:s}=this.element.attributes,n=(0,tt.classlist)(),r=u=>{this.classList.add("w-226","absolute","bottom-0","left-0","top-0","transition-500"),s.left?(this.classList.remove("md-left--226"),this.classList.add("md-left-0")):this.classList.add("md-left--226")};return s.change(r),r(),()=>[Ne.TempleRegistry.createText(`
+`,!1),Ne.TempleRegistry.createElement("aside",{class:"block w-full h-full relative"},[...this._toNodeList((0,tt.children)())]).element]}};var Ie=T(D()),st=T(C()),de=class extends Ie.TempleComponent{static component=["right","Right_4ce97029791442c57f8d"];styles(){return""}template(){let{layout:e,show:s}=this.element.attributes,n=(0,st.classlist)(),r=u=>{this.classList.add("w-200","absolute","right-0","transition-500"),e?.foot?(this.classList.remove("bottom-0"),this.classList.add("bottom-60")):this.classList.add("bottom-0"),e?.head?(this.classList.remove("top-0"),this.classList.add("top-60")):this.classList.add("top-0"),s.right?(this.classList.remove("md-right--200"),this.classList.add("md-right-0")):this.classList.add("md-right--200")};return s.change(r),r(),()=>[Ie.TempleRegistry.createText(`
+`,!1),Ie.TempleRegistry.createElement("aside",{class:"block w-full h-full relative"},[...this._toNodeList((0,st.children)())]).element]}};var Oe=T(D()),rt=T(C()),ue=class extends Oe.TempleComponent{static component=["main","Main_847772763f4518728ede"];styles(){return""}template(){let{layout:e,show:s}=this.element.attributes,n=(0,rt.classlist)(),r=u=>{this.classList.add("absolute","transition-500"),e?.head?(this.classList.remove("top-0"),this.classList.add("top-60")):this.classList.add("top-0"),e?.foot?(this.classList.remove("bottom-0"),this.classList.add("bottom-60")):this.classList.add("bottom-0"),e?.left?(this.classList.remove("left-0"),this.classList.add("left-226")):this.classList.add("left-0"),e?.right?(this.classList.remove("right-0"),this.classList.add("right-200")):this.classList.add("right-0"),s.left?(this.classList.remove("md-left-0"),this.classList.add("md-left-226")):(this.classList.remove("md-left-226"),this.classList.add("md-left-0")),s.right?(this.classList.remove("md-right-0"),this.classList.add("md-right-200")):(this.classList.remove("md-right-200"),this.classList.add("md-right-0"))};return s.change(r),r(),()=>[Oe.TempleRegistry.createText(`
+`,!1),Oe.TempleRegistry.createElement("main",{class:"block w-full h-full relative"},[...this._toNodeList((0,rt.children)())]).element]}};var nt=T(D()),fe=T(C()),me=class extends nt.TempleComponent{static component=["alert","Alert_f0fe98801b4b833c4233"];styles(){return""}template(){let{curved:e,rounded:s,pill:n,info:r,warning:u,success:v,error:d,muted:k,primary:x,color:m,secondary:E,outline:A,transparent:y,solid:_,style:a,class:l,...p}=(0,fe.props)(),c=(0,fe.component)(),o=document.createElement("div");(0,fe.children)().forEach(w=>o.appendChild(w)),c.classList.add("block"),o.classList.add("block","p-16"),e?o.classList.add("curved"):s?o.classList.add("rounded"):n&&o.classList.add("pill");let h=A?"outline":y?"transparent":"solid";return h==="outline"||h==="transparent"?(o.classList.add("bd-solid","bd-thin"),h==="outline"&&o.classList.add("bg-white"),m?(o.style.color=m,o.style.borderColor=m):r?o.classList.add("bd-info","tx-info"):u?o.classList.add("bd-warning","tx-warning"):v?o.classList.add("bd-success","tx-success"):d?o.classList.add("bd-error","tx-error"):k?o.classList.add("bd-muted","tx-muted"):x?o.classList.add("bd-primary","tx-primary"):E&&o.classList.add("bd-secondary","tx-secondary")):(o.classList.add("tx-white"),m?o.style.backgroundColor=m:r?o.classList.add("bg-info"):u?o.classList.add("bg-warning"):v?o.classList.add("bg-success"):d?o.classList.add("bg-error"):k?o.classList.add("bg-muted"):x?o.classList.add("bg-primary"):E&&o.classList.add("bg-secondary")),()=>[nt.TempleRegistry.createText(`
+`,!1),...this._toNodeList([o])]}};var V=T(D()),ge=T(C()),he=class extends V.TempleComponent{static component=["tab","Tab_5a341768ef0a010965e3"];styles(){return""}template(){let{group:e,selector:s="",active:n="",inactive:r="",style:u,class:v,...d}=(0,ge.props)(),k=(0,ge.component)(),x=n.split(" "),m=r.split(" ");k.classList.add("cursor-pointer");let E=()=>{let y=k.hasAttribute("on");k.classList.remove(...y?m:x),k.classList.add(...y?x:m),Array.from(document.querySelectorAll(s)).forEach(_=>{_.style.display=y?"block":"none"})},A=()=>{Array.from(document.querySelectorAll(`[group="${e}"]`)).forEach(y=>{let _=y.getAttribute("selector");s===_&&!y.hasAttribute("on")?(y.setAttribute("on",""),Array.from(document.querySelectorAll(s)).forEach(a=>{a.style.display="block"}),typeof y.render=="function"&&y.render()):s!==_&&y.hasAttribute("on")&&(y.removeAttribute("on"),Array.from(document.querySelectorAll(_)).forEach(a=>{a.style.display="none"}),typeof y.render=="function"&&y.render())})};return()=>[V.TempleRegistry.createText(`
+`,!1),V.TempleRegistry.createElement("a",{...d,class:"block h-full w-full",click:A,mount:E},[V.TempleRegistry.createText(`
+  `,!1),...this._toNodeList((0,ge.children)()),V.TempleRegistry.createText(`
+`,!1)]).element]}};var $e=T(D()),it=T(C()),ye=class extends $e.TempleComponent{static component=["docs","Docs_40562a7bb56d70d971df"];styles(){return""}template(){return(0,it.classlist)().add("block","w-full","h-full","scroll-y-auto","scroll-x-hidden"),()=>[$e.TempleRegistry.createText(`
+`,!1),$e.TempleRegistry.createElement("article",{class:"block p-10 tx-t-1"},[...this._toNodeList((0,it.children)())]).element]}};var i=T(D());var L=T(D()),At=T(Et()),es=T(C()),K=class extends L.TempleComponent{static component=["code","Code_6f36bc13bb6a166c7abc"];styles(){return`:host {
     display: block;
     font-size: 14px;
     line-height: 20px;
   }
   :host([inline]) {
-    display: inline;
+    display: inline !important;
   }
   :host([inline]),
   :host([inline]) > pre,
   :host([inline]) > pre > code {
-    display: inline;
+    display: inline !important;
   }
   .snippet {
     background-color: #000000;
     color: #ABB2BF;
+    height: 100%;
     margin: 0;
+    overflow: auto;
     padding: 0;
   }
 
@@ -73,146 +85,30 @@ var TempleAPI=(()=>{var Rt=Object.create;var ve=Object.defineProperty;var Dt=Obj
 
   .terminal {
     background-color: #000000;
+    font-family: 'Courier New', Courier, monospace;
     font-size: 15px;
+    height: 100%;
+    overflow: auto;
     padding: 10px;
   }
   .terminal span {
     color: #00FF00;
-  }`}template(){let e=this.props,{lang:r="markup",numbers:l=!1,inline:s=!1,trim:m=!1,ltrim:h=!1,rtrim:d=!1,detab:x=0}=e,b=(0,Et.children)(),T=b[0]?.textContent||"";x&&(T=T.replace(new RegExp(`\\n {${x}}`,"g"),`
-`)),m?T=T.trim():h?T=T.replace(/^\s+/,""):d&&(T=T.replace(/\s+$/,""));let A=w=>{if(!T)return;let v=Ze.default.highlight(T,Ze.default.languages[r],r);if(w.detail.target.innerHTML=v,l){let _=v.match(/\n(?!$)/g),n=_?_.length+1:1,i=new Array(n+1).join(""),o=document.createElement("span");o.setAttribute("aria-hidden","true"),o.className="line-numbers-rows",o.innerHTML=i,w.detail.target.appendChild(o)}};return()=>[E.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism.min.css"}).element,E.TempleRegistry.createText(`
-`,!1),E.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism-tomorrow.min.css"}).element,E.TempleRegistry.createText(`
-`,!1),...r==="bash"?[E.TempleRegistry.createText(`
-  `,!1),E.TempleRegistry.createElement("div",{class:"terminal"},[E.TempleRegistry.createElement("span",{},[E.TempleRegistry.createText("$",!1)]).element,E.TempleRegistry.createText(" ",!1),...this._toNodeList(b)]).element,E.TempleRegistry.createText(`
-`,!1)]:T?[,E.TempleRegistry.createText(`
-  `,!1),...l?[E.TempleRegistry.createText(`
-    `,!1),E.TempleRegistry.createElement("pre",{class:"snippet line-numbers"},[E.TempleRegistry.createElement("code",{mount:A},[]).element]).element,E.TempleRegistry.createText(`
-  `,!1)]:[,E.TempleRegistry.createText(`
-    `,!1),E.TempleRegistry.createElement("pre",{class:"snippet pad"},[E.TempleRegistry.createElement("code",{mount:A},[]).element]).element,E.TempleRegistry.createText(`
-  `,!1)],E.TempleRegistry.createText(`
-`,!1)]:[]]}};var S=P($()),De=P(W()),V=class extends S.TempleComponent{static component=["app","App_05341fddbfd1fe4f273b"];styles(){return""}template(){let{title:e,panel:r}=(0,De.props)(),l=`body ${r?"panel":""}`,s=r?`height:${r}px`:"";return()=>[S.TempleRegistry.createText(`
-`,!1),S.TempleRegistry.createElement("div",{class:"window"},[S.TempleRegistry.createText(`
-  `,!1),S.TempleRegistry.createElement("div",{class:"head"},[S.TempleRegistry.createText(`
-    `,!1),S.TempleRegistry.createElement("span",{class:"dot"},[]).element,S.TempleRegistry.createText(`
-    `,!1),S.TempleRegistry.createElement("span",{class:"dot"},[]).element,S.TempleRegistry.createText(`
-    `,!1),S.TempleRegistry.createElement("span",{class:"dot"},[]).element,S.TempleRegistry.createText(`
-    `,!1),S.TempleRegistry.createElement("span",{class:"title"},[...this._toNodeList(e)]).element,S.TempleRegistry.createText(`
-  `,!1)]).element,S.TempleRegistry.createText(`
-  `,!1),S.TempleRegistry.createElement("div",{class:l,style:s},[...this._toNodeList((0,De.children)())]).element,S.TempleRegistry.createText(`
-`,!1)]).element]}};var q=P($()),Q=P(W()),K=class extends q.TempleComponent{static component=["alert","Alert_6b81bcb0566ce7f0cd2d"];styles(){return`:host {
-    --black: #222222;
-    --white: #FCFCFC;
-    --info: #1474FC;
-    --error: #DC3545;
-    --warning: #FF7B07;
-    --success: #28A745;
-    --muted: #999999;
-    --primary: #E49F1A;
-    --secondary: #DA532C;
-  }
-
-  /* Text Colors
-  ---------------------------------*/
-  .tx-white, .tx-white a {
-    color: var(--info);
-  }
-  .tx-white, .tx-white a {
-    color: var(--white);
-  }
-  .tx-error, .tx-error a {
-    color: var(--error);
-  }
-  .tx-warning, .tx-warning a {
-    color: var(--warning);
-  }
-  .tx-success, .tx-success a {
-    color: var(--success);
-  }
-  .tx-muted, .tx-muted a {
-    color: var(--muted);
-  }
-  .tx-primary, .tx-primary a {
-    color: var(--primary);
-  }
-  .tx-secondary, .tx-secondary a {
-    color: var(--secondary);
-  }
+  }`}template(){let e=this.props,{lang:s="markup",numbers:n=!1,inline:r=!1,trim:u=!1,ltrim:v=!1,rtrim:d=!1,detab:k=0}=e,x=(0,es.children)(),m=x[0]?.textContent||"";k&&(m=m.replace(new RegExp(`\\n {${k}}`,"g"),`
+`)),u?m=m.trim():v?m=m.replace(/^\s+/,""):d&&(m=m.replace(/\s+$/,""));let E=A=>{if(!m)return;let y=At.default.highlight(m,At.default.languages[s],s);if(A.detail.target.innerHTML=y,n){let _=y.match(/\n(?!$)/g),a=_?_.length+1:1,l=new Array(a+1).join(""),p=document.createElement("span");p.setAttribute("aria-hidden","true"),p.className="line-numbers-rows",p.innerHTML=l,A.detail.target.appendChild(p)}};return()=>[L.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism.min.css"}).element,L.TempleRegistry.createText(`
+`,!1),L.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism-tomorrow.min.css"}).element,L.TempleRegistry.createText(`
+`,!1),...s==="bash"?[L.TempleRegistry.createText(`
+  `,!1),L.TempleRegistry.createElement("div",{class:"terminal"},[L.TempleRegistry.createElement("span",{},[L.TempleRegistry.createText("$",!1)]).element,L.TempleRegistry.createText(" ",!1),...this._toNodeList(x)]).element,L.TempleRegistry.createText(`
+`,!1)]:m?[,L.TempleRegistry.createText(`
+  `,!1),...n?[L.TempleRegistry.createText(`
+    `,!1),L.TempleRegistry.createElement("pre",{class:"snippet line-numbers"},[L.TempleRegistry.createElement("code",{mount:E},[]).element]).element,L.TempleRegistry.createText(`
+  `,!1)]:[,L.TempleRegistry.createText(`
+    `,!1),L.TempleRegistry.createElement("pre",{class:"snippet pad"},[L.TempleRegistry.createElement("code",{mount:E},[]).element]).element,L.TempleRegistry.createText(`
+  `,!1)],L.TempleRegistry.createText(`
+`,!1)]:[,L.TempleRegistry.createText(`
+  `,!1),L.TempleRegistry.createElement("span",{},[L.TempleRegistry.createText("????",!1)]).element,L.TempleRegistry.createText(`
+`,!1)],L.TempleRegistry.createText(`
 
-  /* Borders
-  ---------------------------------*/
-  .curved {
-    border-radius: 5px;
-  }
-  .rounded {
-    border-radius:12px;
-  }
-  .pill {
-    border-radius: 10000px;
-  }
-  .solid {
-    border-style: solid;
-  }
-  .thin {
-    border-width: 1px;
-  }
-
-  .bd-info {
-    border-color: var(--info);
-  }
-  .bd-error {
-    border-color: var(--error);
-  }
-  .bd-warning {
-    border-color: var(--warning);
-  }
-  .bd-success {
-    border-color: var(--success);
-  }
-  .bd-muted {
-    border-color: var(--muted);
-  }
-  .bd-primary {
-    border-color: var(--primary);
-  }
-  .bd-secondary {
-    border-color: var(--secondary);
-  }
-
-  /* Backgrounds
-  ---------------------------------*/
-  .bg-white {
-    background-color: var(--white);
-  }
-  .bg-info {
-    background-color: var(--info);
-  }
-  .bg-error {
-    background-color: var(--error);
-  }
-  .bg-warning {
-    background-color: var(--warning);
-  }
-  .bg-success {
-    background-color: var(--success);
-  }
-  .bg-muted {
-    background-color: var(--muted);
-  }
-  .bg-primary {
-    background-color: var(--primary);
-  }
-  .bg-secondary {
-    background-color: var(--secondary);
-  }
-
-  /* Alert
-  ---------------------------------*/
-  .alert {
-    padding: 16px;
-  }`}template(){let{color:e,info:r,warning:l,success:s,error:m,muted:h,primary:d,secondary:x,solid:b,outline:T,curved:A,rounded:w,pill:v,style:_}=(0,Q.props)(),n={classes:["alert"],styles:""},i=T?"outline":"solid";A?n.classes.push("curved"):w?n.classes.push("rounded"):v&&n.classes.push("pill"),i==="outline"?(n.classes.push("solid","thin"),e?(n.styles+=`border-color: ${e};`,n.styles+=`color: ${e};`):r?n.classes.push("bd-info","tx-info"):l?n.classes.push("bd-warning","tx-warning"):s?n.classes.push("bd-success","tx-success"):m?n.classes.push("bd-error","tx-error"):h?n.classes.push("bd-muted","tx-muted"):d?n.classes.push("bd-primary","tx-primary"):x&&n.classes.push("bd-secondary","tx-secondary")):(n.classes.push("tx-white"),e?n.styles+=`background-color: ${e};`:r?n.classes.push("bg-info"):l?n.classes.push("bg-warning"):s?n.classes.push("bg-success"):m?n.classes.push("bg-error"):h?n.classes.push("bg-muted"):d?n.classes.push("bg-primary"):x&&n.classes.push("bg-secondary"));let o={classes:[...n.classes,(0,Q.classnames)()].join(" "),styles:{...n.styles,..._}};return()=>[q.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/fontawesome/all.css"}).element,q.TempleRegistry.createText(`
-`,!1),q.TempleRegistry.createElement("div",{class:o.classes,style:o.styles},[q.TempleRegistry.createText(`
-  `,!1),...this._toNodeList((0,Q.children)()),q.TempleRegistry.createText(`
-`,!1)]).element]}};var fe=P($()),Ce=P(W()),ee=class extends fe.TempleComponent{static component=["tab","Tab_dd9d261e4f37efc3079c"];styles(){return""}template(){let{group:e,selector:r,class:l,...s}=(0,Ce.props)(),m=()=>{Array.from(document.querySelectorAll(r)).forEach(d=>{d.style.display=l.indexOf("active")>-1?"block":"none"})},h=()=>{Array.from(document.querySelectorAll(`[group="${e}"]`)).forEach(d=>{let x=d.props.selector;r===x?(d.classList.add("active"),Array.from(document.querySelectorAll(r)).forEach(b=>{b.style.display="block"})):(d.classList.remove("active"),Array.from(document.querySelectorAll(x)).forEach(b=>{b.style.display="none"}))})};return()=>[fe.TempleRegistry.createText(`
-`,!1),fe.TempleRegistry.createElement("a",{...s,click:h,mount:m},[...this._toNodeList((0,Ce.children)())]).element]}};var a=P($());var he=P(W());var ge={Asset:{type:{kind:"property",list:!1,type:["text/html","text/javascript","text/css","text/plain"],description:"The MIME type of the build file asset"},content:{kind:"property",list:!1,type:"string",description:"The source code of the build file asset."}},Path:{path:{kind:"property",list:!1,type:"string",description:"The file path",example:"'/path/to/file'"},type:{kind:"property",list:!1,type:"string",description:"The type of path.",example:"'file'"}},Config:{brand:{kind:"property",list:!1,type:"string",description:"The brand prefixed before the component tag name.",example:"'temple'"},cwd:{kind:"property",list:!1,type:"string",description:"The project's current working directory (cwd).",example:"'/path/to/project'"},fs:{kind:"property",list:!1,type:"FileSystem",description:"The file system being used to read/write files.",example:`import fs from 'fs';
+`,!1)]}};var Q=T(C());var He={Asset:{type:{kind:"property",list:!1,type:["text/html","text/javascript","text/css","text/plain"],description:"The MIME type of the build file asset"},content:{kind:"property",list:!1,type:"string",description:"The source code of the build file asset."}},Path:{path:{kind:"property",list:!1,type:"string",description:"The file path",example:"'/path/to/file'"},type:{kind:"property",list:!1,type:"string",description:"The type of path.",example:"'file'"}},Config:{brand:{kind:"property",list:!1,type:"string",description:"The brand prefixed before the component tag name.",example:"'temple'"},cwd:{kind:"property",list:!1,type:"string",description:"The project's current working directory (cwd).",example:"'/path/to/project'"},fs:{kind:"property",list:!1,type:"FileSystem",description:"The file system being used to read/write files.",example:`import fs from 'fs';
 
 fs`},emitter:{kind:"property",list:!1,type:"EventEmitter",description:"The NodeJS EventEmitter instance being used.",example:`import EventEmitter from 'events';
 
@@ -305,229 +201,216 @@ refresh.sync(builder);`},router:{kind:"property",list:!1,type:"Function",descrip
 app.use(router);`}},"Express Developer Tools":{refresh:{kind:"property",list:!1,type:"RefreshServer",description:"The refresh server instance used to update clients.",example:`const { refresh } = dev();
 refresh.sync(builder);`},router:{kind:"property",list:!1,type:"Function",description:"Express middleware to handle developer tool routes like '/dev.js' and '/__temple_dev__'.",example:`const { router } = dev();
 app.use(router);`},view:{kind:"property",list:!1,type:"Function",description:"Middleware used to setup an express view engine.",example:`const { view } = dev();
-app.engine('dtml', view(compiler));`}}};var te=class extends a.TempleComponent{static component=["ui","Ui_dcdb1ec28ab9a6dac63a"];styles(){return`:host {
-    border-radius: 5px;
-    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
+app.engine('dtml', view(compiler));`}}};var be=class extends i.TempleComponent{static component=["ui","Ui_0ec6f6ca4b362d125365"];styles(){return""}template(){(0,Q.classlist)().add("block","my-40","scroll-hidden","curved","shadow-0-0-10-0-0-0-5");let{start:e="TempleCompiler"}=(0,Q.props)(),s=(0,Q.signal)([e]),n=(0,Q.signal)(e),r=v=>{let d=v.target.getAttribute("data-type");s.value=[...s.value,d],n.value=d},u=()=>{s.value=s.value.slice(0,s.value.length-1),n.value=s.value[s.value.length-1]};return()=>[i.TempleRegistry.createText(`
+`,!1),i.TempleRegistry.createElement("h3",{class:"tx-secondary bg-t-2 tx-16 m-0 p-10"},[i.TempleRegistry.createText(`
+  `,!1),...s.value.length>1?[i.TempleRegistry.createText(`
+    `,!1),i.TempleRegistry.createElement("a",{class:"tx-t-1 cursor-pointer",click:u},[i.TempleRegistry.createText(`
+      `,!1),i.TempleRegistry.createElement("i",{class:"fas fa-arrow-left"},[]).element,i.TempleRegistry.createText(`
+    `,!1)]).element,i.TempleRegistry.createText(`
+  `,!1)]:[],i.TempleRegistry.createText(`
+  API: `,!1),...this._toNodeList(n.value),i.TempleRegistry.createText(`
+`,!1)]).element,i.TempleRegistry.createText(`
+`,!1),i.TempleRegistry.createElement("div",{class:"bg-t-0 p-10"},[i.TempleRegistry.createText(`
+  `,!1),i.TempleRegistry.createElement("div",{class:"relative mb-20 scroll-auto"},[i.TempleRegistry.createText(`
+    `,!1),i.TempleRegistry.createElement("table",{class:"w-full bd-collapse"},[i.TempleRegistry.createText(`
+      `,!1),i.TempleRegistry.createElement("thead",{},[i.TempleRegistry.createText(`
+        `,!1),i.TempleRegistry.createElement("th",{class:"p-10 tx-left tx-uppercase"},[i.TempleRegistry.createText("Property",!1)]).element,i.TempleRegistry.createText(`
+        `,!1),...n.value.includes("Emitter")?[]:[i.TempleRegistry.createText(`
+          `,!1),i.TempleRegistry.createElement("th",{class:"p-10 tx-left tx-uppercase"},[i.TempleRegistry.createText("Returns",!1)]).element,i.TempleRegistry.createText(`
+        `,!1)],i.TempleRegistry.createText(`
+        `,!1),i.TempleRegistry.createElement("th",{class:"p-10 tx-left tx-uppercase"},[i.TempleRegistry.createText("Description",!1)]).element,i.TempleRegistry.createText(`
+      `,!1)]).element,i.TempleRegistry.createText(`
+      `,!1),i.TempleRegistry.createElement("tbody",{},[i.TempleRegistry.createText(`
+        `,!1),...Object.entries(He[n.value]).map(([v,d])=>[i.TempleRegistry.createText(`
+          `,!1),i.TempleRegistry.createElement("tr",{},[i.TempleRegistry.createText(`
+            `,!1),...d.kind==="property"?[i.TempleRegistry.createText(`
+              `,!1),i.TempleRegistry.createElement("td",{class:"tx-primary tx-top tx-nowrap bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10"},[i.TempleRegistry.createText(`
+                `,!1),...this._toNodeList(v),i.TempleRegistry.createText(`
+              `,!1)]).element,i.TempleRegistry.createText(`
+              `,!1),...He[d.type]?[i.TempleRegistry.createText(`
+                `,!1),i.TempleRegistry.createElement("td",{class:"tx-top tx-nowrap bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10"},[i.TempleRegistry.createText(`
+                  `,!1),i.TempleRegistry.createElement("a",{"data-type":d.type,click:r},[i.TempleRegistry.createText(`
+                    `,!1),...this._toNodeList(d.type),i.TempleRegistry.createText(`
+                  `,!1)]).element,...this._toNodeList(d.list?"[]":""),i.TempleRegistry.createText(`
+                `,!1)]).element,i.TempleRegistry.createText(`
+              `,!1)]:[,i.TempleRegistry.createText(`
+                `,!1),i.TempleRegistry.createElement("td",{class:"tx-top tx-nowrap bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10"},[i.TempleRegistry.createText(`
+                  `,!1),...this._toNodeList(d.type),...this._toNodeList(d.list?"[]":""),i.TempleRegistry.createText(`
+                `,!1)]).element,i.TempleRegistry.createText(`
+              `,!1)],i.TempleRegistry.createText(`
+            `,!1)]:d.kind==="function"?[,i.TempleRegistry.createText(`
+              `,!1),i.TempleRegistry.createElement("td",{class:"tx-primary tx-top bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10",nowrap:!0},[i.TempleRegistry.createText(`
+                `,!1),...this._toNodeList(v),i.TempleRegistry.createText(`(
+                  `,!1),...Object.entries(d.args).map(([k,x])=>[i.TempleRegistry.createText(`
+                    `,!1),...k>0?[i.TempleRegistry.createText(", ",!1)]:[],i.TempleRegistry.createText(`
+                    `,!1),...this._toNodeList(x.name),i.TempleRegistry.createText(`: 
+                    `,!1),...He[x.type]?[i.TempleRegistry.createText(`
+                      `,!1),i.TempleRegistry.createElement("a",{"data-type":x.type,click:r},[i.TempleRegistry.createText(`
+                        `,!1),...this._toNodeList(x.type),i.TempleRegistry.createText(`
+                      `,!1)]).element,...this._toNodeList(x.list?"[]":""),i.TempleRegistry.createText(`
+                    `,!1)]:[,i.TempleRegistry.createText(`
+                      `,!1),...this._toNodeList(x.type),...this._toNodeList(x.list?"[]":""),i.TempleRegistry.createText(`
+                    `,!1)],i.TempleRegistry.createText(`
+                  `,!1)]).flat(),i.TempleRegistry.createText(`
+                )
+              `,!1)]).element,i.TempleRegistry.createText(`
+              `,!1),...He[d.returns.type]?[i.TempleRegistry.createText(`
+                `,!1),i.TempleRegistry.createElement("td",{class:"tx-top tx-nowrap bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10"},[i.TempleRegistry.createText(`
+                  `,!1),i.TempleRegistry.createElement("a",{"data-type":d.returns.type,click:r},[i.TempleRegistry.createText(`
+                    `,!1),...this._toNodeList(d.returns.type),i.TempleRegistry.createText(`
+                  `,!1)]).element,...this._toNodeList(d.returns.list?"[]":""),i.TempleRegistry.createText(`
+                `,!1)]).element,i.TempleRegistry.createText(`
+              `,!1)]:[,i.TempleRegistry.createText(`
+                `,!1),i.TempleRegistry.createElement("td",{class:"tx-top tx-nowrap bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10"},[i.TempleRegistry.createText(`
+                  `,!1),...this._toNodeList(d.returns.type),...this._toNodeList(d.returns.list?"[]":""),i.TempleRegistry.createText(`
+                `,!1)]).element,i.TempleRegistry.createText(`
+              `,!1)],i.TempleRegistry.createText(`
+            `,!1)]:d.kind==="event"?[,i.TempleRegistry.createText(`
+              `,!1),i.TempleRegistry.createElement("td",{class:"tx-primary tx-top bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10",nowrap:!0},[i.TempleRegistry.createText(`
+                `,!1),...this._toNodeList(`on('${v}', (event: Event) => void)`),i.TempleRegistry.createText(`
+              `,!1)]).element,i.TempleRegistry.createText(`
+            `,!1)]:[],i.TempleRegistry.createText(`
+            `,!1),i.TempleRegistry.createElement("td",{class:"tx-top tx-lh-24 bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10"},[i.TempleRegistry.createText(`
+              `,!1),...d.description?[i.TempleRegistry.createText(`
+                `,!1),i.TempleRegistry.createElement("p",{class:"pb-10"},[...this._toNodeList(d.description)]).element,i.TempleRegistry.createText(`
+                `,!1),...d.example?[i.TempleRegistry.createText(`
+                  `,!1),i.TempleRegistry.createElement("h5",{},[i.TempleRegistry.createText("Example",!1)]).element,i.TempleRegistry.createText(`
+                  `,!1),i.TempleRegistry.createComponent("api-ide-code",K,{lang:"js"},[...this._toNodeList(d.example)]).element,i.TempleRegistry.createText(` 
+                `,!1)]:[],i.TempleRegistry.createText(`
+              `,!1)]:[],i.TempleRegistry.createText(`
+            `,!1)]).element,i.TempleRegistry.createText(`
+          `,!1)]).element,i.TempleRegistry.createText(`
+        `,!1)]).flat(),i.TempleRegistry.createText(`
+      `,!1)]).element,i.TempleRegistry.createText(`
+    `,!1)]).element,i.TempleRegistry.createText(`
+  `,!1)]).element,i.TempleRegistry.createText(`
+`,!1)]).element]}};var ee=T(D()),lt=T(C()),xe=class extends ee.TempleComponent{static component=["head","Head_939ecb5f22962d8c2924"];styles(){return""}template(){return(0,lt.classlist)().add("absolute","top-0","right-0","left-170","h-45","bg-t-0","z-1"),()=>[ee.TempleRegistry.createText(`
+`,!1),ee.TempleRegistry.createElement("header",{class:"w-full h-full scroll-x-auto"},[ee.TempleRegistry.createText(`
+  `,!1),...this._toNodeList((0,lt.children)()),ee.TempleRegistry.createText(`
+`,!1)]).element]}};var te=T(D()),ot=T(C()),ve=class extends te.TempleComponent{static component=["left","Left_a7102198c3628da88b4f"];styles(){return""}template(){return(0,ot.classlist)().add("absolute","top-0","bottom-0","left-0","w-170","bg-h-000000","bd-solid","bd-t-2","bdy-0","bdl-0","bdr-1","z-2"),()=>[te.TempleRegistry.createText(`
+`,!1),te.TempleRegistry.createElement("aside",{class:"w-full h-full scroll-auto"},[te.TempleRegistry.createText(`
+  `,!1),...this._toNodeList((0,ot.children)()),te.TempleRegistry.createText(`
+`,!1)]).element]}};var se=T(D()),pt=T(C()),ke=class extends se.TempleComponent{static component=["main","Main_bbd0517424ebab9de270"];styles(){return""}template(){return(0,pt.classlist)().add("absolute","top-45","right-0","left-170","bottom-0","bg-black","bd-solid","bd-t-2","bdx-0","bdb-0","bdt-1"),()=>[se.TempleRegistry.createText(`
+`,!1),se.TempleRegistry.createElement("main",{class:"w-full h-full scroll-auto"},[se.TempleRegistry.createText(`
+  `,!1),...this._toNodeList((0,pt.children)()),se.TempleRegistry.createText(`
+`,!1)]).element]}};var S=T(D()),ct=T(C()),Te=class extends S.TempleComponent{static component=["app","App_381239c61b65b86a1c20"];styles(){return""}template(){let{title:e,height:s}=(0,ct.props)(),n=s?`height:${s}px`:"";return()=>[S.TempleRegistry.createText(`
+`,!1),S.TempleRegistry.createElement("div",{class:"bd-rad-curved scroll-hidden shadow-0-0-10-0-0-0-5"},[S.TempleRegistry.createText(`
+  `,!1),S.TempleRegistry.createElement("div",{class:"relative flex flex-center-y gap-10 p-10 bg-t-1 tx-c-999999 tx-16"},[S.TempleRegistry.createText(`
+    `,!1),S.TempleRegistry.createElement("span",{class:"bg-h-999999 pill h-10 w-10"},[]).element,S.TempleRegistry.createText(`
+    `,!1),S.TempleRegistry.createElement("span",{class:"bg-h-999999 pill h-10 w-10"},[]).element,S.TempleRegistry.createText(`
+    `,!1),S.TempleRegistry.createElement("span",{class:"bg-h-999999 pill h-10 w-10"},[]).element,S.TempleRegistry.createText(`
+    `,!1),S.TempleRegistry.createElement("span",{class:"flex flex-center h-full w-full absolute top-0 left-0"},[S.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(e),S.TempleRegistry.createText(`
+    `,!1)]).element,S.TempleRegistry.createText(`
+  `,!1)]).element,S.TempleRegistry.createText(`
+  `,!1),S.TempleRegistry.createElement("div",{class:"bg-black tx-t-1 relative",style:n},[...this._toNodeList((0,ct.children)())]).element,S.TempleRegistry.createText(`
+`,!1)]).element]}};var R=T(D()),Lt=T(Et()),ts=T(C()),we=class extends R.TempleComponent{static component=["code","Code_5294df1c620ef5ddbd2f"];styles(){return`:host {
     display: block;
-    margin: 40px 0;
-    overflow: hidden;
-  }
-  a {
-    color: #007BFF;
-    cursor: pointer;
-  }
-  th {
-    padding: 10px;
-    text-align: left;
-    text-transform: uppercase;
-  }
-  td {
-    border-color: #666666;
-    border-top-style: solid;
-    border-top-width: 1px;
-    padding: 10px;
+    font-size: 14px;
+    line-height: 20px;
   }
-  .tbl-container {
-    position: relative;
-    margin-bottom: 20px;
-    overflow: auto;
+  :host([inline]) {
+    display: inline !important;
   }
-  .tbl {
-    border-collapse: collapse;
-    display: table;
-    width: 100%;
+  :host([inline]),
+  :host([inline]) > pre,
+  :host([inline]) > pre > code {
+    display: inline !important;
   }
-
-  .tbl-scroll {
-    overflow: auto;
-    flex-grow: 1;
+  .snippet {
+    background-color: #000000;
+    color: #ABB2BF;
     height: 100%;
-    width: 100%;
-  }
-
-  .tbl-valign="top" nowrap {
-    white-space: valign="top" nowrap;
+    margin: 0;
+    padding: 0;
   }
 
-  .tbl-z0 {
-    z-index: 0;
-  }
-  .tbl-z1 {
-    z-index: 1;
-  }
-  .tbl-z2 {
-    z-index: 2;
-  }
-  .tbl-z3 {
-    z-index: 3;
+  .line-numbers {
+    position: relative;
+    padding-left: 3.8em;
+    counter-reset: linenumber;
   }
-  .tbl-z4 {
-    z-index: 4;
+  :host([inline]) .line-numbers {
+    position: static;
+    padding-left: 0;
   }
 
-  .tbl-sticky {
-    position: sticky;
-  }
-  .tbl-sticky-b {
-    bottom: 0;
-  }
-  .tbl-sticky-l {
-    left: 0;
+  .line-numbers > code {
+    position: relative;
+    white-space: inherit;
   }
-  .tbl-sticky-t {
+
+  .line-numbers .line-numbers-rows {
+    position: absolute;
+    pointer-events: none;
     top: 0;
-  }
-  .tbl-sticky-r {
-    right: 0;
-  }
+    font-size: 100%;
+    left: -3.8em;
+    width: 3em; /* works for line-numbers below 1000 lines */
+    letter-spacing: -1px;
+    border-right: 1px solid #999;
 
-  .tbl-col {
-    border-color: black;
-    border-style: solid;
-    border-top-width: 1px;
-    padding-bottom: 16px;
-    padding-left: 12px;
-    padding-right: 12px;
-    padding-top: 16px;
-  }
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
 
-  .tbl-foot {
-    border-color: black;
-    border-style: solid;
-    border-top-width: 1px;
-    padding-bottom: 16px;
-    padding-left: 12px;
-    padding-right: 12px;
-    padding-top: 16px;
   }
 
-  .tbl-row {
-    padding-bottom: 16px;
-    padding-left: 12px;
-    padding-right: 12px;
-    padding-top: 16px;
+  :host([inline]) .line-numbers .line-numbers-rows {
+    display: none;
   }
 
-  .tbl-head {
-    border-color: black;
-    border-style: solid;
-    border-top-width: 1px;
-    padding-bottom: 16px;
-    padding-left: 12px;
-    padding-right: 12px;
-    padding-top: 16px;
+  .line-numbers-rows > span {
+    display: block;
+    counter-increment: linenumber;
   }
 
-  tr td:first-child {
-    color: #E49F1A;
+  .line-numbers-rows > span:before {
+    content: counter(linenumber);
+    color: #999;
+    display: block;
+    padding-right: 0.8em;
+    text-align: right;
+  }
+  .pad {
+    padding: 5px;
   }
 
-  h3 {
-    color: #DA532C;
-    background: #1A1A1A;
-    border-bottom: 1px solid #29252A;
-    font-size: 16px;
-    margin: 0;
+  .terminal {
+    background-color: #000000;
+    font-family: 'Courier New', Courier, monospace;
+    font-size: 15px;
+    height: 100%;
     padding: 10px;
   }
-  h5 {
-    font-weight: normal;
-    margin: 15px 0 5px;
-    text-transform: uppercase;
-  }
-  td p {
-    margin: 0 0 10px;
-  }
-  .container {
-    background-color: #020202;
-    padding: 10px;
-  }`}template(){let{start:e="TempleCompiler"}=(0,he.props)(),r=(0,he.signal)([e]),l=(0,he.signal)(e),s=h=>{let d=h.target.getAttribute("data-type");r.value=[...r.value,d],l.value=d},m=()=>{r.value=r.value.slice(0,r.value.length-1),l.value=r.value[r.value.length-1]};return()=>[a.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/fontawesome/all.css"}).element,a.TempleRegistry.createText(`
-`,!1),a.TempleRegistry.createElement("div",{},[a.TempleRegistry.createText(`
-  `,!1),a.TempleRegistry.createElement("h3",{},[a.TempleRegistry.createText(`
-    `,!1),...r.value.length>1?[a.TempleRegistry.createText(`
-      `,!1),a.TempleRegistry.createElement("a",{click:m},[a.TempleRegistry.createText(`
-        `,!1),a.TempleRegistry.createElement("i",{class:"fas fa-arrow-left"},[]).element,a.TempleRegistry.createText(`
-      `,!1)]).element,a.TempleRegistry.createText(`
-    `,!1)]:[],a.TempleRegistry.createText(`
-    API: `,!1),...this._toNodeList(l.value),a.TempleRegistry.createText(`
-  `,!1)]).element,a.TempleRegistry.createText(`
-  `,!1),a.TempleRegistry.createElement("div",{class:"container"},[a.TempleRegistry.createText(`
-    `,!1),a.TempleRegistry.createElement("div",{class:"tbl-container"},[a.TempleRegistry.createText(`
-      `,!1),a.TempleRegistry.createElement("table",{class:"tbl"},[a.TempleRegistry.createText(`
-        `,!1),a.TempleRegistry.createElement("thead",{},[a.TempleRegistry.createText(`
-          `,!1),a.TempleRegistry.createElement("th",{},[a.TempleRegistry.createText("Property",!1)]).element,a.TempleRegistry.createText(`
-          `,!1),...l.value.includes("Emitter")?[]:[a.TempleRegistry.createText(`
-            `,!1),a.TempleRegistry.createElement("th",{},[a.TempleRegistry.createText("Returns",!1)]).element,a.TempleRegistry.createText(`
-          `,!1)],a.TempleRegistry.createText(`
-          `,!1),a.TempleRegistry.createElement("th",{},[a.TempleRegistry.createText("Description",!1)]).element,a.TempleRegistry.createText(`
-        `,!1)]).element,a.TempleRegistry.createText(`
-        `,!1),a.TempleRegistry.createElement("tbody",{},[a.TempleRegistry.createText(`
-          `,!1),...Object.entries(ge[l.value]).map(([h,d])=>[a.TempleRegistry.createText(`
-            `,!1),a.TempleRegistry.createElement("tr",{},[a.TempleRegistry.createText(`
-              `,!1),...d.kind==="property"?[a.TempleRegistry.createText(`
-                `,!1),a.TempleRegistry.createElement("td",{valign:"top",nowrap:!0},[...this._toNodeList(h)]).element,a.TempleRegistry.createText(`
-                `,!1),...ge[d.type]?[a.TempleRegistry.createText(`
-                  `,!1),a.TempleRegistry.createElement("td",{valign:"top",nowrap:!0},[a.TempleRegistry.createText(`
-                    `,!1),a.TempleRegistry.createElement("a",{"data-type":d.type,click:s},[a.TempleRegistry.createText(`
-                      `,!1),...this._toNodeList(d.type),a.TempleRegistry.createText(`
-                    `,!1)]).element,...this._toNodeList(d.list?"[]":""),a.TempleRegistry.createText(`
-                  `,!1)]).element,a.TempleRegistry.createText(`
-                `,!1)]:[,a.TempleRegistry.createText(`
-                  `,!1),a.TempleRegistry.createElement("td",{valign:"top",nowrap:!0},[...this._toNodeList(d.type),...this._toNodeList(d.list?"[]":"")]).element,a.TempleRegistry.createText(`
-                `,!1)],a.TempleRegistry.createText(`
-              `,!1)]:d.kind==="function"?[,a.TempleRegistry.createText(`
-                `,!1),a.TempleRegistry.createElement("td",{valign:"top",nowrap:!0},[a.TempleRegistry.createText(`
-                  `,!1),...this._toNodeList(h),a.TempleRegistry.createText(`(
-                    `,!1),...Object.entries(d.args).map(([x,b])=>[a.TempleRegistry.createText(`
-                      `,!1),...x>0?[a.TempleRegistry.createText(", ",!1)]:[],a.TempleRegistry.createText(`
-                      `,!1),...this._toNodeList(b.name),a.TempleRegistry.createText(`: 
-                      `,!1),...ge[b.type]?[a.TempleRegistry.createText(`
-                        `,!1),a.TempleRegistry.createElement("a",{"data-type":b.type,click:s},[a.TempleRegistry.createText(`
-                          `,!1),...this._toNodeList(b.type),a.TempleRegistry.createText(`
-                        `,!1)]).element,...this._toNodeList(b.list?"[]":""),a.TempleRegistry.createText(`
-                      `,!1)]:[,a.TempleRegistry.createText(`
-                        `,!1),...this._toNodeList(b.type),...this._toNodeList(b.list?"[]":""),a.TempleRegistry.createText(`
-                      `,!1)],a.TempleRegistry.createText(`
-                    `,!1)]).flat(),a.TempleRegistry.createText(`
-                  )
-                `,!1)]).element,a.TempleRegistry.createText(`
-                `,!1),...ge[d.returns.type]?[a.TempleRegistry.createText(`
-                  `,!1),a.TempleRegistry.createElement("td",{valign:"top",nowrap:!0},[a.TempleRegistry.createText(`
-                    `,!1),a.TempleRegistry.createElement("a",{"data-type":d.returns.type,click:s},[a.TempleRegistry.createText(`
-                      `,!1),...this._toNodeList(d.returns.type),a.TempleRegistry.createText(`
-                    `,!1)]).element,...this._toNodeList(d.returns.list?"[]":""),a.TempleRegistry.createText(`
-                  `,!1)]).element,a.TempleRegistry.createText(`
-                `,!1)]:[,a.TempleRegistry.createText(`
-                  `,!1),a.TempleRegistry.createElement("td",{valign:"top",nowrap:!0},[...this._toNodeList(d.returns.type),...this._toNodeList(d.returns.list?"[]":"")]).element,a.TempleRegistry.createText(`
-                `,!1)],a.TempleRegistry.createText(`
-              `,!1)]:d.kind==="event"?[,a.TempleRegistry.createText(`
-                `,!1),a.TempleRegistry.createElement("td",{valign:"top",nowrap:!0},[...this._toNodeList(`on('${h}', (event: Event) => void)`)]).element,a.TempleRegistry.createText(`
-              `,!1)]:[],a.TempleRegistry.createText(`
-              `,!1),a.TempleRegistry.createElement("td",{},[a.TempleRegistry.createText(`
-                `,!1),...d.description?[a.TempleRegistry.createText(`
-                  `,!1),a.TempleRegistry.createElement("p",{},[...this._toNodeList(d.description)]).element,a.TempleRegistry.createText(`
-                  `,!1),...d.example?[a.TempleRegistry.createText(`
-                    `,!1),a.TempleRegistry.createElement("h5",{},[a.TempleRegistry.createText("Example",!1)]).element,a.TempleRegistry.createText(`
-                    `,!1),a.TempleRegistry.createComponent("ide-code",H,{lang:"js"},[...this._toNodeList(d.example)]).element,a.TempleRegistry.createText(` 
-                  `,!1)]:[],a.TempleRegistry.createText(`
-                `,!1)]:[],a.TempleRegistry.createText(`
-              `,!1)]).element,a.TempleRegistry.createText(`
-            `,!1)]).element,a.TempleRegistry.createText(`
-          `,!1)]).flat(),a.TempleRegistry.createText(`
-        `,!1)]).element,a.TempleRegistry.createText(`
-      `,!1)]).element,a.TempleRegistry.createText(`
-    `,!1)]).element,a.TempleRegistry.createText(`
-  `,!1)]).element,a.TempleRegistry.createText(`
-`,!1)]).element]}};var M=P($());var Xe=function(t,...e){let r=Ye(t);for(let l=0;l[M.TempleRegistry.createText(`
-    `,!1),...r?[M.TempleRegistry.createText(`
-      `,!1),M.TempleRegistry.createElement("p",{},[...this._toNodeList(T)]).element,M.TempleRegistry.createText(`
-    `,!1)]:l?[,M.TempleRegistry.createText(`
-      `,!1),M.TempleRegistry.createElement("li",{},[...this._toNodeList(T)]).element,M.TempleRegistry.createText(`
-    `,!1)]:s?[,M.TempleRegistry.createText(`
-      `,!1),M.TempleRegistry.createElement("div",{},[...this._toNodeList(T)]).element,M.TempleRegistry.createText(`
-    `,!1)]:[,M.TempleRegistry.createText(`
-      `,!1),...this._toNodeList(T),M.TempleRegistry.createText(`
-    `,!1)]]}};var F=P($());L.emitter.once("ready",()=>{let t=document.querySelector("script[data-app]");if(!t)throw L.TempleException.for("APP_DATA not found");try{let d=atob(t.getAttribute("data-app"));window.__APP_DATA__=JSON.parse(d),Object.entries(window.__APP_DATA__).forEach(([x,b])=>{L.data.set(x,b)})}catch{throw L.TempleException.for("APP_DATA is not a valid JSON")}L.data.set("current","document");let e="/docs/getting-started.html",r=Xe("Getting Started - Temple reactive web component template engine."),l=Xe("How to install, setup and use Temple in a project."),s=d=>{document.body.classList.toggle("panel-left-open")},m="https://github.com/OSSPhilippines/temple/tree/main/examples";L.data.delete("current");let h={0:{class:"head panel-head"},1:{class:"menu fas fa-fw fa-bars",click:s},2:{href:"/temple"},3:{src:"/temple/temple-icon.png",alt:"Temple Logo"},5:{class:"tx-white",href:"/temple"},7:{class:"tx-white",href:"/temple/docs/index.html"},8:{class:"github",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},9:{class:"fab fa-github"},10:{class:"npm",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},11:{class:"fab fa-npm text-white"},12:{class:"discord",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},13:{class:"fab fa-discord text-white"},14:{class:"left panel-left"},16:{href:"/temple"},17:{src:"/temple/temple-icon.png",alt:"Temple Logo"},19:{class:"tx-white",href:"/temple"},20:{class:"toggle fas fa-fw fa-chevron-left",click:s},23:{href:"/temple/docs/index.html"},24:{href:"/temple/docs/getting-started.html"},26:{href:"/temple/docs/markup-syntax.html"},27:{href:"/temple/docs/state-management.html"},28:{href:"/temple/docs/component-strategy.html"},29:{href:"/temple/docs/compiler-api.html"},30:{href:"/temple/docs/client-api.html"},32:{href:"/temple/docs/template-engine.html"},33:{href:"/temple/docs/single-page.html"},34:{href:"/temple/docs/static-site.html"},35:{href:"/temple/docs/component-publisher.html"},36:{href:"/temple/docs/developer-tools.html"},37:{class:"panel-right right"},40:{href:"#http"},41:{href:"#develop"},42:{href:"#cache"},43:{href:"#tailwind"},44:{href:"#express"},45:{class:"panel-main"},46:{class:"docs container"},48:{p:!0,trim:!0},49:{title:"Terminal"},50:{lang:"bash"},51:{solid:!0,curved:!0,info:!0},52:{class:"fas fa-info-circle"},54:{target:"_blank",href:"https://marketplace.visualstudio.com/items?itemName=ossph.temple-language"},55:{p:!0,trim:!0},56:{inline:!0},57:{title:"src/index.ts"},58:{lang:"js",numbers:!0,trim:!0,detab:12},59:{p:!0,trim:!0},60:{inline:!0},61:{title:"src/page.dtml"},62:{numbers:!0,trim:!0,detab:12},63:{p:!0,trim:!0},64:{title:"Terminal"},65:{lang:"bash"},66:{name:"http"},68:{p:!0,trim:!0},69:{inline:!0},70:{solid:!0,curved:!0,info:!0},71:{class:"fas fa-info-circle"},73:{panel:410,title:"With NodeJS HTTP"},74:{class:"panel-head"},75:{class:"tabs"},76:{class:"tab active",group:"http",selector:"#index-ts"},77:{class:"tab",group:"http",selector:"#page-dtml"},78:{class:"tab",group:"http",selector:"#package-json"},79:{class:"panel-left"},80:{class:"folder"},81:{class:"fas fa-fw fa-chevron-down"},83:{class:"shift-1 block active",group:"http",selector:"#index-ts"},84:{class:"fas fa-fw fa-file"},85:{class:"shift-1 block",group:"http",selector:"#page-dtml"},86:{class:"fas fa-fw fa-file"},87:{class:"block",group:"http",selector:"#package-json"},88:{class:"fas fa-fw fa-file"},89:{class:"panel-main"},91:{id:"index-ts",lang:"js",numbers:!0,trim:!0,detab:16},92:{id:"page-dtml",style:"display:none",numbers:!0,trim:!0,detab:16},93:{id:"package-json",style:"display:none",lang:"js",numbers:!0,trim:!0,detab:16},94:{p:!0,trim:!0},95:{title:"Terminal"},96:{lang:"bash"},97:{p:!0,trim:!0},98:{lang:"js",inline:!0},99:{lang:"js",inline:!0},100:{start:"TempleOptions"},101:{p:!0,trim:!0},102:{lang:"js",inline:!0},103:{lang:"js",inline:!0},104:{start:"Render Methods"},105:{name:"develop"},107:{p:!0,trim:!0},108:{lang:"js",inline:!0},109:{title:"Terminal"},110:{lang:"bash"},111:{p:!0,trim:!0},112:{lang:"js",inline:!0},113:{lang:"js",inline:!0},114:{title:"src/index.ts"},115:{lang:"js",numbers:!0,trim:!0,detab:12},116:{p:!0,trim:!0},117:{inline:!0,lang:"js"},118:{inline:!0,lang:"js"},119:{start:"DeveloperOptions"},120:{p:!0,trim:!0},121:{start:"Developer Tools"},122:{p:!0,trim:!0},123:{lang:"js",inline:!0},124:{inline:!0},125:{title:"src/page.dtml"},126:{numbers:!0,trim:!0,detab:12},127:{p:!0,trim:!0},128:{panel:410,title:"With Developer Tools"},129:{class:"panel-head"},130:{class:"tabs"},131:{class:"tab active",group:"develop",selector:"#index-ts"},132:{class:"tab",group:"develop",selector:"#page-dtml"},133:{class:"tab",group:"develop",selector:"#package-json"},134:{class:"panel-left"},135:{class:"folder"},136:{class:"fas fa-fw fa-chevron-down"},138:{class:"shift-1 block active",group:"develop",selector:"#index-ts"},139:{class:"fas fa-fw fa-file"},140:{class:"shift-1 block",group:"develop",selector:"#page-dtml"},141:{class:"fas fa-fw fa-file"},142:{class:"block",group:"develop",selector:"#package-json"},143:{class:"fas fa-fw fa-file"},144:{class:"panel-main"},146:{id:"index-ts",lang:"js",numbers:!0,trim:!0,detab:16},147:{id:"page-dtml",style:"display:none",numbers:!0,trim:!0,detab:16},148:{id:"package-json",style:"display:none",lang:"js",numbers:!0,trim:!0,detab:16},149:{p:!0,trim:!0},150:{lang:"js",inline:!0},151:{title:"Terminal"},152:{lang:"bash"},153:{p:!0,trim:!0},154:{lang:"js",inline:!0},155:{name:"cache"},157:{p:!0,trim:!0},158:{lang:"js",inline:!0},159:{title:"src/index.ts"},160:{lang:"js",numbers:!0,trim:!0,detab:12},161:{p:!0,trim:!0},162:{lang:"js",inline:!0},163:{title:"src/index.ts"},164:{lang:"js",numbers:!0,trim:!0,detab:12},165:{p:!0,trim:!0},166:{title:"Terminal"},167:{lang:"bash"},168:{p:!0,trim:!0},169:{lang:"js",inline:!0},170:{lang:"js",inline:!0},171:{panel:400,title:"cache.ts (Internal)"},172:{lang:"js",numbers:!0,trim:!0,detab:12},173:{p:!0,trim:!0},174:{start:"EventEmitter"},175:{name:"tailwind"},177:{p:!0,trim:!0},178:{p:!0,trim:!0},179:{inline:!0},180:{solid:!0,curved:!0,warning:!0},181:{class:"fas fa-exclamation-triangle"},183:{p:!0,trim:!0},184:{inline:!0,lang:"js"},185:{title:"Terminal"},186:{lang:"bash"},187:{p:!0,trim:!0},188:{inline:!0,lang:"js"},189:{inline:!0,lang:"js"},190:{title:"src/index.ts"},191:{lang:"js",numbers:!0,trim:!0,detab:12},192:{p:!0,trim:!0},193:{inline:!0,lang:"js"},194:{inline:!0},195:{inline:!0,lang:"js"},196:{title:"src/page.dtml"},197:{numbers:!0,trim:!0,detab:12},198:{p:!0,trim:!0},199:{panel:410,title:"With TailwindCSS"},200:{class:"panel-head"},201:{class:"tabs"},202:{class:"tab active",group:"tailwind",selector:"#index-ts"},203:{class:"tab",group:"tailwind",selector:"#page-dtml"},204:{class:"tab",group:"tailwind",selector:"#package-json"},205:{class:"panel-left"},206:{class:"folder"},207:{class:"fas fa-fw fa-chevron-down"},209:{class:"shift-1 block active",group:"tailwind",selector:"#index-ts"},210:{class:"fas fa-fw fa-file"},211:{class:"shift-1 block",group:"tailwind",selector:"#page-dtml"},212:{class:"fas fa-fw fa-file"},213:{class:"block",group:"tailwind",selector:"#package-json"},214:{class:"fas fa-fw fa-file"},215:{class:"panel-main"},217:{id:"index-ts",lang:"js",numbers:!0,trim:!0,detab:16},218:{id:"page-dtml",style:"display:none",numbers:!0,trim:!0,detab:16},219:{id:"package-json",style:"display:none",lang:"js",numbers:!0,trim:!0,detab:16},220:{p:!0,trim:!0},221:{title:"Terminal"},222:{lang:"bash"},223:{p:!0,trim:!0},224:{lang:"js",inline:!0},225:{lang:"js",inline:!0},226:{name:"express"},228:{p:!0,trim:!0},229:{inline:!0,lang:"js"},230:{title:"Terminal"},231:{lang:"bash"},232:{p:!0,trim:!0},233:{inline:!0,lang:"js"},234:{inline:!0,lang:"js"},235:{inline:!0,lang:"js"},236:{inline:!0,lang:"js"},237:{start:"Express Developer Tools"},238:{p:!0,trim:!0},239:{inline:!0,lang:"js"},240:{inline:!0,lang:"js"},241:{numbers:!0,trim:!0,detab:10,lang:"js"},242:{p:!0,trim:!0},243:{inline:!0,lang:"js"},244:{numbers:!0,trim:!0,detab:10},245:{p:!0,trim:!0},246:{panel:410,title:"With ExpressJS"},247:{class:"panel-head"},248:{class:"tabs"},249:{class:"tab active",group:"express",selector:"#index-ts"},250:{class:"tab",group:"express",selector:"#page-dtml"},251:{class:"tab",group:"express",selector:"#package-json"},252:{class:"panel-left"},253:{class:"folder"},254:{class:"fas fa-fw fa-chevron-down"},256:{class:"shift-1 block active",group:"express",selector:"#index-ts"},257:{class:"fas fa-fw fa-file"},258:{class:"shift-1 block",group:"express",selector:"#page-dtml"},259:{class:"fas fa-fw fa-file"},260:{class:"block",group:"express",selector:"#package-json"},261:{class:"fas fa-fw fa-file"},262:{class:"panel-main"},264:{id:"index-ts",lang:"js",numbers:!0,trim:!0,detab:16},265:{id:"page-dtml",style:"display:none",numbers:!0,trim:!0,detab:16},266:{id:"package-json",style:"display:none",lang:"js",numbers:!0,trim:!0,detab:16},267:{p:!0,trim:!0},268:{title:"Terminal"},269:{lang:"bash"},270:{p:!0,trim:!0},271:{lang:"js",inline:!0},273:{p:!0,trim:!0},276:{target:"_blank",href:`${m}/with-fastify`},278:{target:"_blank",href:`${m}/with-hapi`},280:{target:"_blank",href:`${m}/with-koa`},282:{target:"_blank",href:`${m}/with-nest`},284:{target:"_blank",href:`${m}/with-restify`},286:{target:"_blank",href:`${m}/with-webpack`},287:{p:!0,trim:!0},290:{href:"/temple/docs/template-engine.html"},292:{href:"/temple/docs/single-page.html"},294:{href:"/temple/docs/static-site.html"},296:{href:"/temple/docs/component-publisher.html"},297:{class:"pager"},298:{class:"prev",href:"/temple/docs/index.html"},299:{class:"fas fa-fw fa-chevron-left"},300:{class:"next",href:"/temple/docs/markup-syntax.html"},301:{class:"fas fa-fw fa-chevron-right"},302:{class:"foot"}};for(let d of document.body.querySelectorAll("*")){let x=Object.fromEntries(Array.from(d.attributes).map(T=>[T.nodeName,T.nodeValue.length>0?T.nodeValue:!0])),b=String(L.TempleRegistry.elements.size);h[b]&&(Object.assign(x,h[b]),d.TempleAttributes=h[b]),L.TempleRegistry.register(d,x)}customElements.define("panel-main",Y),customElements.define("ide-code",H),customElements.define("ide-app",V),customElements.define("tui-alert",K),customElements.define("tui-tab",ee),customElements.define("api-ui",te),customElements.define("i18n-translate",re),L.emitter.emit("mounted",document.body)});var ur={PanelMain_fd7f1af6410c5b5c8e1f:Y,IdeCode_6f36bc13bb6a166c7abc:H,IdeApp_05341fddbfd1fe4f273b:V,TuiAlert_6b81bcb0566ce7f0cd2d:K,TuiTab_dd9d261e4f37efc3079c:ee,ApiUi_dcdb1ec28ab9a6dac63a:te,I18nTranslate_7d25e372f5ffb5e39dad:re},mr="a67341498153885a2fc0";return Ot(fr);})();
+  .terminal span {
+    color: #00FF00;
+  }`}template(){let e=this.props,{lang:s="markup",numbers:n=!1,inline:r=!1,trim:u=!1,ltrim:v=!1,rtrim:d=!1,detab:k=0}=e,x=(0,ts.children)(),m=x[0]?.textContent||"";k&&(m=m.replace(new RegExp(`\\n {${k}}`,"g"),`
+`)),u?m=m.trim():v?m=m.replace(/^\s+/,""):d&&(m=m.replace(/\s+$/,""));let E=A=>{if(!m)return;let y=Lt.default.highlight(m,Lt.default.languages[s],s);if(A.detail.target.innerHTML=y,n){let _=y.match(/\n(?!$)/g),a=_?_.length+1:1,l=new Array(a+1).join(""),p=document.createElement("span");p.setAttribute("aria-hidden","true"),p.className="line-numbers-rows",p.innerHTML=l,A.detail.target.appendChild(p)}};return()=>[R.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism.min.css"}).element,R.TempleRegistry.createText(`
+`,!1),R.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism-tomorrow.min.css"}).element,R.TempleRegistry.createText(`
+`,!1),...s==="bash"?[R.TempleRegistry.createText(`
+  `,!1),R.TempleRegistry.createElement("div",{class:"terminal"},[R.TempleRegistry.createElement("span",{},[R.TempleRegistry.createText("$",!1)]).element,R.TempleRegistry.createText(" ",!1),...this._toNodeList(x)]).element,R.TempleRegistry.createText(`
+`,!1)]:m?[,R.TempleRegistry.createText(`
+  `,!1),...n?[R.TempleRegistry.createText(`
+    `,!1),R.TempleRegistry.createElement("pre",{class:"snippet line-numbers"},[R.TempleRegistry.createElement("code",{mount:E},[]).element]).element,R.TempleRegistry.createText(`
+  `,!1)]:[,R.TempleRegistry.createText(`
+    `,!1),R.TempleRegistry.createElement("pre",{class:"snippet pad"},[R.TempleRegistry.createElement("code",{mount:E},[]).element]).element,R.TempleRegistry.createText(`
+  `,!1)],R.TempleRegistry.createText(`
+`,!1)]:[,R.TempleRegistry.createText(`
+  `,!1),R.TempleRegistry.createElement("span",{},[R.TempleRegistry.createText("????",!1)]).element,R.TempleRegistry.createText(`
+`,!1)],R.TempleRegistry.createText(`
+
+`,!1)]}};var O=T(D());var ss=function(t){return t};var dt=T(C()),_e=class extends O.TempleComponent{static component=["translate","Translate_0014b007fc91289b2776"];styles(){return""}template(){let{trim:e=!1,p:s=!1,li:n=!1,div:r=!1}=(0,dt.props)(),u=(0,dt.children)(),v=[],d=[];for(let E of u)typeof E=="string"?v.push(E):E instanceof Node&&E.textContent?v.push(E.textContent):(v.push("%s"),d.push(E));let k=v.join("");e&&(k=k.replace(/\s+/," ").trim());let x=ss(k).split("%s"),m=[];for(let E=0;E[O.TempleRegistry.createText(`
+    `,!1),...s?[O.TempleRegistry.createText(`
+      `,!1),O.TempleRegistry.createElement("p",{},[...this._toNodeList(m)]).element,O.TempleRegistry.createText(`
+    `,!1)]:n?[,O.TempleRegistry.createText(`
+      `,!1),O.TempleRegistry.createElement("li",{},[...this._toNodeList(m)]).element,O.TempleRegistry.createText(`
+    `,!1)]:r?[,O.TempleRegistry.createText(`
+      `,!1),O.TempleRegistry.createElement("div",{},[...this._toNodeList(m)]).element,O.TempleRegistry.createText(`
+    `,!1)]:[,O.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(m),O.TempleRegistry.createText(`
+    `,!1)]]}};var Rt=function(t,...e){let s=Ks(t);for(let n=0;n{let t=document.querySelector("script[data-app]");if(!t)throw $.TempleException.for("APP_DATA not found");try{let d=atob(t.getAttribute("data-app"));window.__APP_DATA__=JSON.parse(d),Object.entries(window.__APP_DATA__).forEach(([k,x])=>{$.data.set(k,x)})}catch{throw $.TempleException.for("APP_DATA is not a valid JSON")}$.data.set("current","document");let e="/docs/getting-started.html",s=Rt("Getting Started - Temple reactive web component template engine."),n=Rt("How to install, setup and use Temple in a project."),r=()=>{document.getElementsByTagName("panel-layout")[0].toggle("left")},u="https://github.com/OSSPhilippines/temple/tree/main/examples";$.data.delete("current");let v={2:{class:"flex flex-center-y px-20 py-15 m-0 bg-t-1"},3:{class:"fas fa-fw fa-bars cursor-pointer py-5 pr-10 none md-inline-block tx-t-1",click:r},4:{class:"flex-grow"},5:{class:"flex flex-center-y"},6:{class:"tx-white",href:"/temple/docs/index.html"},7:{class:"tx-t-1 tx-5xl ml-10",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},8:{class:"fab fa-github"},9:{class:"bg-h-cb3837 pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},10:{class:"fab fa-npm text-white"},11:{class:"bg-h-7289da pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},12:{class:"fab fa-discord text-white"},14:{class:"flex flex-center-y bg-t-2 py-15 pr-5 pl-10"},15:{href:"/temple"},16:{class:"h-26 mr-10",src:"/temple/temple-icon.png",alt:"Temple Logo"},17:{class:"flex-grow m-0 tx-uppercase"},18:{class:"tx-white",href:"/temple"},19:{class:"fas fa-fw fa-chevron-left cursor-pointer none md-inline-block",click:r},20:{class:"bg-t-1 scroll-auto h-calc-full-60"},21:{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-0 pt-20 pb-10 pl-10 tx-uppercase"},22:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/index.html"},23:{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/getting-started.html"},24:{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},25:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/markup-syntax.html"},26:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/state-management.html"},27:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-strategy.html"},28:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/compiler-api.html"},29:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/client-api.html"},30:{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},31:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/template-engine.html"},32:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/single-page.html"},33:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/static-site.html"},34:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-publisher.html"},35:{class:"block tx-t-1 py-10 pl-10 mb-100",href:"/temple/docs/developer-tools.html"},37:{class:"m-0 px-10 py-20 h-calc-full-40 bg-t-2 scroll-auto"},38:{class:"tx-muted tx-14 mb-0 mt-0 pb-10 tx-uppercase"},39:{class:"tx-14 tx-lh-32"},40:{class:"block tx-t-0",href:"#http"},41:{class:"block tx-t-0",href:"#develop"},42:{class:"block tx-t-0",href:"#cache"},43:{class:"block tx-t-0",href:"#tailwind"},44:{class:"block tx-t-0",href:"#express"},47:{class:"tx-primary tx-uppercase tx-30 py-20"},48:{p:!0,trim:!0,class:"tx-lh-36 py-20"},49:{title:"Terminal",class:"py-20"},50:{lang:"bash"},51:{solid:!0,curved:!0,info:!0,class:"py-20 tx-lh-24"},52:{class:"fas fa-info-circle"},54:{target:"_blank",class:"tx-white tx-underline",href:"https://marketplace.visualstudio.com/items?itemName=ossph.temple-language"},55:{p:!0,trim:!0,class:"tx-lh-36 py-20"},56:{inline:!0},57:{title:"src/index.ts",class:"py-20"},58:{class:"scroll-auto",lang:"js",numbers:!0,trim:!0,detab:14},59:{p:!0,trim:!0,class:"tx-lh-36 py-20"},60:{inline:!0},61:{title:"src/page.dtml",class:"py-20"},62:{class:"scroll-auto",numbers:!0,trim:!0,detab:14},63:{p:!0,trim:!0,class:"tx-lh-36 py-20"},64:{title:"Terminal",class:"py-20"},65:{lang:"bash"},66:{name:"http"},67:{class:"tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0"},68:{p:!0,trim:!0,class:"tx-lh-36 py-20"},69:{inline:!0},70:{solid:!0,curved:!0,info:!0,class:"py-20 tx-lh-24"},71:{class:"fas fa-info-circle"},73:{height:410,title:"With NodeJS HTTP"},75:{class:"flex bd-h-333333 bd-solid bdx-0 bdt-0 bdl-1 scroll-x-auto pt-5 pl-5"},76:{on:!0,class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"http",selector:"#http-index-ts"},77:{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"http",selector:"#http-page-dtml"},78:{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"http",selector:"#http-package-json"},80:{class:"p-5"},81:{class:"fas fa-fw fa-chevron-down"},83:{on:!0,class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"http",selector:"#http-index-ts"},84:{class:"fas fa-fw fa-file"},85:{class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"http",selector:"#http-page-dtml"},86:{class:"fas fa-fw fa-file"},87:{class:"pt-10 block",active:"tx-white",inactive:"tx-muted",group:"http",selector:"#http-package-json"},88:{class:"fas fa-fw fa-file"},90:{id:"http-index-ts",lang:"js",numbers:!0,trim:!0,detab:16},91:{id:"http-page-dtml",style:"display:none",numbers:!0,trim:!0,detab:16},92:{id:"http-package-json",style:"display:none",lang:"js",numbers:!0,trim:!0,detab:16},93:{p:!0,trim:!0,class:"tx-lh-36 py-20"},94:{title:"Terminal",class:"py-20"},95:{lang:"bash"},96:{p:!0,trim:!0,class:"tx-lh-36 py-20"},97:{lang:"js",inline:!0},98:{lang:"js",inline:!0},99:{start:"Render Methods"},100:{name:"develop"},101:{class:"tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0"},102:{p:!0,trim:!0,class:"tx-lh-36 py-20"},103:{lang:"js",inline:!0},104:{title:"Terminal",class:"py-20"},105:{lang:"bash"},106:{p:!0,trim:!0,class:"tx-lh-36 py-20"},107:{lang:"js",inline:!0},108:{lang:"js",inline:!0},109:{title:"src/index.ts",class:"py-20"},110:{lang:"js",numbers:!0,trim:!0,detab:14},111:{p:!0,trim:!0,class:"tx-lh-36 py-20"},112:{inline:!0,lang:"js"},113:{inline:!0,lang:"js"},114:{start:"DeveloperOptions"},115:{p:!0,trim:!0,class:"tx-lh-36 py-20"},116:{start:"Developer Tools"},117:{p:!0,trim:!0,class:"tx-lh-36 py-20"},118:{lang:"js",inline:!0},119:{inline:!0},120:{title:"src/page.dtml",class:"py-20"},121:{numbers:!0,trim:!0,detab:14},122:{p:!0,trim:!0,class:"tx-lh-36 py-20"},123:{height:410,title:"With Developer Tools",class:"py-20"},125:{class:"flex bd-h-333333 bd-solid bdx-0 bdt-0 bdl-1 scroll-x-auto pt-5 pl-5"},126:{on:!0,class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"develop",selector:"#develop-index-ts"},127:{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"develop",selector:"#develop-page-dtml"},128:{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"develop",selector:"#develop-package-json"},130:{class:"p-5"},131:{class:"fas fa-fw fa-chevron-down"},133:{on:!0,class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"develop",selector:"#develop-index-ts"},134:{class:"fas fa-fw fa-file"},135:{class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"develop",selector:"#develop-page-dtml"},136:{class:"fas fa-fw fa-file"},137:{class:"pt-10 block",active:"tx-white",inactive:"tx-muted",group:"develop",selector:"#develop-package-json"},138:{class:"fas fa-fw fa-file"},140:{id:"develop-index-ts",lang:"js",numbers:!0,trim:!0,detab:16},141:{id:"develop-page-dtml",style:"display:none",numbers:!0,trim:!0,detab:16},142:{id:"develop-package-json",style:"display:none",lang:"js",numbers:!0,trim:!0,detab:16},143:{p:!0,trim:!0,class:"tx-lh-36 py-20"},144:{lang:"js",inline:!0},145:{title:"Terminal",class:"py-20"},146:{lang:"bash"},147:{p:!0,trim:!0,class:"tx-lh-36 py-20"},148:{lang:"js",inline:!0},149:{name:"cache"},150:{class:"tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0"},151:{p:!0,trim:!0,class:"tx-lh-36 py-20"},152:{lang:"js",inline:!0},153:{title:"src/index.ts",class:"py-20"},154:{lang:"js",numbers:!0,trim:!0,detab:14},155:{p:!0,trim:!0,class:"tx-lh-36 py-20"},156:{lang:"js",inline:!0},157:{title:"src/index.ts",class:"py-20"},158:{lang:"js",numbers:!0,trim:!0,detab:14},159:{p:!0,trim:!0,class:"tx-lh-36 py-20"},160:{title:"Terminal",class:"py-20"},161:{lang:"bash"},162:{p:!0,trim:!0,class:"tx-lh-36 py-20"},163:{lang:"js",inline:!0},164:{lang:"js",inline:!0},165:{height:400,title:"cache.ts (Internal)",class:"py-20"},166:{lang:"js",numbers:!0,trim:!0,detab:14},167:{p:!0,trim:!0,class:"tx-lh-36 py-20"},168:{start:"EventEmitter"},169:{name:"tailwind"},170:{class:"tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0"},171:{p:!0,trim:!0,class:"tx-lh-36 py-20"},172:{p:!0,trim:!0,class:"tx-lh-36 py-20"},173:{inline:!0},174:{solid:!0,curved:!0,warning:!0,class:"py-20 tx-lh-24"},175:{class:"fas fa-exclamation-triangle"},177:{p:!0,trim:!0,class:"tx-lh-36 py-20"},178:{inline:!0,lang:"js"},179:{title:"Terminal",class:"py-20"},180:{lang:"bash"},181:{p:!0,trim:!0,class:"tx-lh-36 py-20"},182:{inline:!0,lang:"js"},183:{inline:!0,lang:"js"},184:{title:"src/index.ts",class:"py-20"},185:{lang:"js",numbers:!0,trim:!0,detab:14},186:{p:!0,trim:!0,class:"tx-lh-36 py-20"},187:{inline:!0,lang:"js"},188:{inline:!0},189:{inline:!0,lang:"js"},190:{title:"src/page.dtml",class:"py-20"},191:{numbers:!0,trim:!0,detab:14},192:{p:!0,trim:!0,class:"tx-lh-36 py-20"},193:{height:410,title:"With TailwindCSS",class:"py-20"},195:{class:"flex bd-h-333333 bd-solid bdx-0 bdt-0 bdl-1 scroll-x-auto pt-5 pl-5"},196:{on:!0,class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"tailwind",selector:"#tailwind-index-ts"},197:{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"tailwind",selector:"#tailwind-page-dtml"},198:{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"tailwind",selector:"#tailwind-package-json"},200:{class:"p-5"},201:{class:"fas fa-fw fa-chevron-down"},203:{on:!0,class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"tailwind",selector:"#tailwind-index-ts"},204:{class:"fas fa-fw fa-file"},205:{class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"tailwind",selector:"#tailwind-page-dtml"},206:{class:"fas fa-fw fa-file"},207:{class:"pt-10 block",active:"tx-white",inactive:"tx-muted",group:"tailwind",selector:"#tailwind-package-json"},208:{class:"fas fa-fw fa-file"},210:{id:"tailwind-index-ts",lang:"js",numbers:!0,trim:!0,detab:16},211:{id:"tailwind-page-dtml",style:"display:none",numbers:!0,trim:!0,detab:16},212:{id:"tailwind-package-json",style:"display:none",lang:"js",numbers:!0,trim:!0,detab:16},213:{p:!0,trim:!0,class:"tx-lh-36 py-20"},214:{title:"Terminal",class:"py-20"},215:{lang:"bash"},216:{p:!0,trim:!0,class:"tx-lh-36 py-20"},217:{lang:"js",inline:!0},218:{lang:"js",inline:!0},219:{name:"express"},220:{class:"tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0"},221:{p:!0,trim:!0,class:"tx-lh-36 py-20"},222:{inline:!0,lang:"js"},223:{title:"Terminal",class:"py-20"},224:{lang:"bash"},225:{p:!0,trim:!0,class:"tx-lh-36 py-20"},226:{inline:!0,lang:"js"},227:{inline:!0,lang:"js"},228:{inline:!0,lang:"js"},229:{inline:!0,lang:"js"},230:{start:"Express Developer Tools"},231:{p:!0,trim:!0,class:"tx-lh-36 py-20"},232:{inline:!0,lang:"js"},233:{inline:!0,lang:"js"},234:{numbers:!0,trim:!0,detab:12,lang:"js",class:"py-20"},235:{p:!0,trim:!0,class:"tx-lh-36 py-20"},236:{inline:!0,lang:"js"},237:{numbers:!0,trim:!0,detab:12,class:"py-20"},238:{p:!0,trim:!0,class:"tx-lh-36 py-20"},239:{height:410,title:"With ExpressJS",class:"py-20"},241:{class:"flex bd-h-333333 bd-solid bdx-0 bdt-0 bdl-1 scroll-x-auto pt-5 pl-5"},242:{on:!0,class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"express",selector:"#express-index-ts"},243:{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"express",selector:"#express-page-dtml"},244:{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"express",selector:"#express-package-json"},246:{class:"p-5"},247:{class:"fas fa-fw fa-chevron-down"},249:{on:!0,class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"express",selector:"#express-index-ts"},250:{class:"fas fa-fw fa-file"},251:{class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"express",selector:"#express-page-dtml"},252:{class:"fas fa-fw fa-file"},253:{class:"pt-10 block",active:"tx-white",inactive:"tx-muted",group:"express",selector:"#express-package-json"},254:{class:"fas fa-fw fa-file"},256:{id:"express-index-ts",lang:"js",numbers:!0,trim:!0,detab:16},257:{id:"express-page-dtml",style:"display:none",numbers:!0,trim:!0,detab:16},258:{id:"express-package-json",style:"display:none",lang:"js",numbers:!0,trim:!0,detab:16},259:{p:!0,trim:!0,class:"tx-lh-36 py-20"},260:{title:"Terminal",class:"py-20"},261:{lang:"bash"},262:{p:!0,trim:!0,class:"tx-lh-36 py-20"},263:{lang:"js",inline:!0},264:{class:"tx-t-1 tx-uppercase tx-22 pt-40 pb-20"},265:{p:!0,trim:!0,class:"tx-lh-36 py-20"},267:{class:"py-5"},268:{class:"tx-t-1 tx-underline",target:"_blank",href:`${u}/with-fastify`},269:{class:"py-5"},270:{class:"tx-t-1 tx-underline",target:"_blank",href:`${u}/with-hapi`},271:{class:"py-5"},272:{class:"tx-t-1 tx-underline",target:"_blank",href:`${u}/with-koa`},273:{class:"py-5"},274:{class:"tx-t-1 tx-underline",target:"_blank",href:`${u}/with-nest`},275:{class:"py-5"},276:{class:"tx-t-1 tx-underline",target:"_blank",href:`${u}/with-restify`},277:{class:"py-5"},278:{class:"tx-t-1 tx-underline",target:"_blank",href:`${u}/with-webpack`},279:{p:!0,trim:!0,class:"tx-lh-36 py-10"},281:{class:"py-5"},282:{class:"tx-t-1 tx-underline",href:"/temple/docs/template-engine.html"},283:{class:"py-5"},284:{class:"tx-t-1 tx-underline",href:"/temple/docs/single-page.html"},285:{class:"py-5"},286:{class:"tx-t-1 tx-underline",href:"/temple/docs/static-site.html"},287:{class:"py-5"},288:{class:"tx-t-1 tx-underline",href:"/temple/docs/component-publisher.html"},289:{class:"flex"},290:{class:"tx-primary py-40",href:"/temple/docs/index.html"},291:{class:"fas fa-fw fa-chevron-left tx-t-1"},292:{class:"flex-grow tx-right tx-primary py-40",href:"/temple/docs/markup-syntax.html"},293:{class:"fas fa-fw fa-chevron-right tx-t-1"},294:{class:"foot"}};for(let d of document.body.querySelectorAll("*")){let k=Object.fromEntries(Array.from(d.attributes).map(m=>[m.nodeName,m.nodeValue.length>0?m.nodeValue:!0])),x=String($.TempleRegistry.elements.size);v[x]&&(Object.assign(k,v[x]),d.TempleAttributes=v[x]),$.TempleRegistry.register(d,k)}customElements.define("panel-layout",oe),customElements.define("panel-head",pe),customElements.define("panel-left",ce),customElements.define("panel-right",de),customElements.define("panel-main",ue),customElements.define("tui-alert",me),customElements.define("tui-tab",he),customElements.define("api-docs",ye),customElements.define("api-ui",be),customElements.define("app-head",xe),customElements.define("app-left",ve),customElements.define("app-main",ke),customElements.define("ide-app",Te),customElements.define("ide-code",we),customElements.define("i18n-translate",_e),$.emitter.emit("mounted",document.body)});var Qs={PanelLayout_9f3ab204ce271feaf6f7:oe,PanelHead_2bf4dff19bc88ba4138b:pe,PanelLeft_f4ab589e043eee17d229:ce,PanelRight_4ce97029791442c57f8d:de,PanelMain_847772763f4518728ede:ue,TuiAlert_f0fe98801b4b833c4233:me,TuiTab_5a341768ef0a010965e3:he,ApiDocs_40562a7bb56d70d971df:ye,ApiUi_0ec6f6ca4b362d125365:be,ApiIdeCode_6f36bc13bb6a166c7abc:K,AppHead_939ecb5f22962d8c2924:xe,AppLeft_a7102198c3628da88b4f:ve,AppMain_bbd0517424ebab9de270:ke,IdeApp_381239c61b65b86a1c20:Te,IdeCode_5294df1c620ef5ddbd2f:we,I18nTranslate_0014b007fc91289b2776:_e},er="a67341498153885a2fc0";return ms(tr);})();
 /*! Bundled license information:
 
 prismjs/prism.js:
diff --git a/docs/build/client/f01cefc94e8ee605f3f5.css b/docs/build/client/f01cefc94e8ee605f3f5.css
index 9fa6e05..cab810b 100644
--- a/docs/build/client/f01cefc94e8ee605f3f5.css
+++ b/docs/build/client/f01cefc94e8ee605f3f5.css
@@ -1,165 +1,247 @@
-body {
-    font-family: Arial, Helvetica, sans-serif;
-  }
-  h1, h2, h3, h4, h5, h6, p {
-    margin: 0;
-    padding: 0;
-  }
-  a, a:link, a:hover, a:active, a:visited {
-    color: var(--fg-primary);
-    text-decoration: none;
-  }
-  p, li {
-    font-size: 20px;
-    line-height: 36px;
-  }
-  .fab, .fas, .fa {
-    line-height: 16px;
-  }
-  .section-hero {
-    background-color: var(--bg-first);
-    padding: 40px 0;
-    text-align: center;
-    width: 100%;
-  }
-  .section-hero img {
-    height: 100px;
-  }
-  .section-hero h1 {
-    font-size: 40px;
-  }
-  .section-hero p {
-    font-size: 30px;
-    padding: 30px 0;
-  }
-  .section-sample {
-    margin: auto;
-    max-width: 960px;
-    padding: 0 20px;
-  }
-  .section-sample p {
-    padding: 20px;
-    text-align: center;
-  }
+html, body {
+  height: 100%;
+  margin: 0;
+  padding: 0;
+  width: 100%;
+}
 
-  .section-bullets {
-    background-color: var(--bg-first);
-    margin: auto;
-    padding: 40px 20px;
-    text-align: center;
-  }
-  .section-bullets ul {
-    align-items: center;
-    display: flex;
-    justify-content: center;
-    list-style: none;
-    padding: 0;
-    text-align: center;
-  }
-  .section-bullets li {
-    width: calc(33.33%-20px);
-    margin: 10px;
-    max-width: 300px;
-  }
-  .section-bullets li h3 {
-    margin-bottom: 20px;
-    text-transform: uppercase;
-  }
-  .section-bullets li p {
-    font-size: 16px;
-    line-height: 26px;
-  }
+h1, h2, h3, h4, h5, h6, p {
+  margin: 0;
+  padding: 0;
+}
 
-  .section-interactive {
-    margin: auto;
-    max-width: 960px;
-    padding: 40px 20px;
-  }
-  .section-interactive h3 {
-    margin-top: 40px;
-    margin-bottom: 20px;
-    text-align: center;
-    text-transform: uppercase;
-  }
-  .section-interactive p {
-    font-size: 16px;
-    line-height: 26px;
-    margin-bottom: 20px;
-    text-align: center;
-  }
+a {
+  text-decoration: none;
+}
+  html-head:not(:defined) { opacity: 0; }
+html-header:not(:defined) { opacity: 0; }
+panel-layout:not(:defined) { opacity: 0; }
+panel-head:not(:defined) { opacity: 0; }
+panel-main:not(:defined) { opacity: 0; }
+tui-button:not(:defined) { opacity: 0; }
+ide-app:not(:defined) { opacity: 0; }
+ide-code:not(:defined) { opacity: 0; }
+ide-preview:not(:defined) { opacity: 0; }
+i18n-translate:not(:defined) { opacity: 0; }
+tweet-box:not(:defined) { opacity: 0; }
+  :root {
+  --black: #000000;
+  --white: #FFFFFF;
+  --info: #1474FC;
+  --error: #DC3545;
+  --warning: #FF7B07;
+  --success: #28A745;
+  --muted: #999999;
+}
 
-  .section-servers {
-    background-color: #CCCCCC;
-    margin: auto;
-    padding: 40px 20px;
-    text-align: center;
-  }
-  .section-servers h3 {
-    color: #242424;
-    font-size: 30px;
-    text-transform: uppercase;
-  }
-  .section-servers div {
-    align-items: center;
-    display: flex;
-    flex-wrap: wrap;
-    justify-content: center;
-    margin: 40px auto 0;
-    max-width: 960px;
-  }
-  .section-servers a {
-    display: block;
-    flex-basis: 33%;
-    margin-bottom: 20px;
-  }
-  .section-servers img {
-    height: 60px;
-  }
+.light {
+  --bg-0: #EFEFEF;
+  --bg-1: #CFCFCF;
+  --bg-2: #AFAFAF;
+  --bg-3: #8F8F8F;
+  --bg-4: #6F6F6F;
+  --bd-0: #EFEFEF;
+  --bd-1: #CFCFCF;
+  --bd-2: #AFAFAF;
+  --bd-3: #8F8F8F;
+  --bd-4: #6F6F6F;
+  --bg-inverse: #242424;
+  --tx-0: #000000;
+  --tx-1: #242424;
+  --tx-inverse: #CFCFCF;
+}
 
-  .section-testimonials {
-    background-color: var(--bg-first);
-    margin: auto;
-    padding: 40px 20px;
-  }
-  .section-testimonials h3 {
-    font-size: 26px;
-    text-align: center;
-  }
-  .section-testimonials > section {
-    display: flex;
-    flex-wrap: wrap;
-  }
-  .section-testimonials tweet-box {
-    flex-basis: 33%;
-  }
-
-  .section-action {
-    margin: auto;
-    padding: 40px 20px;
-    text-align: center;
-  }
-  .section-action h3 {
-    font-size: 26px;
-    margin-bottom: 20px;
-  }
-
-  @media (max-width: 960px) {
-    .section-testimonials tweet-box {
-      flex-basis: 50%;
-    }
-  }
-
-  @media (max-width: 767px) {
-    .section-bullets ul {
-      display: block;
-    }
-    .section-bullets li {
-      margin: 10px auto 40px;
-    }
-    .section-servers div {
-      display: block;
-    }
-    .section-testimonials tweet-box {
-      flex-basis: 100%;
-    }
-  }
\ No newline at end of file
+.dark {
+  --bg-0: #121212;
+  --bg-1: #222222;
+  --bg-2: #323232;
+  --bg-3: #424242;
+  --bg-4: #525252;
+  --bd-0: #121212;
+  --bd-1: #222222;
+  --bd-2: #323232;
+  --bd-3: #424242;
+  --bd-4: #525252;
+  --bg-inverse: #DBDBDB;
+  --tx-0: #FFFFFF;
+  --tx-1: #CFCFCF;
+  --tx-inverse: #222222;
+}
+  html-head { display: block; }
+html-header { display: block; }
+panel-layout { display: block; }
+panel-head { display: block; }
+panel-main { display: block; }
+tui-button { display: block; }
+ide-app { display: block; }
+ide-code { display: block; }
+ide-preview { display: block; }
+i18n-translate { display: block; }
+tweet-box { display: block; }
+  .arial { font-family: Arial, sans-serif; }
+.none { display: none; }
+.block { display: block; }
+.flex { display: flex; }
+.inline { display: inline; }
+.inline-block { display: inline-block; }
+.transparent { opacity: 0; }
+.relative { position: relative; }
+.absolute { position: absolute; }
+.static { position: static; }
+.bottom-0 { bottom: 0px; }
+.bottom-60 { bottom: 60px; }
+.left-0 { left: 0px; }
+.left-226 { left: 226px; }
+.left-0 { left: 0px; }
+.left-226 { left: 226px; }
+.right-0 { right: 0px; }
+.right-200 { right: 200px; }
+.right-0 { right: 0px; }
+.right-200 { right: 200px; }
+.top-0 { top: 0px; }
+.top-60 { top: 60px; }
+.flex-grow { flex-grow: 1; }
+.flex-center { align-items: center; justify-content: center; }
+.flex-center-y { align-items: center; }
+.flex-wrap { flex-wrap: wrap; }
+.basis-half { flex-basis: 50%; }
+.basis-third { flex-basis: 33.33%; }
+.gap-10 { gap: 10px; }
+.scroll-auto { overflow: auto; }
+.scroll-hidden { overflow: hidden; }
+.h-full { height: 100%; }
+.h-26 { height: 26px; }
+.h-7289 { height: 7289px; }
+.h-905496362982981723 { height: 905496362982981723px; }
+.h-60 { height: 60px; }
+.h-999999 { height: 999999px; }
+.h-10 { height: 10px; }
+.h-100 { height: 100px; }
+.h-36 { height: 36px; }
+.h-24 { height: 24px; }
+.h-242424 { height: 242424px; }
+.vh { height: 100vh; }
+.w-full { width: 100%; }
+.w-third { width: 33.33%; }
+.w-0 { width: 0px; }
+.w-10 { width: 10px; }
+.wm-960 { max-width: 960px; }
+.wm-300 { max-width: 300px; }
+.wm-400 { max-width: 400px; }
+.bg-primary { background-color: var(--primary) !important; }
+.bg-secondary { background-color: var(--secondary) !important; }
+.bg-black { background-color: var(--black) !important; }
+.bg-white { background-color: var(--white) !important; }
+.bg-info { background-color: var(--info) !important; }
+.bg-error { background-color: var(--error) !important; }
+.bg-warning { background-color: var(--warning) !important; }
+.bg-success { background-color: var(--success) !important; }
+.bg-muted { background-color: var(--muted) !important; }
+.bg-t-1 { background-color: var(--bg-1) !important; }
+.bg-t-0 { background-color: var(--bg-0) !important; }
+.bg-h-cb3837 { background-color: #cb3837; }
+.bg-h-7289da { background-color: #7289da; }
+.bg-h-999999 { background-color: #999999; }
+.bg-h-cccccc { background-color: #cccccc; }
+.tx-5 { font-size: 5px; }
+.tx-16 { font-size: 16px; }
+.tx-40 { font-size: 40px; }
+.tx-30 { font-size: 30px; }
+.tx-18 { font-size: 18px; }
+.tx-26 { font-size: 26px; }
+.tx-lg { font-size: 16px; }
+.tx-5xl { font-size: 26px; }
+.tx-center { text-align: center; }
+.tx-uppercase { text-transform: uppercase; }
+.tx-nodecor { text-decoration: none; }
+.tx-lh-36 { line-height: 36px; }
+.tx-lh-24 { line-height: 24px; }
+.tx-primary { color: var(--primary) !important; }
+.tx-secondary { color: var(--secondary) !important; }
+.tx-black { color: var(--black) !important; }
+.tx-white { color: var(--white) !important; }
+.tx-info { color: var(--info) !important; }
+.tx-error { color: var(--error) !important; }
+.tx-warning { color: var(--warning) !important; }
+.tx-success { color: var(--success) !important; }
+.tx-muted { color: var(--muted) !important; }
+.tx-t-1 { color: var(--tx-1) !important; }
+.tx-h-242424 { color: #242424; }
+.bd-solid { border-style: solid; }
+.bd-primary { border-color: var(--primary) !important; }
+.bd-secondary { border-color: var(--secondary) !important; }
+.bd-info { border-color: var(--info) !important; }
+.bd-error { border-color: var(--error) !important; }
+.bd-warning { border-color: var(--warning) !important; }
+.bd-success { border-color: var(--success) !important; }
+.bd-muted { border-color: var(--muted) !important; }
+.curved { border-radius: 4px; }
+.rounded { border-radius: 12px; }
+.pill { border-radius: 10000px; }
+.m-auto { margin: auto; }
+.mx-auto { margin-left: auto; margin-right: auto; }
+.m-0 { margin: 0px; }
+.m-0 { margin: 0px; }
+.m-60 { margin: 60px; }
+.m-960 { margin: 960px; }
+.m-300 { margin: 300px; }
+.m-400 { margin: 400px; }
+.mb-20 { margin-bottom: 20px; }
+.mb-0 { margin-bottom: 0px; }
+.ml-10 { margin-left: 10px; }
+.ml-5 { margin-left: 5px; }
+.mr-10 { margin-right: 10px; }
+.mt-20 { margin-top: 20px; }
+.mt-40 { margin-top: 40px; }
+.p-5 { padding: 5px; }
+.p-0 { padding: 0px; }
+.p-60 { padding: 60px; }
+.p-10 { padding: 10px; }
+.p-10 { padding: 10px; }
+.p-20 { padding: 20px; }
+.p-0 { padding: 0px; }
+.pr-10 { padding-right: 10px; }
+.px-20 { padding-left: 20px; padding-right: 20px; }
+.px-4 { padding-left: 4px; padding-right: 4px; }
+.px-8 { padding-left: 8px; padding-right: 8px; }
+.px-12 { padding-left: 12px; padding-right: 12px; }
+.px-16 { padding-left: 16px; padding-right: 16px; }
+.px-24 { padding-left: 24px; padding-right: 24px; }
+.px-28 { padding-left: 28px; padding-right: 28px; }
+.px-32 { padding-left: 32px; padding-right: 32px; }
+.px-36 { padding-left: 36px; padding-right: 36px; }
+.py-15 { padding-top: 15px; padding-bottom: 15px; }
+.py-5 { padding-top: 5px; padding-bottom: 5px; }
+.py-2 { padding-top: 2px; padding-bottom: 2px; }
+.py-4 { padding-top: 4px; padding-bottom: 4px; }
+.py-6 { padding-top: 6px; padding-bottom: 6px; }
+.py-8 { padding-top: 8px; padding-bottom: 8px; }
+.py-10 { padding-top: 10px; padding-bottom: 10px; }
+.py-12 { padding-top: 12px; padding-bottom: 12px; }
+.py-14 { padding-top: 14px; padding-bottom: 14px; }
+.py-16 { padding-top: 16px; padding-bottom: 16px; }
+.py-18 { padding-top: 18px; padding-bottom: 18px; }
+.py-40 { padding-top: 40px; padding-bottom: 40px; }
+.py-30 { padding-top: 30px; padding-bottom: 30px; }
+.list-none { list-style: none; }
+.cursor-pointer { cursor: pointer; }
+.transition-500 { transition: 500ms; }
+.shadow-0-0-10-0-0-0-5 { box-shadow: 0px 0px 10px rgb(0, 0, 0, 0.5); }
+@media (max-width: 420px) {
+  .sm-block { display: block; }
+}
+@media (max-width: 767px) {
+  .md-block { display: block; }
+  .md-inline-block { display: inline-block; }
+  .md-left-0 { left: 0px; }
+  .md-left-226 { left: 226px; }
+  .md-right-0 { right: 0px; }
+  .md-right-200 { right: 200px; }
+  .md-w-auto { width: auto; }
+  .md-wm-400 { max-width: 400px; }
+  .md-m-auto { margin: auto; }
+  .md-mt-20 { margin-top: 20px; }
+}
+@media (max-width: 992px) {
+  .lg-basis-half { flex-basis: 50%; }
+}
\ No newline at end of file
diff --git a/docs/build/client/f01cefc94e8ee605f3f5.html b/docs/build/client/f01cefc94e8ee605f3f5.html
index 006ff10..e7fb3ee 100644
--- a/docs/build/client/f01cefc94e8ee605f3f5.html
+++ b/docs/build/client/f01cefc94e8ee605f3f5.html
@@ -18,271 +18,304 @@
   
   
   
-  
+  
   
   
   
   
 
-  
-    

-  
-  
-    Temple Logo
-  
-  
Temple

-  

-    
-      

-        Temple Logo
-        
Temple

-        
-          The reactive web component template engine.
-        
-        
-          Get Started
-        
-        
-          Read the Docs
-        
-      

-      

-        
-          Temple is a modern HTML markup language and a server first 
-          template engine with a built-in parser/compiler that 
-          generates web components and supports reactivity.
-        
-        
-          

-            
-              <style>
-                h1 { font-weight: bold; }
-              </style>
-              <script>
-                const name = 'world';
-              </script>
-              <h1>Hello {name}!</h1>
-            
-            
-              

-                
Hello world!

+
+      
+        

+          Temple Logo
+          
Temple

+          
+            The reactive web component template engine.
+          
+          
+            Get Started
+          
+          
+            Read the Docs
+          
+        

+        

+          
+            Temple is a modern HTML markup language and a server first 
+            template engine with a built-in parser/compiler that 
+            generates web components and supports reactivity.
+          
+          
+            

+              
+                <style>
+                  h1 { font-weight: bold; }
+                </style>
+                <script>
+                  const name = 'world';
+                </script>
+                <h1>Hello {name}!</h1>
+              
+              
+                

+                  
Hello world!

+                

+              
+            

+          
+        

+        

+          
    
+            
  • 
+              
    
+                
    
+                  Expressive Markup
+                
    
+                
+                  Any data type as attributes. Easily express logic with 
+                  markup directives like if, each, and try catch. 
+                
               
    
-            
-          

-        
-      

-      

-        
    
-          
  • 
-            
    Expressive Markup
    
-            
-              Any data type as attributes. Easily express logic with 
-              markup directives like if, each, and try catch. 
-            
-          
    • 
-          
  • 
-            
    Reactive Signals
    
-            
-              Easily transition from backend logic to reactive states.
-              No Hydration and no memoization needed.
-            
-          
    • 
-          
  • 
-            
    Bare Metal
    
-            
-              Work with the DOM directly. Import any web components 
-              from any source. Works with Lit, HTMX.
-            
-          
    • 
-        

-      

-      

-        
Server Setup

-        
-          Temple can be used with popular server 
-          frameworks in just a few lines of code.
-        
-        
-          
-            import temple from '@ossph/temple/compiler';
-            //make a temple compiler
-            const compiler = temple();
-            //render HTML
-            const results = compiler.render('./page.dtml');
-          
-        
-
-        
Props

-        
-          Import your component props and use immediately
-        
-        
-          

-            
-              <style>
-                h1 { font-weight: bold; }
-              </style>
-              <script>
-                import { props } from '@ossph/temple';
-                const { name } = props();
-              </script>
-              <h1>Hello {name}!</h1>
-            
-            
-              

-                
Hello world!

+            
+            
  • 
+              
    
+                
    
+                  Reactive Signals
+                
    
+                
+                  Easily transition from backend logic to reactive states.
+                  No Hydration and no memoization needed.
+                
               
    
-            
-          
    • 
-        
-
-        
    Reactive Signals
    
-        
-          Use signals to manage state changes and re-renders.
-        
-        
-          
    
-            
-              <style>
-                h1 { font-weight: bold; }
-              </style>
-              <script>
-                import { signal } from '@ossph/temple';
-                const name = signal('world');
-                name.value += '!';
-              </script>
-              <h1>Hello {name.value}</h1>
-            
-            
-              
    
-                
    Hello world!
    
+            
+            
  • 
+              
    
+                
    
+                  Bare Metal
+                
    
+                
+                  Work with the DOM directly. Import any web components 
+                  from any source. Works with Lit, HTMX.
+                
               
    
-            
-          
    • 
-        
-
-        
    Components and Templates
    
-        
-          Import components and templates for reusability.
-        
-        
-          
    
-            
-              <!-- page.html -->
-              <link rel="import" href="./my-heading.html" />
-              <script>
-                const name = 'world';
-              </script>
-              <my-heading {name}>Hello</my-heading>
-            
-            
-              <!-- my-heading.html -->
-              <script>
-                import { props } from '@ossph/temple';
-                const { name, children } = props();
-              </script>
-              <h1>{children} {name}</h1>
+            
+          
+        
    
+        
    
+          
    
+            Server Setup
+          
    
+          
+            Temple can be used with popular server 
+            frameworks in just a few lines of code.
+          
+          
+            
+              import temple from '@ossph/temple/compiler';
+              //make a temple compiler
+              const compiler = temple();
+              //render HTML
+              const results = compiler.render('./page.dtml');
             
-          
-        
+          
 
-        
    Conditionals and Iterations
    
-        
-          Case for conditions and iterations in an expressive way.
-        
-        
-          
    
-            
-              <script>
-                const name = 'world';
-                const show = name === "world";
-              </script>
+          
    
+            Props
+          
    
+          
+            Import your component props and use immediately
+          
+          
+            
    
+              
+                <style>
+                  h1 { font-weight: bold; }
+                </style>
+                <script>
+                  import { props } from '@ossph/temple';
+                  const { name } = props();
+                </script>
+                <h1>Hello {name}!</h1>
+              
+              
+                
    
+                  
    Hello world!
    
+                
    
+                  
+            
    
+              
 
-              <if true=show>
-                <h1>Hello {name}</h1>
-              </if>
-                
-            
-              <script>
-                const list = [ 'a', 'b', 'c' ];
-              </script>
-              <ul>
-                <each key=i value=item from=list>
-                  <li>{i}: {item}</li>
-                </each>
-              </ul>
-            
+          
    
+            Reactive Signals
+          
    
+          
+            Use signals to manage state changes and re-renders.
+          
+          
+            
    
+              
+                <style>
+                  h1 { font-weight: bold; }
+                </style>
+                <script>
+                  import { signal } from '@ossph/temple';
+                  const name = signal('world');
+                  name.value += '!';
+                </script>
+                <h1>Hello {name.value}</h1>
+              
+              
+                
    
+                  
    Hello world!
    
+                
    
+                  
+            
    
+              
+
+          
    
+            Components and Templates
+          
    
+          
+            Import components and templates for reusability.
+          
+          
+            
    
+              
+                <!-- page.html -->
+                <link rel="import" href="./my-heading.html" />
+                <script>
+                  const name = 'world';
+                </script>
+                <my-heading {name}>Hello</my-heading>
+              
+              
+                <!-- my-heading.html -->
+                <script>
+                  import { props } from '@ossph/temple';
+                  const { name, children } = props();
+                </script>
+                <h1>{children} {name}</h1>
+              
+            
    
+              
+
+          
    
+            Conditionals and Iterations
+          
    
+          
+            Case for conditions and iterations in an expressive way.
+          
+          
+            
    
+              
+                <script>
+                  const name = 'world';
+                  const show = name === "world";
+                </script>
+
+                <if true=show>
+                  <h1>Hello {name}</h1>
+                </if>
+              
+              
+                <script>
+                  const list = [ 'a', 'b', 'c' ];
+                </script>
+                <ul>
+                  <each key=i value=item from=list>
+                    <li>{i}: {item}</li>
+                  </each>
+                </ul>
+              
+            
    
+              
+        
    
+        
    
+          
    
+            Works With Popular Server Frameworks
+          
    
+          
    
+            
+              Express
+            
+            
+              Fastify
+            
+            
+              Hapi
+            
+            
+              Koa
+            
+            
+              NestJS
+            
+            
+              Restify
+            
           
    
-        
-      
    
-      
    
-        
    Works With Popular Server Frameworks
    
-        
-      
    
-      
    
-        
    Temple Loves Developers!
    
-        
    
-          
-            
    Im a vue developer. No need for this. OSSPH does not support this project.
    
-              
-          
-            
    Temple? Never heard of it...
    "The Name..."
    
-              
-          
-            
    Temple is good news for Node developers. I'm a rust developer so it don't matter to me.
    
-              
-          
-            
    Temple copied this section from us. We are the original.
    
-              
-          
-            
    After creating the Temple project, I am really excited to get back to ReactJS.
    
-              
-          
-            
    Temple? no thanks. Keep your stack front end. App router for life.
    
-              
         
    
-      
    
-      
    
-        
    What are you waiting for?
    
-        
-          Get Started
-        
-        
-          Read the Docs
-        
-      
    
-      
    
-        
+        
    
+          
    
+            Temple Loves Developers!
+          
    
+          
    
+            
+              
    Im a vue developer. No need for this. OSSPH does not support this project.
    
+                
+            
+              
    Temple? Never heard of it...
    "The Name..."
    
+                
+            
+              
    Temple is good news for Node developers. I'm a rust developer so it don't matter to me.
    
+                
+            
+              
    Temple copied this section from us. We are the original.
    
+                
+            
+              
    After creating the Temple project, I am really excited to get back to ReactJS.
    
+                
+            
+              
    Temple? no thanks. Keep your stack front end. App router for life.
    
+                
+          
    
+        
    
+        
    
+          
    
+            What are you waiting for?
+          
    
+          
+            Get Started
+          
+          
+            Read the Docs
+          
+        
    
+        
    
+      
+    
   
 
\ No newline at end of file
diff --git a/docs/build/client/f01cefc94e8ee605f3f5.js b/docs/build/client/f01cefc94e8ee605f3f5.js
index fea9ca0..fd986cd 100644
--- a/docs/build/client/f01cefc94e8ee605f3f5.js
+++ b/docs/build/client/f01cefc94e8ee605f3f5.js
@@ -1,191 +1,36 @@
-var TempleAPI=(()=>{var jt=Object.create;var Te=Object.defineProperty;var St=Object.getOwnPropertyDescriptor;var Ct=Object.getOwnPropertyNames;var Ot=Object.getPrototypeOf,Dt=Object.prototype.hasOwnProperty;var D=(t,e)=>()=>(e||t((e={exports:{}}).exports,e),e.exports),Mt=(t,e)=>{for(var r in e)Te(t,r,{get:e[r],enumerable:!0})},tt=(t,e,r,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let n of Ct(e))!Dt.call(t,n)&&n!==r&&Te(t,n,{get:()=>e[n],enumerable:!(i=St(e,n))||i.enumerable});return t};var M=(t,e,r)=>(r=t!=null?jt(Ot(t)):{},tt(e||!t||!t.__esModule?Te(r,"default",{value:t,enumerable:!0}):r,t)),$t=t=>tt(Te({},"__esModule",{value:!0}),t);var He=D(Ie=>{"use strict";Object.defineProperty(Ie,"__esModule",{value:!0});var Ne=class extends Error{static for(e,...r){return r.forEach(function(i){e=e.replace("%s",i)}),new this(e)}static forErrorsFound(e){let r=new this("Invalid Parameters");return r.errors=e,r}static require(e,r,...i){if(!e){for(let n of i)r=r.replace("%s",n);throw new this(r)}}constructor(e,r=500){super(),this.errors={},this.start=0,this.end=0,this.message=e,this.name=this.constructor.name,this.code=r}withCode(e){return this.code=e,this}withPosition(e,r){return this.start=e,this.end=r,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};Ie.default=Ne});var oe=D(le=>{"use strict";Object.defineProperty(le,"__esModule",{value:!0});le.TempleEmitter=void 0;var Ee=class extends EventTarget{emit(e,r){return this.dispatchEvent(new CustomEvent(e,{detail:r})),this}on(e,r){if(e==="ready"&&document.readyState!=="loading"){let i=new CustomEvent("ready");return setTimeout(()=>r(i),1),this}return this.addEventListener(e,r),this}once(e,r){let i=n=>{this.unbind(e,i),r(n)};return this.on(e,i),this}unbind(e,r){return this.removeEventListener(e,r),this}};le.TempleEmitter=Ee;var rt=new Ee;document.onreadystatechange=()=>{document.readyState!=="loading"&&rt.emit("ready")};le.default=rt});var Ue=D(ue=>{"use strict";var Lt=ue&&ue.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ue,"__esModule",{value:!0});var Be=Lt(oe()),Ge=class{get attributes(){return Object.assign({},this._attributes)}get element(){return this._element}constructor(e,r){this._element=e,this._attributes=r}hasAttribute(e){return e in this._attributes}getAttribute(e){return this._attributes[e]}removeAttribute(e,r=!1){let i=this.getAttribute(e);return typeof i>"u"?this:(delete this._attributes[e],this._element.removeAttribute(e),r||Be.default.emit("attribute-remove",{element:this,key:e,previous:i}),this)}setAttribute(e,r,i=!1){if(typeof r>"u")return this.removeAttribute(e,i);let n=this.getAttribute(e);return n===r?this:(this._attributes[e]=r,typeof r=="string"&&this._element.setAttribute(e,r),i||(typeof n>"u"?Be.default.emit("attribute-create",{element:this,key:e,value:r}):Be.default.emit("attribute-update",{element:this,key:e,value:r,previous:n})),this)}setAttributes(e,r=!1){for(let[n,f]of Object.entries(e))this.setAttribute(n,f,r);let i=Object.keys(e);for(let n of Object.keys(this._attributes))i.includes(n)||this.removeAttribute(n,r);return this}};ue.default=Ge});var Fe=D(ce=>{"use strict";var qt=ce&&ce.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ce,"__esModule",{value:!0});var Rt=qt(Ue()),ke=class{static get elements(){return this._elements}static createComponent(e,r,i,n=[]){let f=document.createElement("template");f.innerHTML=`<${e}>`;let h=f.content.querySelector(`${e}`);Object.setPrototypeOf(h,r.prototype),h.constructor=r.constructor,h.constructor.component=r.component;for(let[x,k]of Object.entries(i))typeof k=="string"?h.setAttribute(x,k):k===!0&&h.setAttribute(x,x);return h._TempleAttributes=i,h.props=i,n.forEach(x=>h.appendChild(x)),h.register(),customElements.get(e)||h.connectedCallback(),this.register(h,i)}static createElement(e,r,i=[]){let n=document.createElement(e);for(let[f,m]of Object.entries(r))typeof m=="string"?n.setAttribute(f,m):m===!0&&n.setAttribute(f,f);return i.filter(f=>typeof f<"u").forEach(f=>n.appendChild(f)),this.register(n,r)}static createText(e,r=!1){return document.createTextNode(e)}static filter(e){let r=[];return this._elements.forEach((i,n)=>{e(i,n)&&r.push(i)}),r}static get(e){return this._elements.get(e)||null}static has(e){return this._elements.has(e)}static map(e){let r=[];return this._elements.forEach((i,n)=>{r.push(e(i,n))}),r}static register(e,r){if(this.has(e))return this.get(e);let i=new Rt.default(e,r||{});return this._elements.set(e,i),i}};ke._elements=new Map;ce.default=ke});var G=D(de=>{"use strict";Object.defineProperty(de,"__esModule",{value:!0});de.TempleDataMap=void 0;var Pe=class{constructor(){window.__APP_DATA__||(window.__APP_DATA__={})}clear(){return window.__APP_DATA__={},this}delete(e){return this.has(e)?(delete window.__APP_DATA__[e],!0):!1}entries(){return Object.entries(window.__APP_DATA__)}has(e){return e in window.__APP_DATA__}get(e){return window.__APP_DATA__[e]}keys(){return Object.keys(window.__APP_DATA__)}set(e,r){return window.__APP_DATA__[e]=r,this}values(){return Object.values(window.__APP_DATA__)}};de.TempleDataMap=Pe;var zt=new Pe;de.default=zt});var st=D(fe=>{"use strict";var Je=fe&&fe.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(fe,"__esModule",{value:!0});var pe=Je(Fe()),je=Je(oe()),nt=Je(G()),Ze=class t extends HTMLElement{constructor(){super(...arguments),this._initiated=!1,this._template=null,this._attributes={},this._props={},this._children=void 0,this._rendering=!1}static register(){customElements.define(this.component[0],this)}get attr(){return this._attributes}get element(){return pe.default.has(this)?pe.default.get(this):pe.default.register(this,this._TempleAttributes||{})}get metadata(){let[e,r]=this.constructor.component;return{tagname:e,classname:r}}get originalChildren(){return this._children}get initiated(){return this._initiated}get props(){return this._props}set props(e){this._props=Object.assign({},e),this._attributes=Object.fromEntries(Object.entries(e).filter(r=>typeof r[1]=="string"||r[1]===!0))}adoptedCallback(){this.render()}attributeChangedCallback(e,r,i){this.props=Object.assign(Object.assign({},this.props),{[e]:i}),this.render()}connectedCallback(){this.wait()}disconnectedCallback(){}getParentComponent(){let e=this.parentElement;for(;e;){if(e instanceof t)return e;e=e.parentElement}return null}register(){pe.default.register(this,this._props)}render(){let e=this.getParentComponent();if(e&&!e.initiated)return;if(this._rendering)return;this._rendering=!0,nt.default.set("current",this);let r=this.styles();this._template?je.default.emit("unmounted",this):this._template=this.template();let i=this._template().filter(Boolean);if(r.length===0)this.textContent="",i.forEach(n=>this.appendChild(n));else{this.shadowRoot||this.attachShadow({mode:"open"});let n=this.shadowRoot;this.textContent="",n.textContent="";let f=document.createElement("style");f.innerText=r,n.appendChild(f),i.forEach(m=>{var h;return(h=this.shadowRoot)===null||h===void 0?void 0:h.appendChild(m)})}return nt.default.delete("current"),this._initiated=!0,je.default.emit("mounted",this),this._rendering=!1,this.shadowRoot?this.shadowRoot.innerHTML:this.innerHTML}wait(){if(document.readyState!=="loading")this._update();else{let e=()=>{this._update(),je.default.unbind("ready",e)};je.default.on("ready",e)}}_toNodeList(e){return e instanceof Node?[e]:Array.isArray(e)&&e.every(r=>r instanceof Node)?e:[pe.default.createText(String(e))]}_update(){typeof this._children>"u"&&(this._children=Array.from(this.childNodes||[]));let e=this.element;e&&(this.props=Object.assign({},e.attributes),this.render()),this._initiated||this.render()}};fe.default=Ze});var at=D(ge=>{"use strict";var Nt=ge&&ge.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ge,"__esModule",{value:!0});var It=Nt(G());function Ht(t){let e=It.default.get("env")||{};return t?e[t]||null:e}ge.default=Ht});var We=D(me=>{"use strict";var Bt=me&&me.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(me,"__esModule",{value:!0});me.default=Gt;var it=Bt(G());function Gt(t=null){return t||(t=it.default.get("current")||null),t?t==="document"?it.default.get("props")||{}:t.props:{}}});var lt=D(he=>{"use strict";var Ut=he&&he.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(he,"__esModule",{value:!0});he.default=Jt;var Zt=Ut(We());function Jt(t=null){return(0,Zt.default)(t).class}});var ut=D(Y=>{"use strict";var Wt=Y&&Y.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Y,"__esModule",{value:!0});Y.innerHTML=Kt;Y.default=ot;var Yt=Wt(G());function Kt(t=null){let e=ot(t),r=document.createElement("template");return r.append(...e),r.innerHTML}function ot(t=null){return t||(t=Yt.default.get("current")||null),t?t.originalChildren||[]:[]}});var pt=D(U=>{"use strict";var dt=U&&U.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(U,"__esModule",{value:!0});U.SignalRegistry=void 0;U.default=Qt;var ct=dt(He()),Xt=dt(G()),K=class t{static observe(e,r){let i={getter:()=>n.raw,setter:m=>m},n={raw:r,getter(m){return i.getter=m,n},setter(m){return i.setter=m,n}};Object.defineProperty(n,"value",{get(){return i.getter()},set(m){let h=i.setter(m),x=t.serialize(h)!==t.serialize(n.raw);n.raw=h,x&&e.render()}});let f=this._observers.get(e);return f?(f.observed++,f.values.push(n)):this._observers.set(e,{observed:1,values:[n]}),n}static observer(e){return this._observers.get(e)||null}static serialize(e){return JSON.stringify(e)}};U.SignalRegistry=K;K._observers=new Map;function Qt(t,e=null){if(e||(e=Xt.default.get("current")||null),!e)throw ct.default.for("Signals can only be created within a Temple component");if(!e.initiated)return K.observe(e,t);let r=K.observer(e);if(!r)throw ct.default.for("State mismatch");return r.values[r.observed++%r.values.length]}});var bt=D(Se=>{"use strict";var gt=Se&&Se.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Se,"__esModule",{value:!0});var ft=gt(Fe()),mt=gt(oe()),ht=(t,e)=>Array.from(t.querySelectorAll("*")).filter(r=>{let i=ft.default.get(r);return i&&i.hasAttribute(e)}).map(r=>ft.default.get(r));function Ye(t,e){mt.default.on("mounted",r=>{if(!r.detail)return;let i=r.detail;ht(i.shadowRoot||i,t).forEach(e)})}function Vt(t,e){mt.default.on("unmounted",r=>{if(!r.detail)return;let i=r.detail;ht(i.shadowRoot||i,t).forEach(e)})}Ye("mount",t=>{let e=t.getAttribute("mount");if(typeof e=="function"){let r=new CustomEvent("mount",{detail:{node:t,target:t.element}});e(r)}});Vt("unmount",t=>{let e=t.getAttribute("unmount");if(typeof e=="function"){let r=new CustomEvent("unmount",{detail:{node:t,target:t.element}});e(r)}});Ye("if",t=>{let e=t.getAttribute("if");(e===!1||e==="false"||typeof e=="function"&&!e())&&t.element.remove()});["click","dblclick","mousedown","mouseup","mousemove","mouseover","mouseout","wheel","keydown","keypress","keyup","blur","change","contextmenu","focus","input","submit","invalid","reset","search","select","copy","cut","paste","drag","dragstart","dragend","dragover","dragenter","dragleave","drop","scroll","durationchange","ended","error","loadeddata","loadedmetadata","loadstart","pause","play","playing","progress","ratechange","seeked","seeking","stalled","suspend","timeupdate","volumechange","waiting","animationstart","animationend","animationiteration","transitionend","toggle"].forEach(t=>Ye(t,e=>{let r=e.getAttribute(t);typeof r=="function"&&(e.element.removeEventListener(t,r),e.element.addEventListener(t,r))}))});var Ke=D(g=>{"use strict";var er=g&&g.__createBinding||(Object.create?function(t,e,r,i){i===void 0&&(i=r);var n=Object.getOwnPropertyDescriptor(e,r);(!n||("get"in n?!e.__esModule:n.writable||n.configurable))&&(n={enumerable:!0,get:function(){return e[r]}}),Object.defineProperty(t,i,n)}:function(t,e,r,i){i===void 0&&(i=r),t[i]=e[r]}),tr=g&&g.__setModuleDefault||(Object.create?function(t,e){Object.defineProperty(t,"default",{enumerable:!0,value:e})}:function(t,e){t.default=e}),Ce=g&&g.__importStar||function(t){if(t&&t.__esModule)return t;var e={};if(t!=null)for(var r in t)r!=="default"&&Object.prototype.hasOwnProperty.call(t,r)&&er(e,t,r);return tr(e,t),e},Z=g&&g.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(g,"__esModule",{value:!0});g.SignalRegistry=g.TempleException=g.TempleEmitter=g.TempleElement=g.TempleRegistry=g.TempleComponent=g.TempleDataMap=g.emitter=g.signal=g.innerHTML=g.children=g.classnames=g.props=g.env=g.data=void 0;var rr=Z(He());g.TempleException=rr.default;var nr=Z(st());g.TempleComponent=nr.default;var sr=Z(Fe());g.TempleRegistry=sr.default;var ar=Z(Ue());g.TempleElement=ar.default;var _t=Ce(oe());g.emitter=_t.default;Object.defineProperty(g,"TempleEmitter",{enumerable:!0,get:function(){return _t.TempleEmitter}});var vt=Ce(G());g.data=vt.default;Object.defineProperty(g,"TempleDataMap",{enumerable:!0,get:function(){return vt.TempleDataMap}});var ir=Z(at());g.env=ir.default;var lr=Z(We());g.props=lr.default;var or=Z(lt());g.classnames=or.default;var xt=Ce(ut());g.children=xt.default;Object.defineProperty(g,"innerHTML",{enumerable:!0,get:function(){return xt.innerHTML}});var yt=Ce(pt());g.signal=yt.default;Object.defineProperty(g,"SignalRegistry",{enumerable:!0,get:function(){return yt.SignalRegistry}});bt()});var I=D((Fr,wt)=>{wt.exports={...Ke()}});var J=D((jr,At)=>{At.exports={...Ke()}});var Tt=D((Cr,De)=>{var ur=typeof window<"u"?window:typeof WorkerGlobalScope<"u"&&self instanceof WorkerGlobalScope?self:{};var c=function(t){var e=/(?:^|\s)lang(?:uage)?-([\w-]+)(?=\s|$)/i,r=0,i={},n={manual:t.Prism&&t.Prism.manual,disableWorkerMessageHandler:t.Prism&&t.Prism.disableWorkerMessageHandler,util:{encode:function a(s){return s instanceof f?new f(s.type,a(s.content),s.alias):Array.isArray(s)?s.map(a):s.replace(/&/g,"&").replace(/"u")return null;if("currentScript"in document)return document.currentScript;try{throw new Error}catch(o){var a=(/at [^(\r\n]*\((.*):[^:]+:[^:]+\)$/i.exec(o.stack)||[])[1];if(a){var s=document.getElementsByTagName("script");for(var l in s)if(s[l].src==a)return s[l]}return null}},isActive:function(a,s,l){for(var o="no-"+s;a;){var u=a.classList;if(u.contains(s))return!0;if(u.contains(o))return!1;a=a.parentElement}return!!l}},languages:{plain:i,plaintext:i,text:i,txt:i,extend:function(a,s){var l=n.util.clone(n.languages[a]);for(var o in s)l[o]=s[o];return l},insertBefore:function(a,s,l,o){o=o||n.languages;var u=o[a],p={};for(var b in u)if(u.hasOwnProperty(b)){if(b==s)for(var d in l)l.hasOwnProperty(d)&&(p[d]=l[d]);l.hasOwnProperty(b)||(p[b]=u[b])}var w=o[a];return o[a]=p,n.languages.DFS(n.languages,function(O,N){N===w&&O!=a&&(this[O]=p)}),p},DFS:function a(s,l,o,u){u=u||{};var p=n.util.objId;for(var b in s)if(s.hasOwnProperty(b)){l.call(s,b,s[b],o||b);var d=s[b],w=n.util.type(d);w==="Object"&&!u[p(d)]?(u[p(d)]=!0,a(d,l,null,u)):w==="Array"&&!u[p(d)]&&(u[p(d)]=!0,a(d,l,b,u))}}},plugins:{},highlightAll:function(a,s){n.highlightAllUnder(document,a,s)},highlightAllUnder:function(a,s,l){var o={callback:l,container:a,selector:'code[class*="language-"], [class*="language-"] code, code[class*="lang-"], [class*="lang-"] code'};n.hooks.run("before-highlightall",o),o.elements=Array.prototype.slice.apply(o.container.querySelectorAll(o.selector)),n.hooks.run("before-all-elements-highlight",o);for(var u=0,p;p=o.elements[u++];)n.highlightElement(p,s===!0,o.callback)},highlightElement:function(a,s,l){var o=n.util.getLanguage(a),u=n.languages[o];n.util.setLanguage(a,o);var p=a.parentElement;p&&p.nodeName.toLowerCase()==="pre"&&n.util.setLanguage(p,o);var b=a.textContent,d={element:a,language:o,grammar:u,code:b};function w(N){d.highlightedCode=N,n.hooks.run("before-insert",d),d.element.innerHTML=d.highlightedCode,n.hooks.run("after-highlight",d),n.hooks.run("complete",d),l&&l.call(d.element)}if(n.hooks.run("before-sanity-check",d),p=d.element.parentElement,p&&p.nodeName.toLowerCase()==="pre"&&!p.hasAttribute("tabindex")&&p.setAttribute("tabindex","0"),!d.code){n.hooks.run("complete",d),l&&l.call(d.element);return}if(n.hooks.run("before-highlight",d),!d.grammar){w(n.util.encode(d.code));return}if(s&&t.Worker){var O=new Worker(n.filename);O.onmessage=function(N){w(N.data)},O.postMessage(JSON.stringify({language:d.language,code:d.code,immediateClose:!0}))}else w(n.highlight(d.code,d.grammar,d.language))},highlight:function(a,s,l){var o={code:a,grammar:s,language:l};if(n.hooks.run("before-tokenize",o),!o.grammar)throw new Error('The language "'+o.language+'" has no grammar.');return o.tokens=n.tokenize(o.code,o.grammar),n.hooks.run("after-tokenize",o),f.stringify(n.util.encode(o.tokens),o.language)},tokenize:function(a,s){var l=s.rest;if(l){for(var o in l)s[o]=l[o];delete s.rest}var u=new x;return k(u,u.head,a),h(a,u,s,u.head,0),F(u)},hooks:{all:{},add:function(a,s){var l=n.hooks.all;l[a]=l[a]||[],l[a].push(s)},run:function(a,s){var l=n.hooks.all[a];if(!(!l||!l.length))for(var o=0,u;u=l[o++];)u(s)}},Token:f};t.Prism=n;function f(a,s,l,o){this.type=a,this.content=s,this.alias=l,this.length=(o||"").length|0}f.stringify=function a(s,l){if(typeof s=="string")return s;if(Array.isArray(s)){var o="";return s.forEach(function(w){o+=a(w,l)}),o}var u={type:s.type,content:a(s.content,l),tag:"span",classes:["token",s.type],attributes:{},language:l},p=s.alias;p&&(Array.isArray(p)?Array.prototype.push.apply(u.classes,p):u.classes.push(p)),n.hooks.run("wrap",u);var b="";for(var d in u.attributes)b+=" "+d+'="'+(u.attributes[d]||"").replace(/"/g,""")+'"';return"<"+u.tag+' class="'+u.classes.join(" ")+'"'+b+">"+u.content+""};function m(a,s,l,o){a.lastIndex=s;var u=a.exec(l);if(u&&o&&u[1]){var p=u[1].length;u.index+=p,u[0]=u[0].slice(p)}return u}function h(a,s,l,o,u,p){for(var b in l)if(!(!l.hasOwnProperty(b)||!l[b])){var d=l[b];d=Array.isArray(d)?d:[d];for(var w=0;w=p.reach);L+=P.value.length,P=P.next){var H=P.value;if(s.length>a.length)return;if(!(H instanceof f)){var xe=1,z;if(W){if(z=m(ve,L,a,be),!z||z.index>=a.length)break;var ye=z.index,Ft=z.index+z[0].length,B=L;for(B+=P.value.length;ye>=B;)P=P.next,B+=P.value.length;if(B-=P.value.length,L=B,P.value instanceof f)continue;for(var ie=P;ie!==s.tail&&(Bp.reach&&(p.reach=Re);var Ae=P.prev;qe&&(Ae=k(s,Ae,qe),L+=qe.length),y(s,Ae,xe);var Pt=new f(b,N?n.tokenize(we,N):we,_e,we);if(P=k(s,Ae,Pt),et&&k(s,P,et),xe>1){var ze={cause:b+","+w,reach:Re};h(a,s,l,P.prev,L,ze),p&&ze.reach>p.reach&&(p.reach=ze.reach)}}}}}}function x(){var a={value:null,prev:null,next:null},s={value:null,prev:a,next:null};a.next=s,this.head=a,this.tail=s,this.length=0}function k(a,s,l){var o=s.next,u={value:l,prev:s,next:o};return s.next=u,o.prev=u,a.length++,u}function y(a,s,l){for(var o=s.next,u=0;u/,greedy:!0},prolog:{pattern:/<\?[\s\S]+?\?>/,greedy:!0},doctype:{pattern:/"'[\]]|"[^"]*"|'[^']*')+(?:\[(?:[^<"'\]]|"[^"]*"|'[^']*'|<(?!!--)|)*\]\s*)?>/i,greedy:!0,inside:{"internal-subset":{pattern:/(^[^\[]*\[)[\s\S]+(?=\]>$)/,lookbehind:!0,greedy:!0,inside:null},string:{pattern:/"[^"]*"|'[^']*'/,greedy:!0},punctuation:/^$|[[\]]/,"doctype-tag":/^DOCTYPE/i,name:/[^\s<>'"]+/}},cdata:{pattern://i,greedy:!0},tag:{pattern:/<\/?(?!\d)[^\s>\/=$<%]+(?:\s(?:\s*[^\s>\/=]+(?:\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))|(?=[\s/>])))+)?\s*\/?>/,greedy:!0,inside:{tag:{pattern:/^<\/?[^\s>\/]+/,inside:{punctuation:/^<\/?/,namespace:/^[^\s>\/:]+:/}},"special-attr":[],"attr-value":{pattern:/=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+)/,inside:{punctuation:[{pattern:/^=/,alias:"attr-equals"},{pattern:/^(\s*)["']|["']$/,lookbehind:!0}]}},punctuation:/\/?>/,"attr-name":{pattern:/[^\s>\/]+/,inside:{namespace:/^[^\s>\/:]+:/}}}},entity:[{pattern:/&[\da-z]{1,8};/i,alias:"named-entity"},/&#x?[\da-f]{1,8};/i]};c.languages.markup.tag.inside["attr-value"].inside.entity=c.languages.markup.entity;c.languages.markup.doctype.inside["internal-subset"].inside=c.languages.markup;c.hooks.add("wrap",function(t){t.type==="entity"&&(t.attributes.title=t.content.replace(/&/,"&"))});Object.defineProperty(c.languages.markup.tag,"addInlined",{value:function(e,r){var i={};i["language-"+r]={pattern:/(^$)/i,lookbehind:!0,inside:c.languages[r]},i.cdata=/^$/i;var n={"included-cdata":{pattern://i,inside:i}};n["language-"+r]={pattern:/[\s\S]+/,inside:c.languages[r]};var f={};f[e]={pattern:RegExp(/(<__[^>]*>)(?:))*\]\]>|(?!)/.source.replace(/__/g,function(){return e}),"i"),lookbehind:!0,greedy:!0,inside:n},c.languages.insertBefore("markup","cdata",f)}});Object.defineProperty(c.languages.markup.tag,"addAttribute",{value:function(t,e){c.languages.markup.tag.inside["special-attr"].push({pattern:RegExp(/(^|["'\s])/.source+"(?:"+t+")"+/\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))/.source,"i"),lookbehind:!0,inside:{"attr-name":/^[^\s=]+/,"attr-value":{pattern:/=[\s\S]+/,inside:{value:{pattern:/(^=\s*(["']|(?!["'])))\S[\s\S]*(?=\2$)/,lookbehind:!0,alias:[e,"language-"+e],inside:c.languages[e]},punctuation:[{pattern:/^=/,alias:"attr-equals"},/"|'/]}}}})}});c.languages.html=c.languages.markup;c.languages.mathml=c.languages.markup;c.languages.svg=c.languages.markup;c.languages.xml=c.languages.extend("markup",{});c.languages.ssml=c.languages.xml;c.languages.atom=c.languages.xml;c.languages.rss=c.languages.xml;(function(t){var e=/(?:"(?:\\(?:\r\n|[\s\S])|[^"\\\r\n])*"|'(?:\\(?:\r\n|[\s\S])|[^'\\\r\n])*')/;t.languages.css={comment:/\/\*[\s\S]*?\*\//,atrule:{pattern:RegExp("@[\\w-](?:"+/[^;{\s"']|\s+(?!\s)/.source+"|"+e.source+")*?"+/(?:;|(?=\s*\{))/.source),inside:{rule:/^@[\w-]+/,"selector-function-argument":{pattern:/(\bselector\s*\(\s*(?![\s)]))(?:[^()\s]|\s+(?![\s)])|\((?:[^()]|\([^()]*\))*\))+(?=\s*\))/,lookbehind:!0,alias:"selector"},keyword:{pattern:/(^|[^\w-])(?:and|not|only|or)(?![\w-])/,lookbehind:!0}}},url:{pattern:RegExp("\\burl\\((?:"+e.source+"|"+/(?:[^\\\r\n()"']|\\[\s\S])*/.source+")\\)","i"),greedy:!0,inside:{function:/^url/i,punctuation:/^\(|\)$/,string:{pattern:RegExp("^"+e.source+"$"),alias:"url"}}},selector:{pattern:RegExp(`(^|[{}\\s])[^{}\\s](?:[^{};"'\\s]|\\s+(?![\\s{])|`+e.source+")*(?=\\s*\\{)"),lookbehind:!0},string:{pattern:e,greedy:!0},property:{pattern:/(^|[^-\w\xA0-\uFFFF])(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*(?=\s*:)/i,lookbehind:!0},important:/!important\b/i,function:{pattern:/(^|[^-a-z0-9])[-a-z0-9]+(?=\()/i,lookbehind:!0},punctuation:/[(){};:,]/},t.languages.css.atrule.inside.rest=t.languages.css;var r=t.languages.markup;r&&(r.tag.addInlined("style","css"),r.tag.addAttribute("style","css"))})(c);c.languages.clike={comment:[{pattern:/(^|[^\\])\/\*[\s\S]*?(?:\*\/|$)/,lookbehind:!0,greedy:!0},{pattern:/(^|[^\\:])\/\/.*/,lookbehind:!0,greedy:!0}],string:{pattern:/(["'])(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/,greedy:!0},"class-name":{pattern:/(\b(?:class|extends|implements|instanceof|interface|new|trait)\s+|\bcatch\s+\()[\w.\\]+/i,lookbehind:!0,inside:{punctuation:/[.\\]/}},keyword:/\b(?:break|catch|continue|do|else|finally|for|function|if|in|instanceof|new|null|return|throw|try|while)\b/,boolean:/\b(?:false|true)\b/,function:/\b\w+(?=\()/,number:/\b0x[\da-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:e[+-]?\d+)?/i,operator:/[<>]=?|[!=]=?=?|--?|\+\+?|&&?|\|\|?|[?*/~^%]/,punctuation:/[{}[\];(),.:]/};c.languages.javascript=c.languages.extend("clike",{"class-name":[c.languages.clike["class-name"],{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$A-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\.(?:constructor|prototype))/,lookbehind:!0}],keyword:[{pattern:/((?:^|\})\s*)catch\b/,lookbehind:!0},{pattern:/(^|[^.]|\.\.\.\s*)\b(?:as|assert(?=\s*\{)|async(?=\s*(?:function\b|\(|[$\w\xA0-\uFFFF]|$))|await|break|case|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally(?=\s*(?:\{|$))|for|from(?=\s*(?:['"]|$))|function|(?:get|set)(?=\s*(?:[#\[$\w\xA0-\uFFFF]|$))|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)\b/,lookbehind:!0}],function:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*(?:\.\s*(?:apply|bind|call)\s*)?\()/,number:{pattern:RegExp(/(^|[^\w$])/.source+"(?:"+(/NaN|Infinity/.source+"|"+/0[bB][01]+(?:_[01]+)*n?/.source+"|"+/0[oO][0-7]+(?:_[0-7]+)*n?/.source+"|"+/0[xX][\dA-Fa-f]+(?:_[\dA-Fa-f]+)*n?/.source+"|"+/\d+(?:_\d+)*n/.source+"|"+/(?:\d+(?:_\d+)*(?:\.(?:\d+(?:_\d+)*)?)?|\.\d+(?:_\d+)*)(?:[Ee][+-]?\d+(?:_\d+)*)?/.source)+")"+/(?![\w$])/.source),lookbehind:!0},operator:/--|\+\+|\*\*=?|=>|&&=?|\|\|=?|[!=]==|<<=?|>>>?=?|[-+*/%&|^!=<>]=?|\.{3}|\?\?=?|\?\.?|[~:]/});c.languages.javascript["class-name"][0].pattern=/(\b(?:class|extends|implements|instanceof|interface|new)\s+)[\w.\\]+/;c.languages.insertBefore("javascript","keyword",{regex:{pattern:RegExp(/((?:^|[^$\w\xA0-\uFFFF."'\])\s]|\b(?:return|yield))\s*)/.source+/\//.source+"(?:"+/(?:\[(?:[^\]\\\r\n]|\\.)*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}/.source+"|"+/(?:\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.)*\])*\])*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}v[dgimyus]{0,7}/.source+")"+/(?=(?:\s|\/\*(?:[^*]|\*(?!\/))*\*\/)*(?:$|[\r\n,.;:})\]]|\/\/))/.source),lookbehind:!0,greedy:!0,inside:{"regex-source":{pattern:/^(\/)[\s\S]+(?=\/[a-z]*$)/,lookbehind:!0,alias:"language-regex",inside:c.languages.regex},"regex-delimiter":/^\/|\/$/,"regex-flags":/^[a-z]+$/}},"function-variable":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*[=:]\s*(?:async\s*)?(?:\bfunction\b|(?:\((?:[^()]|\([^()]*\))*\)|(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)\s*=>))/,alias:"function"},parameter:[{pattern:/(function(?:\s+(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)?\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\))/,lookbehind:!0,inside:c.languages.javascript},{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$a-z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*=>)/i,lookbehind:!0,inside:c.languages.javascript},{pattern:/(\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*=>)/,lookbehind:!0,inside:c.languages.javascript},{pattern:/((?:\b|\s|^)(?!(?:as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)(?![$\w\xA0-\uFFFF]))(?:(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*)\(\s*|\]\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*\{)/,lookbehind:!0,inside:c.languages.javascript}],constant:/\b[A-Z](?:[A-Z_]|\dx?)*\b/});c.languages.insertBefore("javascript","string",{hashbang:{pattern:/^#!.*/,greedy:!0,alias:"comment"},"template-string":{pattern:/`(?:\\[\s\S]|\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}|(?!\$\{)[^\\`])*`/,greedy:!0,inside:{"template-punctuation":{pattern:/^`|`$/,alias:"string"},interpolation:{pattern:/((?:^|[^\\])(?:\\{2})*)\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}/,lookbehind:!0,inside:{"interpolation-punctuation":{pattern:/^\$\{|\}$/,alias:"punctuation"},rest:c.languages.javascript}},string:/[\s\S]+/}},"string-property":{pattern:/((?:^|[,{])[ \t]*)(["'])(?:\\(?:\r\n|[\s\S])|(?!\2)[^\\\r\n])*\2(?=\s*:)/m,lookbehind:!0,greedy:!0,alias:"property"}});c.languages.insertBefore("javascript","operator",{"literal-property":{pattern:/((?:^|[,{])[ \t]*)(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*:)/m,lookbehind:!0,alias:"property"}});c.languages.markup&&(c.languages.markup.tag.addInlined("script","javascript"),c.languages.markup.tag.addAttribute(/on(?:abort|blur|change|click|composition(?:end|start|update)|dblclick|error|focus(?:in|out)?|key(?:down|up)|load|mouse(?:down|enter|leave|move|out|over|up)|reset|resize|scroll|select|slotchange|submit|unload|wheel)/.source,"javascript"));c.languages.js=c.languages.javascript;(function(){if(typeof c>"u"||typeof document>"u")return;Element.prototype.matches||(Element.prototype.matches=Element.prototype.msMatchesSelector||Element.prototype.webkitMatchesSelector);var t="Loading\u2026",e=function(A,_){return"\u2716 Error "+A+" while fetching file: "+_},r="\u2716 Error: File does not exist or is empty",i={js:"javascript",py:"python",rb:"ruby",ps1:"powershell",psm1:"powershell",sh:"bash",bat:"batch",h:"c",tex:"latex"},n="data-src-status",f="loading",m="loaded",h="failed",x="pre[data-src]:not(["+n+'="'+m+'"]):not(['+n+'="'+f+'"])';function k(A,_,T){var a=new XMLHttpRequest;a.open("GET",A,!0),a.onreadystatechange=function(){a.readyState==4&&(a.status<400&&a.responseText?_(a.responseText):a.status>=400?T(e(a.status,a.statusText)):T(r))},a.send(null)}function y(A){var _=/^\s*(\d+)\s*(?:(,)\s*(?:(\d+)\s*)?)?$/.exec(A||"");if(_){var T=Number(_[1]),a=_[2],s=_[3];return a?s?[T,Number(s)]:[T,void 0]:[T,T]}}c.hooks.add("before-highlightall",function(A){A.selector+=", "+x}),c.hooks.add("before-sanity-check",function(A){var _=A.element;if(_.matches(x)){A.code="",_.setAttribute(n,f);var T=_.appendChild(document.createElement("CODE"));T.textContent=t;var a=_.getAttribute("data-src"),s=A.language;if(s==="none"){var l=(/\.(\w+)$/.exec(a)||[,"none"])[1];s=i[l]||l}c.util.setLanguage(T,s),c.util.setLanguage(_,s);var o=c.plugins.autoloader;o&&o.loadLanguages(s),k(a,function(u){_.setAttribute(n,m);var p=y(_.getAttribute("data-range"));if(p){var b=u.split(/\r\n?|\n/g),d=p[0],w=p[1]==null?b.length:p[1];d<0&&(d+=b.length),d=Math.max(0,Math.min(d-1,b.length)),w<0&&(w+=b.length),w=Math.max(0,Math.min(w,b.length)),u=b.slice(d,w).join(`
-`),_.hasAttribute("data-start")||_.setAttribute("data-start",String(d+1))}T.textContent=u,c.highlightElement(T)},function(u){_.setAttribute(n,h),T.textContent=u})}}),c.plugins.fileHighlight={highlight:function(_){for(var T=(_||document).querySelectorAll(x),a=0,s;s=T[a++];)c.highlightElement(s)}};var F=!1;c.fileHighlight=function(){F||(console.warn("Prism.fileHighlight is deprecated. Use `Prism.plugins.fileHighlight.highlight` instead."),F=!0),c.plugins.fileHighlight.highlight.apply(this,arguments)}})()});var pr={};Mt(pr,{BUILD_ID:()=>dr,TempleComponent:()=>S.TempleComponent,TempleElement:()=>S.TempleElement,TempleEmitter:()=>S.TempleEmitter,TempleException:()=>S.TempleException,TempleRegistry:()=>S.TempleRegistry,children:()=>S.children,components:()=>cr,data:()=>S.data,emitter:()=>S.emitter,props:()=>S.props,signal:()=>S.signal});var R=M(I());var Oe=M(I()),X=class extends Oe.TempleComponent{static component=["main","Main_fd7f1af6410c5b5c8e1f"];styles(){return""}template(){let e=this.props,r=()=>this.originalChildren;return()=>[Oe.TempleRegistry.createElement("main",{},[...this._toNodeList(r())]).element]}};var $=M(I()),V=M(J()),Q=class extends $.TempleComponent{static component=["button","Button_adebe13e99f6c9d5075e"];styles(){return`:host {
-    --black: #222222;
-    --white: #FCFCFC;
-    --info: #1474FC;
-    --error: #DC3545;
-    --warning: #FF7B07;
-    --success: #28A745;
-    --muted: #999999;
-    --primary: #E49F1A;
-    --secondary: #DA532C;
-  }
-
-  /* Text Colors
-  ---------------------------------*/
-  .tx-white {
-    color: var(--white);
-  }
-  .tx-info {
-    color: var(--info);
-  }
-  .tx-error {
-    color: var(--error);
-  }
-  .tx-warning {
-    color: var(--warning);
-  }
-  .tx-success {
-    color: var(--success);
-  }
-  .tx-muted {
-    color: var(--muted);
-  }
-  .tx-primary {
-    color: var(--primary);
-  }
-  .tx-secondary {
-    color: var(--secondary);
-  }
-  
-  /* Generic
-  ---------------------------------*/
-  .block {
-    display: block;
-  }
-  .full {
-    width: 100%;
-  }
-
-  /* Borders
-  ---------------------------------*/
-  .curved {
-    border-radius: 5px;
-  }
-  .rounded {
-    border-radius:12px;
-  }
-  .pill {
-    border-radius: 10000px;
-  }
-  .solid {
-    border-style: solid;
-  }
-  .dash {
-    border-style: dashed;
-  }
-  .dotted {
-    border-style: dotted;
-  }
-  .thin {
-    border-width: 1px;
-  }
-  .thick {
-    border-width: 5px;
-  }
-
-  .bd-info {
-    border-color: var(--info);
-  }
-  .bd-error {
-    border-color: var(--error);
-  }
-  .bd-warning {
-    border-color: var(--warning);
-  }
-  .bd-success {
-    border-color: var(--success);
-  }
-  .bd-muted {
-    border-color: var(--muted);
-  }
-  .bd-primary {
-    border-color: var(--primary);
-  }
-  .bd-secondary {
-    border-color: var(--secondary);
-  }
-
-  /* Backgrounds
-  ---------------------------------*/
-  .bg-white {
-    background-color: var(--white);
-  }
-  .bg-info {
-    background-color: var(--info);
-  }
-  .bg-error {
-    background-color: var(--error);
-  }
-  .bg-warning {
-    background-color: var(--warning);
-  }
-  .bg-success {
-    background-color: var(--success);
-  }
-  .bg-muted {
-    background-color: var(--muted);
-  }
-  .bg-primary {
-    background-color: var(--primary);
-  }
-  .bg-secondary {
-    background-color: var(--secondary);
-  }
-
-  /* Padding
-  ---------------------------------*/
-  .pd-xs {
-    padding: 2px 4px;
-  }
-  .pd-sm {
-    padding: 4px 8px;
-  }
-  .pd-md {
-    padding: 6px 12px;
-  }
-  .pd-lg {
-    padding: 8px 16px;
-  }
-  .pd-xl {
-    padding: 10px 20px;
-  }
-  .pd-2xl {
-    padding: 12px 24px;
-  }
-  .pd-3xl {
-    padding: 14px 28px;
-  }
-  .pd-4xl {
-    padding: 16px 32px;
-  }
-  .pd-5xl {
-    padding: 18px 36px;
-  }
-
-  /* Button
-  ---------------------------------*/
-  .button, .button:link, .button:hover, .button:active .button:visited {
-    border: 0;
-    display: inline-block;
-    text-align: center;
-    text-decoration: none;
-  }`}template(){let{block:e,full:r,color:i,xs:n,sm:f,md:m,lg:h,xl:x,xl2:k,xl3:y,xl4:F,xl5:A,curved:_,rounded:T,pill:a,info:s,warning:l,success:o,error:u,muted:p,primary:b,secondary:d,outline:w,transparent:O,solid:N,style:be,href:W,..._e}=(0,V.props)(),v={classes:["button"],styles:""};e&&v.classes.push("block"),r&&v.classes.push("full");let ve=n?"xs":f?"sm":m?"md":h?"lg":x?"xl":k?"2xl":y?"3xl":F?"4xl":A?"5xl":"md";v.classes.push(`pd-${ve}`);let P=w?"outline":O?"transparent":"solid";_?v.classes.push("curved"):T?v.classes.push("rounded"):a&&v.classes.push("pill"),P==="outline"||P==="transparent"?(v.classes.push("solid","thin"),P==="outline"&&v.classes.push("bg-white"),i?(v.styles+=`border-color: ${i};`,v.styles+=`color: ${i};`):s?v.classes.push("bd-info","tx-info"):l?v.classes.push("bd-warning","tx-warning"):o?v.classes.push("bd-success","tx-success"):u?v.classes.push("bd-error","tx-error"):p?v.classes.push("bd-muted","tx-muted"):b?v.classes.push("bd-primary","tx-primary"):d&&v.classes.push("bd-secondary","tx-secondary")):(v.classes.push("tx-white"),i?v.styles+=`background-color: ${i};`:s?v.classes.push("bg-info"):l?v.classes.push("bg-warning"):o?v.classes.push("bg-success"):u?v.classes.push("bg-error"):p?v.classes.push("bg-muted"):b?v.classes.push("bg-primary"):d&&v.classes.push("bg-secondary"));let L={classes:[...v.classes,(0,V.classnames)()].join(" "),styles:v.styles+be},H=(0,V.children)();return()=>[$.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/fontawesome/all.css"}).element,$.TempleRegistry.createText(`
-`,!1),...W?[$.TempleRegistry.createText(`
-  `,!1),$.TempleRegistry.createElement("a",{class:L.classes,style:L.styles,href:W,..._e},[$.TempleRegistry.createText(`
-    `,!1),...this._toNodeList(H),$.TempleRegistry.createText(`
-  `,!1)]).element,$.TempleRegistry.createText(`
-`,!1)]:[],$.TempleRegistry.createText(`
-`,!1),...W?[]:[$.TempleRegistry.createText(`
-  `,!1),$.TempleRegistry.createElement("button",{class:L.classes,style:L.styles,..._e},[$.TempleRegistry.createText(`
-    `,!1),...this._toNodeList(H),$.TempleRegistry.createText(`
-  `,!1)]).element,$.TempleRegistry.createText(`
-`,!1)]]}};var E=M(I()),Xe=M(Tt()),Et=M(J()),ee=class extends E.TempleComponent{static component=["code","Code_6f36bc13bb6a166c7abc"];styles(){return`:host {
+var TempleAPI=(()=>{var qt=Object.create;var Se=Object.defineProperty;var Rt=Object.getOwnPropertyDescriptor;var zt=Object.getOwnPropertyNames;var It=Object.getPrototypeOf,Ht=Object.prototype.hasOwnProperty;var O=(t,e)=>()=>(e||t((e={exports:{}}).exports,e),e.exports),Bt=(t,e)=>{for(var s in e)Se(t,s,{get:e[s],enumerable:!0})},ft=(t,e,s,a)=>{if(e&&typeof e=="object"||typeof e=="function")for(let r of zt(e))!Ht.call(t,r)&&r!==s&&Se(t,r,{get:()=>e[r],enumerable:!(a=Rt(e,r))||a.enumerable});return t};var F=(t,e,s)=>(s=t!=null?qt(It(t)):{},ft(e||!t||!t.__esModule?Se(s,"default",{value:t,enumerable:!0}):s,t)),Gt=t=>ft(Se({},"__esModule",{value:!0}),t);var he=O(Ve=>{"use strict";Object.defineProperty(Ve,"__esModule",{value:!0});var Qe=class extends Error{static for(e,...s){return s.forEach(function(a){e=e.replace("%s",a)}),new this(e)}static forErrorsFound(e){let s=new this("Invalid Parameters");return s.errors=e,s}static require(e,s,...a){if(!e){for(let r of a)s=s.replace("%s",r);throw new this(s)}}constructor(e,s=500){super(),this.errors={},this.start=0,this.end=0,this.message=e,this.name=this.constructor.name,this.code=s}withCode(e){return this.code=e,this}withPosition(e,s){return this.start=e,this.end=s,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};Ve.default=Qe});var Oe=O(M=>{"use strict";var Ut=M&&M.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(M,"__esModule",{value:!0});M.match=M.TempleEmitter=M.events=void 0;M.bindAttribute=W;M.unbindAttribute=mt;var pt=Ut(Me());M.events=["click","dblclick","mousedown","mouseup","mousemove","mouseover","mouseout","wheel","keydown","keypress","keyup","blur","change","contextmenu","focus","input","submit","invalid","reset","search","select","copy","cut","paste","drag","dragstart","dragend","dragover","dragenter","dragleave","drop","scroll","durationchange","ended","error","loadeddata","loadedmetadata","loadstart","pause","play","playing","progress","ratechange","seeked","seeking","stalled","suspend","timeupdate","volumechange","waiting","animationstart","animationend","animationiteration","transitionend","toggle"];var Ce=class extends EventTarget{emit(e,s){return this.dispatchEvent(new CustomEvent(e,{detail:s})),this}on(e,s){if(e==="ready"&&document.readyState!=="loading"){let a=new CustomEvent("ready");return setTimeout(()=>s(a),1),this}return this.addEventListener(e,s),this}once(e,s){let a=r=>{this.unbind(e,a),s(r)};return this.on(e,a),this}unbind(e,s){return this.removeEventListener(e,s),this}};M.TempleEmitter=Ce;var Wt=(t,e)=>Array.from(t.querySelectorAll("*")).filter(s=>{let a=pt.default.get(s),r=a&&a.hasAttribute(e)&&!a.hasEvent(e);return r&&a.addEvent(e),r}).map(s=>pt.default.get(s));M.match=Wt;function W(t,e){je.on("mounted",s=>{if(!s.detail)return;let a=s.detail;(0,M.match)(a.shadowRoot||a,t).forEach(e)})}function mt(t,e){je.on("unmounted",s=>{if(!s.detail)return;let a=s.detail;(0,M.match)(a.shadowRoot||a,t).forEach(e)})}var je=new Ce;M.default=(document.onreadystatechange=()=>{document.readyState!=="loading"&&je.emit("ready")},W("mount",t=>{let e=t.getAttribute("mount");if(typeof e=="function"){let s=new CustomEvent("mount",{detail:{node:t,target:t.element}});e(s)}}),mt("unmount",t=>{let e=t.getAttribute("unmount");if(typeof e=="function"){let s=new CustomEvent("unmount",{detail:{node:t,target:t.element}});e(s)}}),W("connect",t=>{let e=t.getAttribute("connect");if(typeof e=="function"){let s=new CustomEvent("connect",{detail:{node:t,target:t.element}});e(s)}}),W("disconnect",t=>{let e=t.getAttribute("disconnect");if(typeof e=="function"){let s=new CustomEvent("disconnect",{detail:{node:t,target:t.element}});e(s)}}),W("adopt",t=>{let e=t.getAttribute("adopt");if(typeof e=="function"){let s=new CustomEvent("adopt",{detail:{node:t,target:t.element}});e(s)}}),W("if",t=>{let e=t.getAttribute("if");(e===!1||e==="false"||typeof e=="function"&&!e())&&t.element.remove()}),M.events.forEach(t=>W(t,e=>{let s=e.getAttribute(t);typeof s=="function"&&(e.element.removeEventListener(t,s),e.element.addEventListener(t,s))})),je)});var st=O(ge=>{"use strict";var Zt=ge&&ge.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ge,"__esModule",{value:!0});var et=Zt(Oe()),tt=class{get attributes(){return Object.assign({},this._attributes)}get element(){return this._element}get events(){return this._events}constructor(e,s){this._events=new Set,this._element=e,this._attributes=s}addEvent(e){return this._events.add(e),this}getAttribute(e){return this._attributes[e]}hasAttribute(e){return e in this._attributes}hasEvent(e){return this._events.has(e)}removeAttribute(e,s=!1){let a=this.getAttribute(e);return typeof a>"u"?this:(delete this._attributes[e],this._element.removeAttribute(e),s||et.default.emit("attribute-remove",{element:this,key:e,previous:a}),this)}setAttribute(e,s,a=!1){if(typeof s>"u")return this.removeAttribute(e,a);let r=this.getAttribute(e);return r===s?this:(this._attributes[e]=s,typeof s=="string"&&this._element.setAttribute(e,s),a||(typeof r>"u"?et.default.emit("attribute-create",{element:this,key:e,value:s}):et.default.emit("attribute-update",{element:this,key:e,value:s,previous:r})),this)}setAttributes(e,s=!1){for(let[r,u]of Object.entries(e))this.setAttribute(r,u,s);let a=Object.keys(e);for(let r of Object.keys(this._attributes))a.includes(r)||this.removeAttribute(r,s);return this}};ge.default=tt});var Me=O(be=>{"use strict";var Jt=be&&be.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(be,"__esModule",{value:!0});var Yt=Jt(st()),ht=document.createElement("textarea"),Kt=t=>(ht.innerHTML=t,ht.value),De=class{static get elements(){return this._elements}static createComponent(e,s,a,r=[]){let u=document.createElement("template");u.innerHTML=`<${e}>`;let g=u.content.querySelector(`${e}`);return Object.setPrototypeOf(g,s.prototype),g.constructor=s.constructor,g.constructor.component=s.component,g.register(a,r),g.element}static createElement(e,s,a=[]){let r=document.createElement(e);for(let[u,_]of Object.entries(s))typeof _=="string"?r.setAttribute(u,_):_===!0&&r.setAttribute(u,u);return a.filter(u=>typeof u<"u").forEach(u=>r.appendChild(u)),this.register(r,s)}static createText(e,s=!0){return document.createTextNode(Kt(e))}static filter(e){let s=[];return this._elements.forEach((a,r)=>{e(a,r)&&s.push(a)}),s}static get(e){return this._elements.get(e)||null}static has(e){return this._elements.has(e)}static map(e){let s=[];return this._elements.forEach((a,r)=>{s.push(e(a,r))}),s}static register(e,s){if(this.has(e))return this.get(e);let a=new Yt.default(e,s||{});return this._elements.set(e,a),a}};De._elements=new Map;be.default=De});var ee=O(xe=>{"use strict";Object.defineProperty(xe,"__esModule",{value:!0});xe.TempleDataMap=void 0;var $e=class{constructor(){window.__APP_DATA__||(window.__APP_DATA__={})}clear(){return window.__APP_DATA__={},this}delete(e){return this.has(e)?(delete window.__APP_DATA__[e],!0):!1}entries(){return Object.entries(window.__APP_DATA__)}has(e){return e in window.__APP_DATA__}get(e){return window.__APP_DATA__[e]}keys(){return Object.keys(window.__APP_DATA__)}set(e,s){return window.__APP_DATA__[e]=s,this}values(){return Object.values(window.__APP_DATA__)}};xe.TempleDataMap=$e;var Xt=new $e;xe.default=Xt});var bt=O(_e=>{"use strict";var qe=_e&&_e.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(_e,"__esModule",{value:!0});var gt=qe(he()),Z=qe(Me()),J=qe(Oe()),Ne=qe(ee()),rt=class t extends HTMLElement{static register(){customElements.define(this.component[0],this)}get attr(){return Object.fromEntries(Array.from(this.attributes).map(e=>[e.name,e.value]))}get element(){if(!Z.default.has(this))throw gt.default.for("Component not mapped.");return Z.default.get(this)}get metadata(){let[e,s]=this.constructor.component;return{tagname:e,classname:s}}get originalChildren(){return this._children}get initiated(){return this._initiated}get props(){return this.getAttributes()}get virtual(){return this._virtual}set props(e){this.setAttributes(e)}constructor(){if(super(),this._initiated=!1,this._template=null,this._children=void 0,this._rendering=!1,this._observer=null,this._virtual=!1,!Z.default.has(this))throw gt.default.for("Component not mapped.")}adoptedCallback(){this.render(),J.default.emit("adopt",this)}connectedCallback(){this.wait(),J.default.emit("connect",this)}disconnectedCallback(){J.default.emit("disconnect",this)}getAttribute(e){return this.element.getAttribute(e)}getAttributes(){return Object.assign({},this.element.attributes)}getParentComponent(){let e=this.parentElement;for(;e;){if(e instanceof t)return e;e=e.parentElement}return null}hasAttribute(e){return this.element.hasAttribute(e)}register(e={},s=[]){Z.default.has(this)?Z.default.get(this).setAttributes(e):Z.default.register(this,e);for(let[a,r]of Object.entries(e))typeof r=="string"?super.setAttribute(a,r):r===!0&&super.setAttribute(a,a);this._children=s,this._virtual=!0,this.connectedCallback()}removeAttribute(e){this.hasAttribute(e)&&this.element.removeAttribute(e),super.hasAttribute(e)&&super.removeAttribute(e)}render(){let e=this.getParentComponent();if(e&&!e.initiated)return;if(this._rendering)return;this._rendering=!0;let s=Ne.default.get("current");Ne.default.set("current",this);let a=this.styles();this._template?J.default.emit("unmounted",this):this._template=this.template();let r=this._template().filter(Boolean);if(a.length===0)this.textContent="",r.forEach(u=>this.appendChild(u));else{this.shadowRoot||this.attachShadow({mode:"open"});let u=this.shadowRoot;this.textContent="",u.textContent="";let _=document.createElement("style");_.innerText=a,u.appendChild(_),r.forEach(g=>{var y;return(y=this.shadowRoot)===null||y===void 0?void 0:y.appendChild(g)})}return s?Ne.default.set("current",s):Ne.default.delete("current"),this._initiated=!0,this._rendering=!1,J.default.emit("mounted",this),this.shadowRoot?this.shadowRoot.innerHTML:this.innerHTML}setAttribute(e,s){this.element.setAttribute(e,s),(typeof s=="string"||s===!0)&&super.setAttribute(e,s)}setAttributes(e){this.element.setAttributes(e)}wait(){if(document.readyState!=="loading")this._update();else{let e=()=>{this._update(),J.default.unbind("ready",e)};J.default.on("ready",e)}}_toNodeList(e){return e instanceof Node?[e]:Array.isArray(e)&&e.every(s=>s instanceof Node)?e:[Z.default.createText(String(e))]}_update(){typeof this._children>"u"&&(this._children=Array.from(this.childNodes||[])),this._initiated||this.render()}};_e.default=rt});var te=O(ve=>{"use strict";var xt=ve&&ve.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ve,"__esModule",{value:!0});ve.default=es;var Qt=xt(he()),Vt=xt(ee());function es(t=null,e=!1){if(!t&&(t=Vt.default.get("current"),!t)){if(!e)throw Qt.default.for("Not called within a Temple component");return null}return t}});var _t=O(ye=>{"use strict";var ts=ye&&ye.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ye,"__esModule",{value:!0});var ss=ts(ee());function rs(t){let e=ss.default.get("env")||{};return t?e[t]||null:e}ye.default=rs});var nt=O(we=>{"use strict";var vt=we&&we.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(we,"__esModule",{value:!0});we.default=is;var ns=vt(te()),as=vt(ee());function is(t=null){let e=(0,ns.default)(t,!0);return typeof e=="string"?as.default.get("props")||{}:e?e.props:{}}});var wt=O(se=>{"use strict";var yt=se&&se.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(se,"__esModule",{value:!0});se.classlist=cs;se.default=us;var ls=yt(te()),os=yt(nt());function cs(t=null){var e;if(t==="body")return document.body.classList;if(t==="head")return document.head.classList;if(t==="document")return(e=document.body.parentElement)===null||e===void 0?void 0:e.classList;let s=(0,ls.default)(t);return s?.classList}function us(t=null){return(0,os.default)(t).class}});var At=O(Y=>{"use strict";var ds=Y&&Y.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Y,"__esModule",{value:!0});Y.innerHTML=ps;Y.innerText=ms;Y.default=at;var fs=ds(te());function ps(t=null){let e=at(t),s=document.createElement("template");return s.append(...e.map(a=>a.cloneNode(!0))),s.innerHTML}function ms(t=null){let e=at(t),s=document.createElement("template");return s.append(...e.map(a=>a.cloneNode(!0))),s.innerText}function at(t=null){let e=(0,fs.default)(t,!0);return typeof e!="string"&&e?e.originalChildren||[]:[]}});var Et=O(K=>{"use strict";var Tt=K&&K.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(K,"__esModule",{value:!0});K.SignalRegistry=void 0;K.default=bs;var hs=Tt(te()),gs=Tt(he()),re=class t{static observe(e,s){let a={getter:()=>u.raw,setter:g=>g},r=new Set,u={raw:s,change(g){r.add(g)},getter(g){return a.getter=g,u},setter(g){return a.setter=g,u}};Object.defineProperty(u,"value",{get(){return a.getter()},set(g){let y=a.setter(g),A=t.serialize(y)!==t.serialize(u.raw);u.raw=y,A&&(r.forEach(b=>b(y)),e.render())}});let _=this._observers.get(e);return _?(_.observed++,_.values.push(u)):this._observers.set(e,{observed:1,values:[u]}),u}static observer(e){return this._observers.get(e)||null}static serialize(e){return JSON.stringify(e)}};K.SignalRegistry=re;re._observers=new Map;function bs(t,e=null){let s=(0,hs.default)(e);if(!s.initiated)return re.observe(s,t);let a=re.observer(s);if(!a)throw gs.default.for("Signal state mismatch");return a.values[a.observed++%a.values.length]}});var lt=O(h=>{"use strict";var xs=h&&h.__createBinding||(Object.create?function(t,e,s,a){a===void 0&&(a=s);var r=Object.getOwnPropertyDescriptor(e,s);(!r||("get"in r?!e.__esModule:r.writable||r.configurable))&&(r={enumerable:!0,get:function(){return e[s]}}),Object.defineProperty(t,a,r)}:function(t,e,s,a){a===void 0&&(a=s),t[a]=e[s]}),_s=h&&h.__setModuleDefault||(Object.create?function(t,e){Object.defineProperty(t,"default",{enumerable:!0,value:e})}:function(t,e){t.default=e}),Ae=h&&h.__importStar||function(t){if(t&&t.__esModule)return t;var e={};if(t!=null)for(var s in t)s!=="default"&&Object.prototype.hasOwnProperty.call(t,s)&&xs(e,t,s);return _s(e,t),e},X=h&&h.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(h,"__esModule",{value:!0});h.SignalRegistry=h.TempleException=h.TempleEmitter=h.TempleElement=h.TempleRegistry=h.TempleComponent=h.TempleDataMap=h.emitter=h.signal=h.innerHTML=h.innerText=h.children=h.classnames=h.classlist=h.props=h.env=h.data=h.component=void 0;var vs=X(he());h.TempleException=vs.default;var ys=X(bt());h.TempleComponent=ys.default;var ws=X(Me());h.TempleRegistry=ws.default;var As=X(st());h.TempleElement=As.default;var kt=Ae(Oe());h.emitter=kt.default;Object.defineProperty(h,"TempleEmitter",{enumerable:!0,get:function(){return kt.TempleEmitter}});var Ts=X(te());h.component=Ts.default;var Lt=Ae(ee());h.data=Lt.default;Object.defineProperty(h,"TempleDataMap",{enumerable:!0,get:function(){return Lt.TempleDataMap}});var Es=X(_t());h.env=Es.default;var ks=X(nt());h.props=ks.default;var Ft=Ae(wt());h.classnames=Ft.default;Object.defineProperty(h,"classlist",{enumerable:!0,get:function(){return Ft.classlist}});var it=Ae(At());h.children=it.default;Object.defineProperty(h,"innerHTML",{enumerable:!0,get:function(){return it.innerHTML}});Object.defineProperty(h,"innerText",{enumerable:!0,get:function(){return it.innerText}});var Pt=Ae(Et());h.signal=Pt.default;Object.defineProperty(h,"SignalRegistry",{enumerable:!0,get:function(){return Pt.SignalRegistry}})});var q=O((Ws,St)=>{St.exports={...lt()}});var B=O((Zs,Ct)=>{Ct.exports={...lt()}});var Ot=O((Vs,Be)=>{var Ls=typeof window<"u"?window:typeof WorkerGlobalScope<"u"&&self instanceof WorkerGlobalScope?self:{};var d=function(t){var e=/(?:^|\s)lang(?:uage)?-([\w-]+)(?=\s|$)/i,s=0,a={},r={manual:t.Prism&&t.Prism.manual,disableWorkerMessageHandler:t.Prism&&t.Prism.disableWorkerMessageHandler,util:{encode:function i(n){return n instanceof u?new u(n.type,i(n.content),n.alias):Array.isArray(n)?n.map(i):n.replace(/&/g,"&").replace(/"u")return null;if("currentScript"in document)return document.currentScript;try{throw new Error}catch(o){var i=(/at [^(\r\n]*\((.*):[^:]+:[^:]+\)$/i.exec(o.stack)||[])[1];if(i){var n=document.getElementsByTagName("script");for(var l in n)if(n[l].src==i)return n[l]}return null}},isActive:function(i,n,l){for(var o="no-"+n;i;){var c=i.classList;if(c.contains(n))return!0;if(c.contains(o))return!1;i=i.parentElement}return!!l}},languages:{plain:a,plaintext:a,text:a,txt:a,extend:function(i,n){var l=r.util.clone(r.languages[i]);for(var o in n)l[o]=n[o];return l},insertBefore:function(i,n,l,o){o=o||r.languages;var c=o[i],m={};for(var x in c)if(c.hasOwnProperty(x)){if(x==n)for(var p in l)l.hasOwnProperty(p)&&(m[p]=l[p]);l.hasOwnProperty(x)||(m[x]=c[x])}var E=o[i];return o[i]=m,r.languages.DFS(r.languages,function(j,I){I===E&&j!=i&&(this[j]=m)}),m},DFS:function i(n,l,o,c){c=c||{};var m=r.util.objId;for(var x in n)if(n.hasOwnProperty(x)){l.call(n,x,n[x],o||x);var p=n[x],E=r.util.type(p);E==="Object"&&!c[m(p)]?(c[m(p)]=!0,i(p,l,null,c)):E==="Array"&&!c[m(p)]&&(c[m(p)]=!0,i(p,l,x,c))}}},plugins:{},highlightAll:function(i,n){r.highlightAllUnder(document,i,n)},highlightAllUnder:function(i,n,l){var o={callback:l,container:i,selector:'code[class*="language-"], [class*="language-"] code, code[class*="lang-"], [class*="lang-"] code'};r.hooks.run("before-highlightall",o),o.elements=Array.prototype.slice.apply(o.container.querySelectorAll(o.selector)),r.hooks.run("before-all-elements-highlight",o);for(var c=0,m;m=o.elements[c++];)r.highlightElement(m,n===!0,o.callback)},highlightElement:function(i,n,l){var o=r.util.getLanguage(i),c=r.languages[o];r.util.setLanguage(i,o);var m=i.parentElement;m&&m.nodeName.toLowerCase()==="pre"&&r.util.setLanguage(m,o);var x=i.textContent,p={element:i,language:o,grammar:c,code:x};function E(I){p.highlightedCode=I,r.hooks.run("before-insert",p),p.element.innerHTML=p.highlightedCode,r.hooks.run("after-highlight",p),r.hooks.run("complete",p),l&&l.call(p.element)}if(r.hooks.run("before-sanity-check",p),m=p.element.parentElement,m&&m.nodeName.toLowerCase()==="pre"&&!m.hasAttribute("tabindex")&&m.setAttribute("tabindex","0"),!p.code){r.hooks.run("complete",p),l&&l.call(p.element);return}if(r.hooks.run("before-highlight",p),!p.grammar){E(r.util.encode(p.code));return}if(n&&t.Worker){var j=new Worker(r.filename);j.onmessage=function(I){E(I.data)},j.postMessage(JSON.stringify({language:p.language,code:p.code,immediateClose:!0}))}else E(r.highlight(p.code,p.grammar,p.language))},highlight:function(i,n,l){var o={code:i,grammar:n,language:l};if(r.hooks.run("before-tokenize",o),!o.grammar)throw new Error('The language "'+o.language+'" has no grammar.');return o.tokens=r.tokenize(o.code,o.grammar),r.hooks.run("after-tokenize",o),u.stringify(r.util.encode(o.tokens),o.language)},tokenize:function(i,n){var l=n.rest;if(l){for(var o in l)n[o]=l[o];delete n.rest}var c=new y;return A(c,c.head,i),g(i,c,n,c.head,0),T(c)},hooks:{all:{},add:function(i,n){var l=r.hooks.all;l[i]=l[i]||[],l[i].push(n)},run:function(i,n){var l=r.hooks.all[i];if(!(!l||!l.length))for(var o=0,c;c=l[o++];)c(n)}},Token:u};t.Prism=r;function u(i,n,l,o){this.type=i,this.content=n,this.alias=l,this.length=(o||"").length|0}u.stringify=function i(n,l){if(typeof n=="string")return n;if(Array.isArray(n)){var o="";return n.forEach(function(E){o+=i(E,l)}),o}var c={type:n.type,content:i(n.content,l),tag:"span",classes:["token",n.type],attributes:{},language:l},m=n.alias;m&&(Array.isArray(m)?Array.prototype.push.apply(c.classes,m):c.classes.push(m)),r.hooks.run("wrap",c);var x="";for(var p in c.attributes)x+=" "+p+'="'+(c.attributes[p]||"").replace(/"/g,""")+'"';return"<"+c.tag+' class="'+c.classes.join(" ")+'"'+x+">"+c.content+""};function _(i,n,l,o){i.lastIndex=n;var c=i.exec(l);if(c&&o&&c[1]){var m=c[1].length;c.index+=m,c[0]=c[0].slice(m)}return c}function g(i,n,l,o,c,m){for(var x in l)if(!(!l.hasOwnProperty(x)||!l[x])){var p=l[x];p=Array.isArray(p)?p:[p];for(var E=0;E=m.reach);z+=f.value.length,f=f.next){var H=f.value;if(n.length>i.length)return;if(!(H instanceof u)){var G=1,$;if(Ze){if($=_(V,z,i,Q),!$||$.index>=i.length)break;var Le=$.index,$t=$.index+$[0].length,U=z;for(U+=f.value.length;Le>=U;)f=f.next,U+=f.value.length;if(U-=f.value.length,z=U,f.value instanceof u)continue;for(var me=f;me!==n.tail&&(U<$t||typeof me.value=="string");me=me.next)G++,U+=me.value.length;G--,H=i.slice(z,U),$.index-=z}else if($=_(V,0,H,Q),!$)continue;var Le=$.index,Fe=$[0],Ye=H.slice(0,Le),dt=H.slice(Le+Fe.length),Ke=z+H.length;m&&Ke>m.reach&&(m.reach=Ke);var Pe=f.prev;Ye&&(Pe=A(n,Pe,Ye),z+=Ye.length),b(n,Pe,G);var Nt=new u(x,I?r.tokenize(Fe,I):Fe,ut,Fe);if(f=A(n,Pe,Nt),dt&&A(n,f,dt),G>1){var Xe={cause:x+","+E,reach:Ke};g(i,n,l,f.prev,z,Xe),m&&Xe.reach>m.reach&&(m.reach=Xe.reach)}}}}}}function y(){var i={value:null,prev:null,next:null},n={value:null,prev:i,next:null};i.next=n,this.head=i,this.tail=n,this.length=0}function A(i,n,l){var o=n.next,c={value:l,prev:n,next:o};return n.next=c,o.prev=c,i.length++,c}function b(i,n,l){for(var o=n.next,c=0;c/,greedy:!0},prolog:{pattern:/<\?[\s\S]+?\?>/,greedy:!0},doctype:{pattern:/"'[\]]|"[^"]*"|'[^']*')+(?:\[(?:[^<"'\]]|"[^"]*"|'[^']*'|<(?!!--)|)*\]\s*)?>/i,greedy:!0,inside:{"internal-subset":{pattern:/(^[^\[]*\[)[\s\S]+(?=\]>$)/,lookbehind:!0,greedy:!0,inside:null},string:{pattern:/"[^"]*"|'[^']*'/,greedy:!0},punctuation:/^$|[[\]]/,"doctype-tag":/^DOCTYPE/i,name:/[^\s<>'"]+/}},cdata:{pattern://i,greedy:!0},tag:{pattern:/<\/?(?!\d)[^\s>\/=$<%]+(?:\s(?:\s*[^\s>\/=]+(?:\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))|(?=[\s/>])))+)?\s*\/?>/,greedy:!0,inside:{tag:{pattern:/^<\/?[^\s>\/]+/,inside:{punctuation:/^<\/?/,namespace:/^[^\s>\/:]+:/}},"special-attr":[],"attr-value":{pattern:/=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+)/,inside:{punctuation:[{pattern:/^=/,alias:"attr-equals"},{pattern:/^(\s*)["']|["']$/,lookbehind:!0}]}},punctuation:/\/?>/,"attr-name":{pattern:/[^\s>\/]+/,inside:{namespace:/^[^\s>\/:]+:/}}}},entity:[{pattern:/&[\da-z]{1,8};/i,alias:"named-entity"},/&#x?[\da-f]{1,8};/i]};d.languages.markup.tag.inside["attr-value"].inside.entity=d.languages.markup.entity;d.languages.markup.doctype.inside["internal-subset"].inside=d.languages.markup;d.hooks.add("wrap",function(t){t.type==="entity"&&(t.attributes.title=t.content.replace(/&/,"&"))});Object.defineProperty(d.languages.markup.tag,"addInlined",{value:function(e,s){var a={};a["language-"+s]={pattern:/(^$)/i,lookbehind:!0,inside:d.languages[s]},a.cdata=/^$/i;var r={"included-cdata":{pattern://i,inside:a}};r["language-"+s]={pattern:/[\s\S]+/,inside:d.languages[s]};var u={};u[e]={pattern:RegExp(/(<__[^>]*>)(?:))*\]\]>|(?!)/.source.replace(/__/g,function(){return e}),"i"),lookbehind:!0,greedy:!0,inside:r},d.languages.insertBefore("markup","cdata",u)}});Object.defineProperty(d.languages.markup.tag,"addAttribute",{value:function(t,e){d.languages.markup.tag.inside["special-attr"].push({pattern:RegExp(/(^|["'\s])/.source+"(?:"+t+")"+/\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))/.source,"i"),lookbehind:!0,inside:{"attr-name":/^[^\s=]+/,"attr-value":{pattern:/=[\s\S]+/,inside:{value:{pattern:/(^=\s*(["']|(?!["'])))\S[\s\S]*(?=\2$)/,lookbehind:!0,alias:[e,"language-"+e],inside:d.languages[e]},punctuation:[{pattern:/^=/,alias:"attr-equals"},/"|'/]}}}})}});d.languages.html=d.languages.markup;d.languages.mathml=d.languages.markup;d.languages.svg=d.languages.markup;d.languages.xml=d.languages.extend("markup",{});d.languages.ssml=d.languages.xml;d.languages.atom=d.languages.xml;d.languages.rss=d.languages.xml;(function(t){var e=/(?:"(?:\\(?:\r\n|[\s\S])|[^"\\\r\n])*"|'(?:\\(?:\r\n|[\s\S])|[^'\\\r\n])*')/;t.languages.css={comment:/\/\*[\s\S]*?\*\//,atrule:{pattern:RegExp("@[\\w-](?:"+/[^;{\s"']|\s+(?!\s)/.source+"|"+e.source+")*?"+/(?:;|(?=\s*\{))/.source),inside:{rule:/^@[\w-]+/,"selector-function-argument":{pattern:/(\bselector\s*\(\s*(?![\s)]))(?:[^()\s]|\s+(?![\s)])|\((?:[^()]|\([^()]*\))*\))+(?=\s*\))/,lookbehind:!0,alias:"selector"},keyword:{pattern:/(^|[^\w-])(?:and|not|only|or)(?![\w-])/,lookbehind:!0}}},url:{pattern:RegExp("\\burl\\((?:"+e.source+"|"+/(?:[^\\\r\n()"']|\\[\s\S])*/.source+")\\)","i"),greedy:!0,inside:{function:/^url/i,punctuation:/^\(|\)$/,string:{pattern:RegExp("^"+e.source+"$"),alias:"url"}}},selector:{pattern:RegExp(`(^|[{}\\s])[^{}\\s](?:[^{};"'\\s]|\\s+(?![\\s{])|`+e.source+")*(?=\\s*\\{)"),lookbehind:!0},string:{pattern:e,greedy:!0},property:{pattern:/(^|[^-\w\xA0-\uFFFF])(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*(?=\s*:)/i,lookbehind:!0},important:/!important\b/i,function:{pattern:/(^|[^-a-z0-9])[-a-z0-9]+(?=\()/i,lookbehind:!0},punctuation:/[(){};:,]/},t.languages.css.atrule.inside.rest=t.languages.css;var s=t.languages.markup;s&&(s.tag.addInlined("style","css"),s.tag.addAttribute("style","css"))})(d);d.languages.clike={comment:[{pattern:/(^|[^\\])\/\*[\s\S]*?(?:\*\/|$)/,lookbehind:!0,greedy:!0},{pattern:/(^|[^\\:])\/\/.*/,lookbehind:!0,greedy:!0}],string:{pattern:/(["'])(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/,greedy:!0},"class-name":{pattern:/(\b(?:class|extends|implements|instanceof|interface|new|trait)\s+|\bcatch\s+\()[\w.\\]+/i,lookbehind:!0,inside:{punctuation:/[.\\]/}},keyword:/\b(?:break|catch|continue|do|else|finally|for|function|if|in|instanceof|new|null|return|throw|try|while)\b/,boolean:/\b(?:false|true)\b/,function:/\b\w+(?=\()/,number:/\b0x[\da-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:e[+-]?\d+)?/i,operator:/[<>]=?|[!=]=?=?|--?|\+\+?|&&?|\|\|?|[?*/~^%]/,punctuation:/[{}[\];(),.:]/};d.languages.javascript=d.languages.extend("clike",{"class-name":[d.languages.clike["class-name"],{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$A-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\.(?:constructor|prototype))/,lookbehind:!0}],keyword:[{pattern:/((?:^|\})\s*)catch\b/,lookbehind:!0},{pattern:/(^|[^.]|\.\.\.\s*)\b(?:as|assert(?=\s*\{)|async(?=\s*(?:function\b|\(|[$\w\xA0-\uFFFF]|$))|await|break|case|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally(?=\s*(?:\{|$))|for|from(?=\s*(?:['"]|$))|function|(?:get|set)(?=\s*(?:[#\[$\w\xA0-\uFFFF]|$))|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)\b/,lookbehind:!0}],function:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*(?:\.\s*(?:apply|bind|call)\s*)?\()/,number:{pattern:RegExp(/(^|[^\w$])/.source+"(?:"+(/NaN|Infinity/.source+"|"+/0[bB][01]+(?:_[01]+)*n?/.source+"|"+/0[oO][0-7]+(?:_[0-7]+)*n?/.source+"|"+/0[xX][\dA-Fa-f]+(?:_[\dA-Fa-f]+)*n?/.source+"|"+/\d+(?:_\d+)*n/.source+"|"+/(?:\d+(?:_\d+)*(?:\.(?:\d+(?:_\d+)*)?)?|\.\d+(?:_\d+)*)(?:[Ee][+-]?\d+(?:_\d+)*)?/.source)+")"+/(?![\w$])/.source),lookbehind:!0},operator:/--|\+\+|\*\*=?|=>|&&=?|\|\|=?|[!=]==|<<=?|>>>?=?|[-+*/%&|^!=<>]=?|\.{3}|\?\?=?|\?\.?|[~:]/});d.languages.javascript["class-name"][0].pattern=/(\b(?:class|extends|implements|instanceof|interface|new)\s+)[\w.\\]+/;d.languages.insertBefore("javascript","keyword",{regex:{pattern:RegExp(/((?:^|[^$\w\xA0-\uFFFF."'\])\s]|\b(?:return|yield))\s*)/.source+/\//.source+"(?:"+/(?:\[(?:[^\]\\\r\n]|\\.)*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}/.source+"|"+/(?:\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.)*\])*\])*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}v[dgimyus]{0,7}/.source+")"+/(?=(?:\s|\/\*(?:[^*]|\*(?!\/))*\*\/)*(?:$|[\r\n,.;:})\]]|\/\/))/.source),lookbehind:!0,greedy:!0,inside:{"regex-source":{pattern:/^(\/)[\s\S]+(?=\/[a-z]*$)/,lookbehind:!0,alias:"language-regex",inside:d.languages.regex},"regex-delimiter":/^\/|\/$/,"regex-flags":/^[a-z]+$/}},"function-variable":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*[=:]\s*(?:async\s*)?(?:\bfunction\b|(?:\((?:[^()]|\([^()]*\))*\)|(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)\s*=>))/,alias:"function"},parameter:[{pattern:/(function(?:\s+(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)?\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\))/,lookbehind:!0,inside:d.languages.javascript},{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$a-z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*=>)/i,lookbehind:!0,inside:d.languages.javascript},{pattern:/(\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*=>)/,lookbehind:!0,inside:d.languages.javascript},{pattern:/((?:\b|\s|^)(?!(?:as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)(?![$\w\xA0-\uFFFF]))(?:(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*)\(\s*|\]\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*\{)/,lookbehind:!0,inside:d.languages.javascript}],constant:/\b[A-Z](?:[A-Z_]|\dx?)*\b/});d.languages.insertBefore("javascript","string",{hashbang:{pattern:/^#!.*/,greedy:!0,alias:"comment"},"template-string":{pattern:/`(?:\\[\s\S]|\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}|(?!\$\{)[^\\`])*`/,greedy:!0,inside:{"template-punctuation":{pattern:/^`|`$/,alias:"string"},interpolation:{pattern:/((?:^|[^\\])(?:\\{2})*)\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}/,lookbehind:!0,inside:{"interpolation-punctuation":{pattern:/^\$\{|\}$/,alias:"punctuation"},rest:d.languages.javascript}},string:/[\s\S]+/}},"string-property":{pattern:/((?:^|[,{])[ \t]*)(["'])(?:\\(?:\r\n|[\s\S])|(?!\2)[^\\\r\n])*\2(?=\s*:)/m,lookbehind:!0,greedy:!0,alias:"property"}});d.languages.insertBefore("javascript","operator",{"literal-property":{pattern:/((?:^|[,{])[ \t]*)(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*:)/m,lookbehind:!0,alias:"property"}});d.languages.markup&&(d.languages.markup.tag.addInlined("script","javascript"),d.languages.markup.tag.addAttribute(/on(?:abort|blur|change|click|composition(?:end|start|update)|dblclick|error|focus(?:in|out)?|key(?:down|up)|load|mouse(?:down|enter|leave|move|out|over|up)|reset|resize|scroll|select|slotchange|submit|unload|wheel)/.source,"javascript"));d.languages.js=d.languages.javascript;(function(){if(typeof d>"u"||typeof document>"u")return;Element.prototype.matches||(Element.prototype.matches=Element.prototype.msMatchesSelector||Element.prototype.webkitMatchesSelector);var t="Loading\u2026",e=function(k,v){return"\u2716 Error "+k+" while fetching file: "+v},s="\u2716 Error: File does not exist or is empty",a={js:"javascript",py:"python",rb:"ruby",ps1:"powershell",psm1:"powershell",sh:"bash",bat:"batch",h:"c",tex:"latex"},r="data-src-status",u="loading",_="loaded",g="failed",y="pre[data-src]:not(["+r+'="'+_+'"]):not(['+r+'="'+u+'"])';function A(k,v,L){var i=new XMLHttpRequest;i.open("GET",k,!0),i.onreadystatechange=function(){i.readyState==4&&(i.status<400&&i.responseText?v(i.responseText):i.status>=400?L(e(i.status,i.statusText)):L(s))},i.send(null)}function b(k){var v=/^\s*(\d+)\s*(?:(,)\s*(?:(\d+)\s*)?)?$/.exec(k||"");if(v){var L=Number(v[1]),i=v[2],n=v[3];return i?n?[L,Number(n)]:[L,void 0]:[L,L]}}d.hooks.add("before-highlightall",function(k){k.selector+=", "+y}),d.hooks.add("before-sanity-check",function(k){var v=k.element;if(v.matches(y)){k.code="",v.setAttribute(r,u);var L=v.appendChild(document.createElement("CODE"));L.textContent=t;var i=v.getAttribute("data-src"),n=k.language;if(n==="none"){var l=(/\.(\w+)$/.exec(i)||[,"none"])[1];n=a[l]||l}d.util.setLanguage(L,n),d.util.setLanguage(v,n);var o=d.plugins.autoloader;o&&o.loadLanguages(n),A(i,function(c){v.setAttribute(r,_);var m=b(v.getAttribute("data-range"));if(m){var x=c.split(/\r\n?|\n/g),p=m[0],E=m[1]==null?x.length:m[1];p<0&&(p+=x.length),p=Math.max(0,Math.min(p-1,x.length)),E<0&&(E+=x.length),E=Math.max(0,Math.min(E,x.length)),c=x.slice(p,E).join(`
+`),v.hasAttribute("data-start")||v.setAttribute("data-start",String(p+1))}L.textContent=c,d.highlightElement(L)},function(c){v.setAttribute(r,g),L.textContent=c})}}),d.plugins.fileHighlight={highlight:function(v){for(var L=(v||document).querySelectorAll(y),i=0,n;n=L[i++];)d.highlightElement(n)}};var T=!1;d.fileHighlight=function(){T||(console.warn("Prism.fileHighlight is deprecated. Use `Prism.plugins.fileHighlight.highlight` instead."),T=!0),d.plugins.fileHighlight.highlight.apply(this,arguments)}})()});var Cs={};Bt(Cs,{BUILD_ID:()=>Ss,TempleComponent:()=>C.TempleComponent,TempleElement:()=>C.TempleElement,TempleEmitter:()=>C.TempleEmitter,TempleException:()=>C.TempleException,TempleRegistry:()=>C.TempleRegistry,children:()=>C.children,components:()=>Ps,data:()=>C.data,emitter:()=>C.emitter,props:()=>C.props,signal:()=>C.signal});var N=F(q());var jt=F(q()),R=F(B()),ne=class extends jt.TempleComponent{static component=["layout","Layout_9f3ab204ce271feaf6f7"];styles(){return""}template(){(0,R.classlist)().add("relative","w-full","vh","scroll-hidden");let e=(0,R.children)(),s=e.find(b=>b.nodeName.endsWith("PANEL-MAIN")),a=e.find(b=>b.nodeName.endsWith("PANEL-HEAD")),r=e.find(b=>b.nodeName.endsWith("PANEL-FOOT")),u=e.find(b=>b.nodeName.endsWith("PANEL-LEFT")),_=e.find(b=>b.nodeName.endsWith("PANEL-RIGHT")),g={head:!!a,foot:!!r,left:!!u,right:!!_},y=new Set,A={left:!1,right:!1,change:b=>y.add(b)};return s&&R.TempleRegistry.get(s).setAttribute("show",A).setAttribute("layout",g),a&&R.TempleRegistry.get(a).setAttribute("show",A).setAttribute("layout",g),r&&R.TempleRegistry.get(r).setAttribute("show",A).setAttribute("layout",g),u&&R.TempleRegistry.get(u).setAttribute("show",A).setAttribute("layout",g),_&&R.TempleRegistry.get(_).setAttribute("show",A).setAttribute("layout",g),this.toggle=b=>{A[b]=!A[b],y.forEach(T=>T())},()=>[R.TempleRegistry.createText(`
+`,!1),...this._toNodeList(e)]}};var Te=F(q()),Re=F(B()),ae=class extends Te.TempleComponent{static component=["head","Head_2bf4dff19bc88ba4138b"];styles(){return""}template(){let{layout:e,show:s}=this.element.attributes,a=(0,Re.classlist)(),r=u=>{this.classList.add("absolute","top-0","right-0","h-60","transition-500"),e?.left?(this.classList.remove("left-0"),this.classList.add("left-226")):this.classList.add("left-0"),s.left?(this.classList.remove("md-left-0"),this.classList.add("md-left-226")):(this.classList.remove("md-left-226"),this.classList.add("md-left-0"))};return s.change(r),r(),()=>[Te.TempleRegistry.createText(`
+`,!1),Te.TempleRegistry.createElement("header",{class:"block w-full h-full relative"},[...this._toNodeList((0,Re.children)())]).element]}};var Ee=F(q()),ze=F(B()),ie=class extends Ee.TempleComponent{static component=["main","Main_847772763f4518728ede"];styles(){return""}template(){let{layout:e,show:s}=this.element.attributes,a=(0,ze.classlist)(),r=u=>{this.classList.add("absolute","transition-500"),e?.head?(this.classList.remove("top-0"),this.classList.add("top-60")):this.classList.add("top-0"),e?.foot?(this.classList.remove("bottom-0"),this.classList.add("bottom-60")):this.classList.add("bottom-0"),e?.left?(this.classList.remove("left-0"),this.classList.add("left-226")):this.classList.add("left-0"),e?.right?(this.classList.remove("right-0"),this.classList.add("right-200")):this.classList.add("right-0"),s.left?(this.classList.remove("md-left-0"),this.classList.add("md-left-226")):(this.classList.remove("md-left-226"),this.classList.add("md-left-0")),s.right?(this.classList.remove("md-right-0"),this.classList.add("md-right-200")):(this.classList.remove("md-right-200"),this.classList.add("md-right-0"))};return s.change(r),r(),()=>[Ee.TempleRegistry.createText(`
+`,!1),Ee.TempleRegistry.createElement("main",{class:"block w-full h-full relative"},[...this._toNodeList((0,ze.children)())]).element]}};var Ie=F(q()),oe=F(B()),le=class extends Ie.TempleComponent{static component=["button","Button_d798a3059463b9c4868b"];styles(){return""}template(){let{block:e,full:s,color:a,xs:r,sm:u,md:_,lg:g,xl:y,xl2:A,xl3:b,xl4:T,xl5:k,curved:v,rounded:L,pill:i,info:n,warning:l,success:o,error:c,muted:m,primary:x,secondary:p,outline:E,transparent:j,solid:I,href:Q,style:Ze,class:ut,...Je}=(0,oe.props)(),V=(0,oe.component)(),f=document.createElement(Q?"a":"button");Object.entries(Je).forEach(([G,$])=>f.setAttribute(G,$)),Q&&f.setAttribute("href",Q),(0,oe.children)().forEach(G=>f.appendChild(G)),f.classList.add("inline-block","tx-center","tx-nodecor","cursor-pointer"),e?(V.classList.add("block"),f.classList.add("block")):(V.classList.add("inline-block"),f.classList.add("inline-block")),s&&(V.classList.add("w-full"),f.classList.add("w-full"));let z=r?f.classList.add("py-2","px-4"):u?f.classList.add("py-4","px-8"):_?f.classList.add("py-6","px-12"):g?f.classList.add("py-8","px-16"):y?f.classList.add("py-10","px-20"):A?f.classList.add("py-12","px-24"):b?f.classList.add("py-14","px-28"):T?f.classList.add("py-16","px-32"):k?f.classList.add("py-18","px-36"):f.classList.add("py-6","px-12");v?f.classList.add("curved"):L?f.classList.add("rounded"):i&&f.classList.add("pill");let H=E?"outline":j?"transparent":"solid";return H==="outline"||H==="transparent"?(f.classList.add("bd-solid","bd-thin"),H==="outline"&&f.classList.add("bg-white"),a?(f.style.color=a,f.style.borderColor=a):n?f.classList.add("bd-info","tx-info"):l?f.classList.add("bd-warning","tx-warning"):o?f.classList.add("bd-success","tx-success"):c?f.classList.add("bd-error","tx-error"):m?f.classList.add("bd-muted","tx-muted"):x?f.classList.add("bd-primary","tx-primary"):p&&f.classList.add("bd-secondary","tx-secondary")):(f.classList.add("tx-white"),a?f.style.backgroundColor=a:n?f.classList.add("bg-info"):l?f.classList.add("bg-warning"):o?f.classList.add("bg-success"):c?f.classList.add("bg-error"):m?f.classList.add("bg-muted"):x?f.classList.add("bg-primary"):p&&f.classList.add("bg-secondary")),()=>[Ie.TempleRegistry.createText(`
+`,!1),...this._toNodeList([f])]}};var P=F(q()),He=F(B()),ce=class extends P.TempleComponent{static component=["app","App_381239c61b65b86a1c20"];styles(){return""}template(){let{title:e,height:s}=(0,He.props)(),a=s?`height:${s}px`:"";return()=>[P.TempleRegistry.createText(`
+`,!1),P.TempleRegistry.createElement("div",{class:"bd-rad-curved scroll-hidden shadow-0-0-10-0-0-0-5"},[P.TempleRegistry.createText(`
+  `,!1),P.TempleRegistry.createElement("div",{class:"relative flex flex-center-y gap-10 p-10 bg-t-1 tx-c-999999 tx-16"},[P.TempleRegistry.createText(`
+    `,!1),P.TempleRegistry.createElement("span",{class:"bg-h-999999 pill h-10 w-10"},[]).element,P.TempleRegistry.createText(`
+    `,!1),P.TempleRegistry.createElement("span",{class:"bg-h-999999 pill h-10 w-10"},[]).element,P.TempleRegistry.createText(`
+    `,!1),P.TempleRegistry.createElement("span",{class:"bg-h-999999 pill h-10 w-10"},[]).element,P.TempleRegistry.createText(`
+    `,!1),P.TempleRegistry.createElement("span",{class:"flex flex-center h-full w-full absolute top-0 left-0"},[P.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(e),P.TempleRegistry.createText(`
+    `,!1)]).element,P.TempleRegistry.createText(`
+  `,!1)]).element,P.TempleRegistry.createText(`
+  `,!1),P.TempleRegistry.createElement("div",{class:"bg-black tx-t-1 relative",style:a},[...this._toNodeList((0,He.children)())]).element,P.TempleRegistry.createText(`
+`,!1)]).element]}};var w=F(q()),ot=F(Ot()),Mt=F(B()),ue=class extends w.TempleComponent{static component=["code","Code_5294df1c620ef5ddbd2f"];styles(){return`:host {
     display: block;
     font-size: 14px;
     line-height: 20px;
   }
   :host([inline]) {
-    display: inline;
+    display: inline !important;
   }
   :host([inline]),
   :host([inline]) > pre,
   :host([inline]) > pre > code {
-    display: inline;
+    display: inline !important;
   }
   .snippet {
     background-color: #000000;
     color: #ABB2BF;
+    height: 100%;
     margin: 0;
     padding: 0;
   }
@@ -244,51 +89,39 @@ var TempleAPI=(()=>{var jt=Object.create;var Te=Object.defineProperty;var St=Obj
 
   .terminal {
     background-color: #000000;
+    font-family: 'Courier New', Courier, monospace;
     font-size: 15px;
+    height: 100%;
     padding: 10px;
   }
   .terminal span {
     color: #00FF00;
-  }`}template(){let e=this.props,{lang:r="markup",numbers:i=!1,inline:n=!1,trim:f=!1,ltrim:m=!1,rtrim:h=!1,detab:x=0}=e,k=(0,Et.children)(),y=k[0]?.textContent||"";x&&(y=y.replace(new RegExp(`\\n {${x}}`,"g"),`
-`)),f?y=y.trim():m?y=y.replace(/^\s+/,""):h&&(y=y.replace(/\s+$/,""));let F=A=>{if(!y)return;let _=Xe.default.highlight(y,Xe.default.languages[r],r);if(A.detail.target.innerHTML=_,i){let T=_.match(/\n(?!$)/g),a=T?T.length+1:1,s=new Array(a+1).join(""),l=document.createElement("span");l.setAttribute("aria-hidden","true"),l.className="line-numbers-rows",l.innerHTML=s,A.detail.target.appendChild(l)}};return()=>[E.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism.min.css"}).element,E.TempleRegistry.createText(`
-`,!1),E.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism-tomorrow.min.css"}).element,E.TempleRegistry.createText(`
-`,!1),...r==="bash"?[E.TempleRegistry.createText(`
-  `,!1),E.TempleRegistry.createElement("div",{class:"terminal"},[E.TempleRegistry.createElement("span",{},[E.TempleRegistry.createText("$",!1)]).element,E.TempleRegistry.createText(" ",!1),...this._toNodeList(k)]).element,E.TempleRegistry.createText(`
-`,!1)]:y?[,E.TempleRegistry.createText(`
-  `,!1),...i?[E.TempleRegistry.createText(`
-    `,!1),E.TempleRegistry.createElement("pre",{class:"snippet line-numbers"},[E.TempleRegistry.createElement("code",{mount:F},[]).element]).element,E.TempleRegistry.createText(`
-  `,!1)]:[,E.TempleRegistry.createText(`
-    `,!1),E.TempleRegistry.createElement("pre",{class:"snippet pad"},[E.TempleRegistry.createElement("code",{mount:F},[]).element]).element,E.TempleRegistry.createText(`
-  `,!1)],E.TempleRegistry.createText(`
-`,!1)]:[]]}};var te=M(I()),kt=M(J()),re=class extends te.TempleComponent{static component=["preview","Preview_f99bb2771682cb0390ea"];styles(){return`:host {
-    display: block;
-  }
-  .preview {
-    background-color: #EFEFEF;
-    color: #222222;
-    font-family: Arial, Helvetica, sans-serif;
-    font-size: 13px;
-    padding: 10px;
-  }`}template(){return()=>[te.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/default.min.css"}).element,te.TempleRegistry.createText(`
-`,!1),te.TempleRegistry.createElement("div",{class:"preview"},[...this._toNodeList((0,kt.children)())]).element]}};var C=M(I()),Me=M(J()),ne=class extends C.TempleComponent{static component=["app","App_05341fddbfd1fe4f273b"];styles(){return""}template(){let{title:e,panel:r}=(0,Me.props)(),i=`body ${r?"panel":""}`,n=r?`height:${r}px`:"";return()=>[C.TempleRegistry.createText(`
-`,!1),C.TempleRegistry.createElement("div",{class:"window"},[C.TempleRegistry.createText(`
-  `,!1),C.TempleRegistry.createElement("div",{class:"head"},[C.TempleRegistry.createText(`
-    `,!1),C.TempleRegistry.createElement("span",{class:"dot"},[]).element,C.TempleRegistry.createText(`
-    `,!1),C.TempleRegistry.createElement("span",{class:"dot"},[]).element,C.TempleRegistry.createText(`
-    `,!1),C.TempleRegistry.createElement("span",{class:"dot"},[]).element,C.TempleRegistry.createText(`
-    `,!1),C.TempleRegistry.createElement("span",{class:"title"},[...this._toNodeList(e)]).element,C.TempleRegistry.createText(`
-  `,!1)]).element,C.TempleRegistry.createText(`
-  `,!1),C.TempleRegistry.createElement("div",{class:i,style:n},[...this._toNodeList((0,Me.children)())]).element,C.TempleRegistry.createText(`
-`,!1)]).element]}};var q=M(I());var Qe=function(t,...e){let r=Ve(t);for(let i=0;i[q.TempleRegistry.createText(`
-    `,!1),...r?[q.TempleRegistry.createText(`
-      `,!1),q.TempleRegistry.createElement("p",{},[...this._toNodeList(y)]).element,q.TempleRegistry.createText(`
-    `,!1)]:i?[,q.TempleRegistry.createText(`
-      `,!1),q.TempleRegistry.createElement("li",{},[...this._toNodeList(y)]).element,q.TempleRegistry.createText(`
-    `,!1)]:n?[,q.TempleRegistry.createText(`
-      `,!1),q.TempleRegistry.createElement("div",{},[...this._toNodeList(y)]).element,q.TempleRegistry.createText(`
-    `,!1)]:[,q.TempleRegistry.createText(`
-      `,!1),...this._toNodeList(y),q.TempleRegistry.createText(`
-    `,!1)]]}};var j=M(I()),Le=M(J()),ae=class extends j.TempleComponent{static component=["tweet-box","TweetBox_5d0865ca9f2b26ab6c62"];styles(){return`a, a:link, a:hover, a:active, a:visited {
+  }`}template(){let e=this.props,{lang:s="markup",numbers:a=!1,inline:r=!1,trim:u=!1,ltrim:_=!1,rtrim:g=!1,detab:y=0}=e,A=(0,Mt.children)(),b=A[0]?.textContent||"";y&&(b=b.replace(new RegExp(`\\n {${y}}`,"g"),`
+`)),u?b=b.trim():_?b=b.replace(/^\s+/,""):g&&(b=b.replace(/\s+$/,""));let T=k=>{if(!b)return;let v=ot.default.highlight(b,ot.default.languages[s],s);if(k.detail.target.innerHTML=v,a){let L=v.match(/\n(?!$)/g),i=L?L.length+1:1,n=new Array(i+1).join(""),l=document.createElement("span");l.setAttribute("aria-hidden","true"),l.className="line-numbers-rows",l.innerHTML=n,k.detail.target.appendChild(l)}};return()=>[w.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism.min.css"}).element,w.TempleRegistry.createText(`
+`,!1),w.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism-tomorrow.min.css"}).element,w.TempleRegistry.createText(`
+`,!1),...s==="bash"?[w.TempleRegistry.createText(`
+  `,!1),w.TempleRegistry.createElement("div",{class:"terminal"},[w.TempleRegistry.createElement("span",{},[w.TempleRegistry.createText("$",!1)]).element,w.TempleRegistry.createText(" ",!1),...this._toNodeList(A)]).element,w.TempleRegistry.createText(`
+`,!1)]:b?[,w.TempleRegistry.createText(`
+  `,!1),...a?[w.TempleRegistry.createText(`
+    `,!1),w.TempleRegistry.createElement("pre",{class:"snippet line-numbers"},[w.TempleRegistry.createElement("code",{mount:T},[]).element]).element,w.TempleRegistry.createText(`
+  `,!1)]:[,w.TempleRegistry.createText(`
+    `,!1),w.TempleRegistry.createElement("pre",{class:"snippet pad"},[w.TempleRegistry.createElement("code",{mount:T},[]).element]).element,w.TempleRegistry.createText(`
+  `,!1)],w.TempleRegistry.createText(`
+`,!1)]:[,w.TempleRegistry.createText(`
+  `,!1),w.TempleRegistry.createElement("span",{},[w.TempleRegistry.createText("????",!1)]).element,w.TempleRegistry.createText(`
+`,!1)],w.TempleRegistry.createText(`
+
+`,!1)]}};var ke=F(q()),Ge=F(B()),de=class extends ke.TempleComponent{static component=["preview","Preview_ab5776d356e4ce3da5d5"];styles(){return""}template(){return(0,Ge.classlist)().add("block","w-full","h-full","scroll-auto"),()=>[ke.TempleRegistry.createText(`
+`,!1),ke.TempleRegistry.createElement("div",{class:"bg-white tx-black arial p-10 h-full"},[...this._toNodeList((0,Ge.children)())]).element]}};var D=F(q());var Dt=function(t){return t};var Ue=F(B()),fe=class extends D.TempleComponent{static component=["translate","Translate_0014b007fc91289b2776"];styles(){return""}template(){let{trim:e=!1,p:s=!1,li:a=!1,div:r=!1}=(0,Ue.props)(),u=(0,Ue.children)(),_=[],g=[];for(let T of u)typeof T=="string"?_.push(T):T instanceof Node&&T.textContent?_.push(T.textContent):(_.push("%s"),g.push(T));let y=_.join("");e&&(y=y.replace(/\s+/," ").trim());let A=Dt(y).split("%s"),b=[];for(let T=0;T[D.TempleRegistry.createText(`
+    `,!1),...s?[D.TempleRegistry.createText(`
+      `,!1),D.TempleRegistry.createElement("p",{},[...this._toNodeList(b)]).element,D.TempleRegistry.createText(`
+    `,!1)]:a?[,D.TempleRegistry.createText(`
+      `,!1),D.TempleRegistry.createElement("li",{},[...this._toNodeList(b)]).element,D.TempleRegistry.createText(`
+    `,!1)]:r?[,D.TempleRegistry.createText(`
+      `,!1),D.TempleRegistry.createElement("div",{},[...this._toNodeList(b)]).element,D.TempleRegistry.createText(`
+    `,!1)]:[,D.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(b),D.TempleRegistry.createText(`
+    `,!1)]]}};var S=F(q()),We=F(B()),pe=class extends S.TempleComponent{static component=["tweet-box","TweetBox_5d0865ca9f2b26ab6c62"];styles(){return`a, a:link, a:hover, a:active, a:visited {
     color: var(--fg-primary);
     text-decoration: none;
   }
@@ -324,17 +157,18 @@ var TempleAPI=(()=>{var jt=Object.create;var Te=Object.defineProperty;var St=Obj
   .tweet-box .content .message {
     font-size: 14px;
     line-height: 24px;
-  }`}template(){let{name:e,handle:r,href:i,src:n}=(0,Le.props)();return()=>[j.TempleRegistry.createText(`
-`,!1),j.TempleRegistry.createElement("main",{class:"tweet-box"},[j.TempleRegistry.createText(`
-  `,!1),j.TempleRegistry.createElement("aside",{class:"avatar"},[j.TempleRegistry.createText(`
-    `,!1),j.TempleRegistry.createElement("img",{src:n,alt:r}).element,j.TempleRegistry.createText(`
-  `,!1)]).element,j.TempleRegistry.createText(`
-  `,!1),j.TempleRegistry.createElement("section",{class:"content"},[j.TempleRegistry.createText(`
-    `,!1),j.TempleRegistry.createElement("h3",{},[...this._toNodeList(e)]).element,j.TempleRegistry.createText(`
-    `,!1),j.TempleRegistry.createElement("a",{href:i,target:"_blank"},[...this._toNodeList(r)]).element,j.TempleRegistry.createText(`
-    `,!1),j.TempleRegistry.createElement("div",{class:"message"},[...this._toNodeList((0,Le.children)())]).element,j.TempleRegistry.createText(`
-  `,!1)]).element,j.TempleRegistry.createText(`
-`,!1)]).element]}};var S=M(I());R.emitter.once("ready",()=>{let t=document.querySelector("script[data-app]");if(!t)throw R.TempleException.for("APP_DATA not found");try{let m=atob(t.getAttribute("data-app"));window.__APP_DATA__=JSON.parse(m),Object.entries(window.__APP_DATA__).forEach(([h,x])=>{R.data.set(h,x)})}catch{throw R.TempleException.for("APP_DATA is not a valid JSON")}R.data.set("current","document");let e="/temple/index.html",r=Qe("Temple - The reactive web component template engine."),i=Qe("Temple is a template engine that generates web components and support reactivity."),n=m=>{document.body.classList.toggle("panel-left-open")};R.data.delete("current");let f={0:{class:"head panel-head"},1:{class:"menu fas fa-fw fa-bars",click:n},2:{href:"/temple"},3:{src:"/temple/temple-icon.png",alt:"Temple Logo"},5:{class:"tx-white",href:"/temple"},7:{class:"tx-white",href:"/temple/docs/index.html"},8:{class:"github",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},9:{class:"fab fa-github"},10:{class:"npm",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},11:{class:"fab fa-npm text-white"},12:{class:"discord",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},13:{class:"fab fa-discord text-white"},14:{class:"panel-main"},15:{class:"section-hero"},16:{src:"/temple/temple-icon.png",alt:"Temple Logo"},18:{p:!0,trim:!0},19:{primary:!0,xl:!0,rounded:!0,style:"margin-right:10px;",href:"/temple/docs/getting-started.html"},20:{secondary:!0,xl:!0,rounded:!0,href:"/temple/docs/index.html"},21:{class:"section-sample"},22:{p:!0,trim:!0},23:{title:"Basic Example"},24:{class:"split-view"},25:{numbers:!0,trim:!0,detab:14},29:{class:"section-bullets"},33:{p:!0,trim:!0},36:{p:!0,trim:!0},39:{p:!0,trim:!0},40:{class:"section-interactive"},42:{p:!0,trim:!0},43:{title:"Server Example"},44:{lang:"js",numbers:!0,trim:!0,detab:12},46:{p:!0,trim:!0},47:{title:"Props Example"},48:{class:"split-view"},49:{numbers:!0,trim:!0,detab:14},54:{p:!0,trim:!0},55:{title:"Signal Example"},56:{class:"split-view"},57:{numbers:!0,trim:!0,detab:14},62:{p:!0,trim:!0},63:{title:"Import Example"},64:{class:"split-view"},65:{numbers:!0,trim:!0,detab:14},66:{class:"div",trim:!0,detab:14},68:{p:!0,trim:!0},69:{title:"Conditional + Iteration Example"},70:{class:"split-view"},71:{numbers:!0,trim:!0,detab:14},72:{class:"div",trim:!0,detab:14},73:{class:"section-servers"},76:{href:"https://expressjs.com/",target:"_blank"},77:{src:"https://upload.wikimedia.org/wikipedia/commons/6/64/Expressjs.png",alt:"Express"},78:{href:"https://fastify.dev/",target:"_blank"},79:{src:"https://upload.wikimedia.org/wikipedia/commons/0/0a/Fastify_logo.svg",alt:"Fastify"},80:{href:"https://hapi.dev/",target:"_blank"},81:{src:"https://raw.githubusercontent.com/hapijs/assets/master/images/hapi.png",alt:"Hapi"},82:{href:"https://koajs.com/",target:"_blank"},83:{src:"https://cdn.icon-icons.com/icons2/2699/PNG/512/koajs_logo_icon_168379.png",alt:"Koa"},84:{href:"https://nestjs.com/",target:"_blank"},85:{src:"https://cdn.icon-icons.com/icons2/2699/PNG/512/nestjs_logo_icon_169927.png",alt:"NestJS"},86:{href:"http://restify.com/",target:"_blank"},87:{src:"https://raw.githubusercontent.com/restify/node-restify/gh-images/logo/png/restify_logo_black_transp_288x288.png?raw=true",alt:"Restify"},88:{class:"section-testimonials"},91:{name:"Joff Tiquez",handle:"@jrtiquez",href:"https://twitter.com/jrtiquez",src:"https://github.com/jofftiquez.png"},93:{name:"Primeagen",handle:"@theprimeagen",href:"https://twitter.com/ThePrimeagen",src:"https://pbs.twimg.com/profile_images/1759330620160049152/2i_wkOoK_400x400.jpg"},96:{name:"Kristian Quirapas",handle:"@YourCompanyCTO",href:"https://twitter.com/YourCompanyCTO",src:"https://avatars.githubusercontent.com/u/85150796?v=4"},98:{name:"Drizzle Team",handle:"@drizzle.team",href:"https://twitter.com/DrizzleORM",src:"https://pbs.twimg.com/profile_images/1767809210060877824/mAtEmNk0_400x400.jpg"},100:{name:"Chris B",handle:"@cblanquera",href:"https://twitter.com/cblanquera",src:"https://avatars.githubusercontent.com/u/120378?v=4"},102:{name:"Theo",handle:"@t3dotgg",href:"https://twitter.com/t3dotgg",src:"https://yt3.googleusercontent.com/4NapxEtLcHQ6wN2zA_DMmkOk47RFb_gy6sjSmUZGg_ARHjlIUjFsrNFddrcKMkTYpBNxCp3J=s160-c-k-c0x00ffffff-no-rj"},104:{class:"section-action"},106:{primary:!0,xl:!0,rounded:!0,style:"margin-right:10px;",href:"/temple/docs/getting-started.html"},107:{secondary:!0,xl:!0,rounded:!0,href:"/temple/docs/index.html"},108:{class:"foot"}};for(let m of document.body.querySelectorAll("*")){let h=Object.fromEntries(Array.from(m.attributes).map(k=>[k.nodeName,k.nodeValue.length>0?k.nodeValue:!0])),x=String(R.TempleRegistry.elements.size);f[x]&&(Object.assign(h,f[x]),m.TempleAttributes=f[x]),R.TempleRegistry.register(m,h)}customElements.define("panel-main",X),customElements.define("tui-button",Q),customElements.define("ide-code",ee),customElements.define("ide-preview",re),customElements.define("ide-app",ne),customElements.define("i18n-translate",se),customElements.define("tweet-box",ae),R.emitter.emit("mounted",document.body)});var cr={PanelMain_fd7f1af6410c5b5c8e1f:X,TuiButton_adebe13e99f6c9d5075e:Q,IdeCode_6f36bc13bb6a166c7abc:ee,IdePreview_f99bb2771682cb0390ea:re,IdeApp_05341fddbfd1fe4f273b:ne,I18nTranslate_7d25e372f5ffb5e39dad:se,TweetBox_5d0865ca9f2b26ab6c62:ae},dr="f01cefc94e8ee605f3f5";return $t(pr);})();
+  }`}template(){let{name:e,handle:s,href:a,src:r}=(0,We.props)();return()=>[S.TempleRegistry.createText(`
+`,!1),S.TempleRegistry.createElement("main",{class:"tweet-box"},[S.TempleRegistry.createText(`
+  `,!1),S.TempleRegistry.createElement("aside",{class:"avatar"},[S.TempleRegistry.createText(`
+    `,!1),S.TempleRegistry.createElement("img",{src:r,alt:s}).element,S.TempleRegistry.createText(`
+  `,!1)]).element,S.TempleRegistry.createText(`
+  `,!1),S.TempleRegistry.createElement("section",{class:"content"},[S.TempleRegistry.createText(`
+    `,!1),S.TempleRegistry.createElement("h3",{},[...this._toNodeList(e)]).element,S.TempleRegistry.createText(`
+    `,!1),S.TempleRegistry.createElement("a",{href:a,target:"_blank"},[...this._toNodeList(s)]).element,S.TempleRegistry.createText(`
+    `,!1),S.TempleRegistry.createElement("div",{class:"message"},[...this._toNodeList((0,We.children)())]).element,S.TempleRegistry.createText(`
+  `,!1)]).element,S.TempleRegistry.createText(`
+`,!1)]).element,S.TempleRegistry.createText(`
+`,!1)]}};var ct=function(t,...e){let s=Fs(t);for(let a=0;a{let t=document.querySelector("script[data-app]");if(!t)throw N.TempleException.for("APP_DATA not found");try{let u=atob(t.getAttribute("data-app"));window.__APP_DATA__=JSON.parse(u),Object.entries(window.__APP_DATA__).forEach(([_,g])=>{N.data.set(_,g)})}catch{throw N.TempleException.for("APP_DATA is not a valid JSON")}N.data.set("current","document");let e="/temple/index.html",s=ct("Temple - The reactive web component template engine."),a=ct("Temple is a template engine that generates web components and support reactivity.");N.data.delete("current");let r={2:{class:"flex flex-center-y px-20 py-15 m-0 bg-t-1"},3:{href:"/temple"},4:{alt:"Temple Logo",class:"h-26 mr-10",src:"/temple/temple-icon.png"},5:{class:"flex-grow tx-uppercase"},6:{class:"tx-white",href:"/temple"},7:{class:"flex flex-center-y"},8:{class:"tx-white",href:"/temple/docs/index.html"},9:{class:"tx-t-1 tx-5xl ml-10",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},10:{class:"fab fa-github"},11:{class:"bg-h-cb3837 pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},12:{class:"fab fa-npm text-white"},13:{class:"bg-h-7289da pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},14:{class:"fab fa-discord text-white"},15:{class:"scroll-auto"},16:{class:"bg-t-1 py-40 tx-center w-full"},17:{class:"h-100",src:"/temple/temple-icon.png",alt:"Temple Logo"},18:{class:"tx-40"},19:{p:!0,trim:!0,class:"tx-30 py-30 tx-lh-36"},20:{primary:!0,xl:!0,rounded:!0,class:"mr-10",href:"/temple/docs/getting-started.html"},21:{secondary:!0,xl:!0,rounded:!0,class:"inline-block",href:"/temple/docs/index.html"},22:{class:"m-auto wm-960 px-20"},23:{p:!0,trim:!0,class:"p-20 tx-center tx-lh-36 tx-18"},24:{class:"block",title:"Basic Example"},25:{class:"flex bg-white md-block"},26:{numbers:!0,trim:!0,detab:14,class:"basis-half"},27:{class:"basis-half"},30:{class:"bg-t-1 m-auto py-40 px-20 tx-center"},31:{class:"flex flex-center list-none p-0 tx-center md-block"},32:{class:"w-third wm-300 md-wm-400 md-w-auto md-m-auto"},33:{class:"p-10"},34:{class:"mb-20 tx-uppercase"},35:{p:!0,trim:!0,class:"tx-16 tx-lh-24"},36:{class:"w-third wm-300 md-wm-400 md-w-auto md-m-auto md-mt-20"},37:{class:"p-10"},38:{class:"mb-20 tx-uppercase"},39:{p:!0,trim:!0,class:"tx-16 tx-lh-24"},40:{class:"w-third wm-300 md-wm-400 md-w-auto md-m-auto md-mt-20"},41:{class:"p-10"},42:{class:"mb-20 tx-uppercase"},43:{p:!0,trim:!0,class:"tx-16 tx-lh-24"},44:{class:"m-auto wm-960 px-20 py-40"},45:{class:"mt-40 mb-20 tx-center tx-uppercase"},46:{p:!0,trim:!0,class:"tx-center tx-lh-24 mb-20"},47:{title:"Server Example"},48:{lang:"js",numbers:!0,trim:!0,detab:12},49:{class:"mt-40 mb-20 tx-center tx-uppercase"},50:{p:!0,trim:!0,class:"tx-center tx-lh-24 mb-20"},51:{title:"Props Example"},52:{class:"flex bg-white md-block"},53:{numbers:!0,trim:!0,detab:14,class:"basis-half"},54:{class:"basis-half"},57:{class:"mt-40 mb-20 tx-center tx-uppercase"},58:{p:!0,trim:!0,class:"tx-center tx-lh-24 mb-20"},59:{title:"Signal Example"},60:{class:"flex bg-white md-block"},61:{numbers:!0,trim:!0,detab:14,class:"basis-half"},62:{class:"basis-half"},65:{class:"mt-40 mb-20 tx-center tx-uppercase"},66:{p:!0,trim:!0,class:"tx-center tx-lh-24 mb-20"},67:{title:"Import Example"},68:{class:"flex bg-white md-block"},69:{numbers:!0,trim:!0,detab:14,class:"basis-half"},70:{class:"div basis-half",trim:!0,detab:14},71:{class:"mt-40 mb-20 tx-center tx-uppercase"},72:{p:!0,trim:!0,class:"tx-center tx-lh-24 mb-20"},73:{title:"Conditional + Iteration Example"},74:{class:"flex bg-white md-block"},75:{numbers:!0,trim:!0,detab:14,class:"basis-half"},76:{class:"div basis-half",trim:!0,detab:14},77:{class:"m-auto px-20 py-40 tx-center bg-h-cccccc"},78:{class:"tx-h-242424 tx-30 tx-uppercase"},79:{class:"flex flex-center flex-wrap mx-auto mt-40 mb-0 sm-block"},80:{class:"block basis-third mb-20",href:"https://expressjs.com/",target:"_blank"},81:{class:"h-60",src:"https://upload.wikimedia.org/wikipedia/commons/6/64/Expressjs.png",alt:"Express"},82:{class:"block basis-third mb-20",href:"https://fastify.dev/",target:"_blank"},83:{class:"h-60",src:"https://upload.wikimedia.org/wikipedia/commons/0/0a/Fastify_logo.svg",alt:"Fastify"},84:{class:"block basis-third mb-20",href:"https://hapi.dev/",target:"_blank"},85:{class:"h-60",src:"https://raw.githubusercontent.com/hapijs/assets/master/images/hapi.png",alt:"Hapi"},86:{class:"block basis-third mb-20",href:"https://koajs.com/",target:"_blank"},87:{class:"h-60",src:"https://cdn.icon-icons.com/icons2/2699/PNG/512/koajs_logo_icon_168379.png",alt:"Koa"},88:{class:"block basis-third mb-20",href:"https://nestjs.com/",target:"_blank"},89:{class:"h-60",src:"https://cdn.icon-icons.com/icons2/2699/PNG/512/nestjs_logo_icon_169927.png",alt:"NestJS"},90:{class:"block basis-third mb-20",href:"http://restify.com/",target:"_blank"},91:{class:"h-60",src:"https://raw.githubusercontent.com/restify/node-restify/gh-images/logo/png/restify_logo_black_transp_288x288.png?raw=true",alt:"Restify"},92:{class:"bg-t-1 m-auto py-40 px-20"},93:{class:"tx-26 tx-center"},94:{class:"flex flex-wrap md-block"},95:{class:"block basis-third lg-basis-half",name:"Joff Tiquez",handle:"@jrtiquez",href:"https://twitter.com/jrtiquez",src:"https://github.com/jofftiquez.png"},97:{class:"block basis-third lg-basis-half",name:"Primeagen",handle:"@theprimeagen",href:"https://twitter.com/ThePrimeagen",src:"https://pbs.twimg.com/profile_images/1759330620160049152/2i_wkOoK_400x400.jpg"},100:{class:"block basis-third lg-basis-half",name:"Kristian Quirapas",handle:"@YourCompanyCTO",href:"https://twitter.com/YourCompanyCTO",src:"https://avatars.githubusercontent.com/u/85150796?v=4"},102:{class:"block basis-third lg-basis-half",name:"Drizzle Team",handle:"@drizzle.team",href:"https://twitter.com/DrizzleORM",src:"https://pbs.twimg.com/profile_images/1767809210060877824/mAtEmNk0_400x400.jpg"},104:{class:"block basis-third lg-basis-half",name:"Chris B",handle:"@cblanquera",href:"https://twitter.com/cblanquera",src:"https://avatars.githubusercontent.com/u/120378?v=4"},106:{class:"block basis-third lg-basis-half",name:"Theo",handle:"@t3dotgg",href:"https://twitter.com/t3dotgg",src:"https://yt3.googleusercontent.com/4NapxEtLcHQ6wN2zA_DMmkOk47RFb_gy6sjSmUZGg_ARHjlIUjFsrNFddrcKMkTYpBNxCp3J=s160-c-k-c0x00ffffff-no-rj"},108:{class:"m-auto py-40 px-20 tx-center"},109:{class:"tx-26 mb-20"},110:{primary:!0,xl:!0,rounded:!0,class:"inline-block",style:"margin-right:10px;",href:"/temple/docs/getting-started.html"},111:{secondary:!0,xl:!0,rounded:!0,class:"inline-block",href:"/temple/docs/index.html"},112:{class:"foot"}};for(let u of document.body.querySelectorAll("*")){let _=Object.fromEntries(Array.from(u.attributes).map(y=>[y.nodeName,y.nodeValue.length>0?y.nodeValue:!0])),g=String(N.TempleRegistry.elements.size);r[g]&&(Object.assign(_,r[g]),u.TempleAttributes=r[g]),N.TempleRegistry.register(u,_)}customElements.define("panel-layout",ne),customElements.define("panel-head",ae),customElements.define("panel-main",ie),customElements.define("tui-button",le),customElements.define("ide-app",ce),customElements.define("ide-code",ue),customElements.define("ide-preview",de),customElements.define("i18n-translate",fe),customElements.define("tweet-box",pe),N.emitter.emit("mounted",document.body)});var Ps={PanelLayout_9f3ab204ce271feaf6f7:ne,PanelHead_2bf4dff19bc88ba4138b:ae,PanelMain_847772763f4518728ede:ie,TuiButton_d798a3059463b9c4868b:le,IdeApp_381239c61b65b86a1c20:ce,IdeCode_5294df1c620ef5ddbd2f:ue,IdePreview_ab5776d356e4ce3da5d5:de,I18nTranslate_0014b007fc91289b2776:fe,TweetBox_5d0865ca9f2b26ab6c62:pe},Ss="f01cefc94e8ee605f3f5";return Gt(Cs);})();
 /*! Bundled license information:
 
 prismjs/prism.js:
diff --git a/docs/build/client/f859bf7a335e9eba03e0.css b/docs/build/client/f859bf7a335e9eba03e0.css
index e69de29..6eec7b4 100644
--- a/docs/build/client/f859bf7a335e9eba03e0.css
+++ b/docs/build/client/f859bf7a335e9eba03e0.css
@@ -0,0 +1,215 @@
+html, body {
+  height: 100%;
+  margin: 0;
+  padding: 0;
+  width: 100%;
+}
+
+h1, h2, h3, h4, h5, h6, p {
+  margin: 0;
+  padding: 0;
+}
+
+a {
+  text-decoration: none;
+}
+  html-head:not(:defined) { opacity: 0; }
+html-header:not(:defined) { opacity: 0; }
+html-aside:not(:defined) { opacity: 0; }
+panel-layout:not(:defined) { opacity: 0; }
+panel-head:not(:defined) { opacity: 0; }
+panel-left:not(:defined) { opacity: 0; }
+panel-main:not(:defined) { opacity: 0; }
+tui-alert:not(:defined) { opacity: 0; }
+api-docs:not(:defined) { opacity: 0; }
+api-ui:not(:defined) { opacity: 0; }
+ide-code:not(:defined) { opacity: 0; }
+i18n-translate:not(:defined) { opacity: 0; }
+  :root {
+  --black: #000000;
+  --white: #FFFFFF;
+  --info: #1474FC;
+  --error: #DC3545;
+  --warning: #FF7B07;
+  --success: #28A745;
+  --muted: #999999;
+}
+
+.light {
+  --bg-0: #EFEFEF;
+  --bg-1: #CFCFCF;
+  --bg-2: #AFAFAF;
+  --bg-3: #8F8F8F;
+  --bg-4: #6F6F6F;
+  --bd-0: #EFEFEF;
+  --bd-1: #CFCFCF;
+  --bd-2: #AFAFAF;
+  --bd-3: #8F8F8F;
+  --bd-4: #6F6F6F;
+  --bg-inverse: #242424;
+  --tx-0: #000000;
+  --tx-1: #242424;
+  --tx-inverse: #CFCFCF;
+}
+
+.dark {
+  --bg-0: #121212;
+  --bg-1: #222222;
+  --bg-2: #323232;
+  --bg-3: #424242;
+  --bg-4: #525252;
+  --bd-0: #121212;
+  --bd-1: #222222;
+  --bd-2: #323232;
+  --bd-3: #424242;
+  --bd-4: #525252;
+  --bg-inverse: #DBDBDB;
+  --tx-0: #FFFFFF;
+  --tx-1: #CFCFCF;
+  --tx-inverse: #222222;
+}
+  html-head { display: block; }
+html-header { display: block; }
+html-aside { display: block; }
+panel-layout { display: block; }
+panel-head { display: block; }
+panel-left { display: block; }
+panel-main { display: block; }
+tui-alert { display: block; }
+api-docs { display: block; }
+api-ui { display: block; }
+api-ide-code { display: block; }
+ide-code { display: block; }
+i18n-translate { display: block; }
+  .arial { font-family: Arial, sans-serif; }
+.none { display: none; }
+.block { display: block; }
+.flex { display: flex; }
+.inline { display: inline; }
+.transparent { opacity: 0; }
+.relative { position: relative; }
+.absolute { position: absolute; }
+.static { position: static; }
+.bottom-0 { bottom: 0px; }
+.bottom-60 { bottom: 60px; }
+.left-0 { left: 0px; }
+.left-226 { left: 226px; }
+.left-0 { left: 0px; }
+.left-226 { left: 226px; }
+.left--226 { left: -226px; }
+.right-0 { right: 0px; }
+.right-200 { right: 200px; }
+.right-0 { right: 0px; }
+.right-200 { right: 200px; }
+.top-0 { top: 0px; }
+.top-60 { top: 60px; }
+.flex-grow { flex-grow: 1; }
+.flex-center-y { align-items: center; }
+.scroll-auto { overflow: auto; }
+.scroll-hidden { overflow: hidden; }
+.scroll-x-hidden { overflow-x: hidden; }
+.scroll-y-auto { overflow-y: auto; }
+.h-full { height: 100%; }
+.h-26 { height: 26px; }
+.h-7289 { height: 7289px; }
+.h-905496362982981723 { height: 905496362982981723px; }
+.h-60 { height: 60px; }
+.h-24 { height: 24px; }
+.h-36 { height: 36px; }
+.h-calc-full-60 { height: calc(100% - 60px); }
+.vh { height: 100vh; }
+.w-full { width: 100%; }
+.w-226 { width: 226px; }
+.w-0 { width: 0px; }
+.bg-primary { background-color: var(--primary) !important; }
+.bg-secondary { background-color: var(--secondary) !important; }
+.bg-white { background-color: var(--white) !important; }
+.bg-info { background-color: var(--info) !important; }
+.bg-error { background-color: var(--error) !important; }
+.bg-warning { background-color: var(--warning) !important; }
+.bg-success { background-color: var(--success) !important; }
+.bg-muted { background-color: var(--muted) !important; }
+.bg-t-1 { background-color: var(--bg-1) !important; }
+.bg-t-2 { background-color: var(--bg-2) !important; }
+.bg-t-0 { background-color: var(--bg-0) !important; }
+.bg-h-cb3837 { background-color: #cb3837; }
+.bg-h-7289da { background-color: #7289da; }
+.tx-5 { font-size: 5px; }
+.tx-14 { font-size: 14px; }
+.tx-16 { font-size: 16px; }
+.tx-30 { font-size: 30px; }
+.tx-lg { font-size: 16px; }
+.tx-5xl { font-size: 26px; }
+.tx-center { text-align: center; }
+.tx-left { text-align: left; }
+.tx-right { text-align: right; }
+.tx-bold { font-weight: bold; }
+.tx-uppercase { text-transform: uppercase; }
+.tx-nowrap { white-space: nowrap; }
+.tx-top { vertical-align: top; }
+.tx-lh-24 { line-height: 24px; }
+.tx-lh-36 { line-height: 36px; }
+.tx-primary { color: var(--primary) !important; }
+.tx-secondary { color: var(--secondary) !important; }
+.tx-white { color: var(--white) !important; }
+.tx-info { color: var(--info) !important; }
+.tx-error { color: var(--error) !important; }
+.tx-warning { color: var(--warning) !important; }
+.tx-success { color: var(--success) !important; }
+.tx-muted { color: var(--muted) !important; }
+.tx-t-1 { color: var(--tx-1) !important; }
+.bd-solid { border-style: solid; }
+.bd-collapse { border-collapse: collapse; }
+.bd-primary { border-color: var(--primary) !important; }
+.bd-secondary { border-color: var(--secondary) !important; }
+.bd-info { border-color: var(--info) !important; }
+.bd-error { border-color: var(--error) !important; }
+.bd-warning { border-color: var(--warning) !important; }
+.bd-success { border-color: var(--success) !important; }
+.bd-muted { border-color: var(--muted) !important; }
+.bd-t-2 { border-color: var(--bd-2) !important; }
+.bdb-0 { border-bottom-width: 0px; }
+.bdt-1 { border-top-width: 1px; }
+.bdx-0 { border-left-width: 0px; border-right-width: 0px; }
+.curved { border-radius: 4px; }
+.rounded { border-radius: 12px; }
+.pill { border-radius: 10000px; }
+.m-0 { margin: 0px; }
+.m-0 { margin: 0px; }
+.m-60 { margin: 60px; }
+.mb-0 { margin-bottom: 0px; }
+.mb-100 { margin-bottom: 100px; }
+.mb-20 { margin-bottom: 20px; }
+.ml-10 { margin-left: 10px; }
+.ml-5 { margin-left: 5px; }
+.mr-10 { margin-right: 10px; }
+.mt-0 { margin-top: 0px; }
+.mt-20 { margin-top: 20px; }
+.my-40 { margin-top: 40px; margin-bottom: 40px; }
+.p-5 { padding: 5px; }
+.p-0 { padding: 0px; }
+.p-60 { padding: 60px; }
+.p-16 { padding: 16px; }
+.p-10 { padding: 10px; }
+.pb-10 { padding-bottom: 10px; }
+.pl-10 { padding-left: 10px; }
+.pr-10 { padding-right: 10px; }
+.pr-5 { padding-right: 5px; }
+.pt-20 { padding-top: 20px; }
+.px-20 { padding-left: 20px; padding-right: 20px; }
+.py-15 { padding-top: 15px; padding-bottom: 15px; }
+.py-5 { padding-top: 5px; padding-bottom: 5px; }
+.py-10 { padding-top: 10px; padding-bottom: 10px; }
+.py-20 { padding-top: 20px; padding-bottom: 20px; }
+.py-40 { padding-top: 40px; padding-bottom: 40px; }
+.cursor-pointer { cursor: pointer; }
+.transition-500 { transition: 500ms; }
+.shadow-0-0-10-0-0-0-5 { box-shadow: 0px 0px 10px rgb(0, 0, 0, 0.5); }
+@media (max-width: 767px) {
+  .md-inline-block { display: inline-block; }
+  .md-left-0 { left: 0px; }
+  .md-left-226 { left: 226px; }
+  .md-left--226 { left: -226px; }
+  .md-right-0 { right: 0px; }
+  .md-right-200 { right: 200px; }
+}
\ No newline at end of file
diff --git a/docs/build/client/f859bf7a335e9eba03e0.html b/docs/build/client/f859bf7a335e9eba03e0.html
index 6945732..f9e8bf8 100644
--- a/docs/build/client/f859bf7a335e9eba03e0.html
+++ b/docs/build/client/f859bf7a335e9eba03e0.html
@@ -18,91 +18,148 @@
   
   
   
-  
+  
   
   
   
   
 
-  
-    
    
-  
-  
-    Temple Logo
-  
-  
    Temple
    
-  
+      
+        
+          
    
+            Client API
+          
    
+
+          
+            Temple exposes a variable on the browser called 
+            TempleAPI that includes all the 
+            components, classes, functions and variables used to render
+            the document on the client-side. 
+          
 
-        
-          Temple exposes a variable on the browser called 
-          TempleAPI that includes all the 
-          components, classes, functions and variables used to render
-          the document on the client-side. 
-        
+          
+            
+            Warning: Using the client API in the wrong 
+            way could possibly break your client application.
+          
 
-        
-          
-          Warning: Using the client API in the wrong 
-          way could possibly break your client application.
-        
+          
 
-        
-        
-        
-      
-      
    
-        
+          
+          
    
+        
+      
+    
   
 
\ No newline at end of file
diff --git a/docs/build/client/f859bf7a335e9eba03e0.js b/docs/build/client/f859bf7a335e9eba03e0.js
index 1a85fbb..7766dd3 100644
--- a/docs/build/client/f859bf7a335e9eba03e0.js
+++ b/docs/build/client/f859bf7a335e9eba03e0.js
@@ -1,21 +1,29 @@
-var TempleAPI=(()=>{var wt=Object.create;var ye=Object.defineProperty;var At=Object.getOwnPropertyDescriptor;var Et=Object.getOwnPropertyNames;var Ft=Object.getPrototypeOf,Rt=Object.prototype.hasOwnProperty;var C=(t,e)=>()=>(e||t((e={exports:{}}).exports,e),e.exports),Dt=(t,e)=>{for(var r in e)ye(t,r,{get:e[r],enumerable:!0})},Xe=(t,e,r,l)=>{if(e&&typeof e=="object"||typeof e=="function")for(let i of Et(e))!Rt.call(t,i)&&i!==r&&ye(t,i,{get:()=>e[i],enumerable:!(l=At(e,i))||l.enumerable});return t};var M=(t,e,r)=>(r=t!=null?wt(Ft(t)):{},Xe(e||!t||!t.__esModule?ye(r,"default",{value:t,enumerable:!0}):r,t)),St=t=>Xe(ye({},"__esModule",{value:!0}),t);var je=C(Pe=>{"use strict";Object.defineProperty(Pe,"__esModule",{value:!0});var Ce=class extends Error{static for(e,...r){return r.forEach(function(l){e=e.replace("%s",l)}),new this(e)}static forErrorsFound(e){let r=new this("Invalid Parameters");return r.errors=e,r}static require(e,r,...l){if(!e){for(let i of l)r=r.replace("%s",i);throw new this(r)}}constructor(e,r=500){super(),this.errors={},this.start=0,this.end=0,this.message=e,this.name=this.constructor.name,this.code=r}withCode(e){return this.code=e,this}withPosition(e,r){return this.start=e,this.end=r,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};Pe.default=Ce});var te=C(ee=>{"use strict";Object.defineProperty(ee,"__esModule",{value:!0});ee.TempleEmitter=void 0;var be=class extends EventTarget{emit(e,r){return this.dispatchEvent(new CustomEvent(e,{detail:r})),this}on(e,r){if(e==="ready"&&document.readyState!=="loading"){let l=new CustomEvent("ready");return setTimeout(()=>r(l),1),this}return this.addEventListener(e,r),this}once(e,r){let l=i=>{this.unbind(e,l),r(i)};return this.on(e,l),this}unbind(e,r){return this.removeEventListener(e,r),this}};ee.TempleEmitter=be;var Ye=new be;document.onreadystatechange=()=>{document.readyState!=="loading"&&Ye.emit("ready")};ee.default=Ye});var Ie=C(re=>{"use strict";var Ct=re&&re.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(re,"__esModule",{value:!0});var Me=Ct(te()),Le=class{get attributes(){return Object.assign({},this._attributes)}get element(){return this._element}constructor(e,r){this._element=e,this._attributes=r}hasAttribute(e){return e in this._attributes}getAttribute(e){return this._attributes[e]}removeAttribute(e,r=!1){let l=this.getAttribute(e);return typeof l>"u"?this:(delete this._attributes[e],this._element.removeAttribute(e),r||Me.default.emit("attribute-remove",{element:this,key:e,previous:l}),this)}setAttribute(e,r,l=!1){if(typeof r>"u")return this.removeAttribute(e,l);let i=this.getAttribute(e);return i===r?this:(this._attributes[e]=r,typeof r=="string"&&this._element.setAttribute(e,r),l||(typeof i>"u"?Me.default.emit("attribute-create",{element:this,key:e,value:r}):Me.default.emit("attribute-update",{element:this,key:e,value:r,previous:i})),this)}setAttributes(e,r=!1){for(let[i,g]of Object.entries(e))this.setAttribute(i,g,r);let l=Object.keys(e);for(let i of Object.keys(this._attributes))l.includes(i)||this.removeAttribute(i,r);return this}};re.default=Le});var ke=C(ne=>{"use strict";var Pt=ne&&ne.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ne,"__esModule",{value:!0});var jt=Pt(Ie()),xe=class{static get elements(){return this._elements}static createComponent(e,r,l,i=[]){let g=document.createElement("template");g.innerHTML=`<${e}>`;let d=g.content.querySelector(`${e}`);Object.setPrototypeOf(d,r.prototype),d.constructor=r.constructor,d.constructor.component=r.component;for(let[x,k]of Object.entries(l))typeof k=="string"?d.setAttribute(x,k):k===!0&&d.setAttribute(x,x);return d._TempleAttributes=l,d.props=l,i.forEach(x=>d.appendChild(x)),d.register(),customElements.get(e)||d.connectedCallback(),this.register(d,l)}static createElement(e,r,l=[]){let i=document.createElement(e);for(let[g,h]of Object.entries(r))typeof h=="string"?i.setAttribute(g,h):h===!0&&i.setAttribute(g,g);return l.filter(g=>typeof g<"u").forEach(g=>i.appendChild(g)),this.register(i,r)}static createText(e,r=!1){return document.createTextNode(e)}static filter(e){let r=[];return this._elements.forEach((l,i)=>{e(l,i)&&r.push(l)}),r}static get(e){return this._elements.get(e)||null}static has(e){return this._elements.has(e)}static map(e){let r=[];return this._elements.forEach((l,i)=>{r.push(e(l,i))}),r}static register(e,r){if(this.has(e))return this.get(e);let l=new jt.default(e,r||{});return this._elements.set(e,l),l}};xe._elements=new Map;ne.default=xe});var q=C(ie=>{"use strict";Object.defineProperty(ie,"__esModule",{value:!0});ie.TempleDataMap=void 0;var ve=class{constructor(){window.__APP_DATA__||(window.__APP_DATA__={})}clear(){return window.__APP_DATA__={},this}delete(e){return this.has(e)?(delete window.__APP_DATA__[e],!0):!1}entries(){return Object.entries(window.__APP_DATA__)}has(e){return e in window.__APP_DATA__}get(e){return window.__APP_DATA__[e]}keys(){return Object.keys(window.__APP_DATA__)}set(e,r){return window.__APP_DATA__[e]=r,this}values(){return Object.values(window.__APP_DATA__)}};ie.TempleDataMap=ve;var Mt=new ve;ie.default=Mt});var Ke=C(ae=>{"use strict";var $e=ae&&ae.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ae,"__esModule",{value:!0});var se=$e(ke()),Te=$e(te()),Ve=$e(q()),Oe=class t extends HTMLElement{constructor(){super(...arguments),this._initiated=!1,this._template=null,this._attributes={},this._props={},this._children=void 0,this._rendering=!1}static register(){customElements.define(this.component[0],this)}get attr(){return this._attributes}get element(){return se.default.has(this)?se.default.get(this):se.default.register(this,this._TempleAttributes||{})}get metadata(){let[e,r]=this.constructor.component;return{tagname:e,classname:r}}get originalChildren(){return this._children}get initiated(){return this._initiated}get props(){return this._props}set props(e){this._props=Object.assign({},e),this._attributes=Object.fromEntries(Object.entries(e).filter(r=>typeof r[1]=="string"||r[1]===!0))}adoptedCallback(){this.render()}attributeChangedCallback(e,r,l){this.props=Object.assign(Object.assign({},this.props),{[e]:l}),this.render()}connectedCallback(){this.wait()}disconnectedCallback(){}getParentComponent(){let e=this.parentElement;for(;e;){if(e instanceof t)return e;e=e.parentElement}return null}register(){se.default.register(this,this._props)}render(){let e=this.getParentComponent();if(e&&!e.initiated)return;if(this._rendering)return;this._rendering=!0,Ve.default.set("current",this);let r=this.styles();this._template?Te.default.emit("unmounted",this):this._template=this.template();let l=this._template().filter(Boolean);if(r.length===0)this.textContent="",l.forEach(i=>this.appendChild(i));else{this.shadowRoot||this.attachShadow({mode:"open"});let i=this.shadowRoot;this.textContent="",i.textContent="";let g=document.createElement("style");g.innerText=r,i.appendChild(g),l.forEach(h=>{var d;return(d=this.shadowRoot)===null||d===void 0?void 0:d.appendChild(h)})}return Ve.default.delete("current"),this._initiated=!0,Te.default.emit("mounted",this),this._rendering=!1,this.shadowRoot?this.shadowRoot.innerHTML:this.innerHTML}wait(){if(document.readyState!=="loading")this._update();else{let e=()=>{this._update(),Te.default.unbind("ready",e)};Te.default.on("ready",e)}}_toNodeList(e){return e instanceof Node?[e]:Array.isArray(e)&&e.every(r=>r instanceof Node)?e:[se.default.createText(String(e))]}_update(){typeof this._children>"u"&&(this._children=Array.from(this.childNodes||[]));let e=this.element;e&&(this.props=Object.assign({},e.attributes),this.render()),this._initiated||this.render()}};ae.default=Oe});var Qe=C(le=>{"use strict";var Lt=le&&le.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(le,"__esModule",{value:!0});var It=Lt(q());function Ot(t){let e=It.default.get("env")||{};return t?e[t]||null:e}le.default=Ot});var Be=C(oe=>{"use strict";var $t=oe&&oe.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(oe,"__esModule",{value:!0});oe.default=Bt;var et=$t(q());function Bt(t=null){return t||(t=et.default.get("current")||null),t?t==="document"?et.default.get("props")||{}:t.props:{}}});var tt=C(pe=>{"use strict";var Nt=pe&&pe.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(pe,"__esModule",{value:!0});pe.default=qt;var Ht=Nt(Be());function qt(t=null){return(0,Ht.default)(t).class}});var nt=C(U=>{"use strict";var zt=U&&U.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(U,"__esModule",{value:!0});U.innerHTML=Gt;U.default=rt;var Jt=zt(q());function Gt(t=null){let e=rt(t),r=document.createElement("template");return r.append(...e),r.innerHTML}function rt(t=null){return t||(t=Jt.default.get("current")||null),t?t.originalChildren||[]:[]}});var at=C(z=>{"use strict";var st=z&&z.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(z,"__esModule",{value:!0});z.SignalRegistry=void 0;z.default=Wt;var it=st(je()),Ut=st(q()),W=class t{static observe(e,r){let l={getter:()=>i.raw,setter:h=>h},i={raw:r,getter(h){return l.getter=h,i},setter(h){return l.setter=h,i}};Object.defineProperty(i,"value",{get(){return l.getter()},set(h){let d=l.setter(h),x=t.serialize(d)!==t.serialize(i.raw);i.raw=d,x&&e.render()}});let g=this._observers.get(e);return g?(g.observed++,g.values.push(i)):this._observers.set(e,{observed:1,values:[i]}),i}static observer(e){return this._observers.get(e)||null}static serialize(e){return JSON.stringify(e)}};z.SignalRegistry=W;W._observers=new Map;function Wt(t,e=null){if(e||(e=Ut.default.get("current")||null),!e)throw it.default.for("Signals can only be created within a Temple component");if(!e.initiated)return W.observe(e,t);let r=W.observer(e);if(!r)throw it.default.for("State mismatch");return r.values[r.observed++%r.values.length]}});var dt=C(_e=>{"use strict";var ot=_e&&_e.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(_e,"__esModule",{value:!0});var lt=ot(ke()),pt=ot(te()),ct=(t,e)=>Array.from(t.querySelectorAll("*")).filter(r=>{let l=lt.default.get(r);return l&&l.hasAttribute(e)}).map(r=>lt.default.get(r));function Ne(t,e){pt.default.on("mounted",r=>{if(!r.detail)return;let l=r.detail;ct(l.shadowRoot||l,t).forEach(e)})}function Zt(t,e){pt.default.on("unmounted",r=>{if(!r.detail)return;let l=r.detail;ct(l.shadowRoot||l,t).forEach(e)})}Ne("mount",t=>{let e=t.getAttribute("mount");if(typeof e=="function"){let r=new CustomEvent("mount",{detail:{node:t,target:t.element}});e(r)}});Zt("unmount",t=>{let e=t.getAttribute("unmount");if(typeof e=="function"){let r=new CustomEvent("unmount",{detail:{node:t,target:t.element}});e(r)}});Ne("if",t=>{let e=t.getAttribute("if");(e===!1||e==="false"||typeof e=="function"&&!e())&&t.element.remove()});["click","dblclick","mousedown","mouseup","mousemove","mouseover","mouseout","wheel","keydown","keypress","keyup","blur","change","contextmenu","focus","input","submit","invalid","reset","search","select","copy","cut","paste","drag","dragstart","dragend","dragover","dragenter","dragleave","drop","scroll","durationchange","ended","error","loadeddata","loadedmetadata","loadstart","pause","play","playing","progress","ratechange","seeked","seeking","stalled","suspend","timeupdate","volumechange","waiting","animationstart","animationend","animationiteration","transitionend","toggle"].forEach(t=>Ne(t,e=>{let r=e.getAttribute(t);typeof r=="function"&&(e.element.removeEventListener(t,r),e.element.addEventListener(t,r))}))});var He=C(y=>{"use strict";var Xt=y&&y.__createBinding||(Object.create?function(t,e,r,l){l===void 0&&(l=r);var i=Object.getOwnPropertyDescriptor(e,r);(!i||("get"in i?!e.__esModule:i.writable||i.configurable))&&(i={enumerable:!0,get:function(){return e[r]}}),Object.defineProperty(t,l,i)}:function(t,e,r,l){l===void 0&&(l=r),t[l]=e[r]}),Yt=y&&y.__setModuleDefault||(Object.create?function(t,e){Object.defineProperty(t,"default",{enumerable:!0,value:e})}:function(t,e){t.default=e}),we=y&&y.__importStar||function(t){if(t&&t.__esModule)return t;var e={};if(t!=null)for(var r in t)r!=="default"&&Object.prototype.hasOwnProperty.call(t,r)&&Xt(e,t,r);return Yt(e,t),e},J=y&&y.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(y,"__esModule",{value:!0});y.SignalRegistry=y.TempleException=y.TempleEmitter=y.TempleElement=y.TempleRegistry=y.TempleComponent=y.TempleDataMap=y.emitter=y.signal=y.innerHTML=y.children=y.classnames=y.props=y.env=y.data=void 0;var Vt=J(je());y.TempleException=Vt.default;var Kt=J(Ke());y.TempleComponent=Kt.default;var Qt=J(ke());y.TempleRegistry=Qt.default;var er=J(Ie());y.TempleElement=er.default;var ut=we(te());y.emitter=ut.default;Object.defineProperty(y,"TempleEmitter",{enumerable:!0,get:function(){return ut.TempleEmitter}});var mt=we(q());y.data=mt.default;Object.defineProperty(y,"TempleDataMap",{enumerable:!0,get:function(){return mt.TempleDataMap}});var tr=J(Qe());y.env=tr.default;var rr=J(Be());y.props=rr.default;var nr=J(tt());y.classnames=nr.default;var ft=we(nt());y.children=ft.default;Object.defineProperty(y,"innerHTML",{enumerable:!0,get:function(){return ft.innerHTML}});var gt=we(at());y.signal=gt.default;Object.defineProperty(y,"SignalRegistry",{enumerable:!0,get:function(){return gt.SignalRegistry}});dt()});var B=C((_r,ht)=>{ht.exports={...He()}});var yt=C((Ar,Ee)=>{var ir=typeof window<"u"?window:typeof WorkerGlobalScope<"u"&&self instanceof WorkerGlobalScope?self:{};var u=function(t){var e=/(?:^|\s)lang(?:uage)?-([\w-]+)(?=\s|$)/i,r=0,l={},i={manual:t.Prism&&t.Prism.manual,disableWorkerMessageHandler:t.Prism&&t.Prism.disableWorkerMessageHandler,util:{encode:function n(s){return s instanceof g?new g(s.type,n(s.content),s.alias):Array.isArray(s)?s.map(n):s.replace(/&/g,"&").replace(/"u")return null;if("currentScript"in document)return document.currentScript;try{throw new Error}catch(p){var n=(/at [^(\r\n]*\((.*):[^:]+:[^:]+\)$/i.exec(p.stack)||[])[1];if(n){var s=document.getElementsByTagName("script");for(var o in s)if(s[o].src==n)return s[o]}return null}},isActive:function(n,s,o){for(var p="no-"+s;n;){var c=n.classList;if(c.contains(s))return!0;if(c.contains(p))return!1;n=n.parentElement}return!!o}},languages:{plain:l,plaintext:l,text:l,txt:l,extend:function(n,s){var o=i.util.clone(i.languages[n]);for(var p in s)o[p]=s[p];return o},insertBefore:function(n,s,o,p){p=p||i.languages;var c=p[n],f={};for(var b in c)if(c.hasOwnProperty(b)){if(b==s)for(var m in o)o.hasOwnProperty(m)&&(f[m]=o[m]);o.hasOwnProperty(b)||(f[b]=c[b])}var F=p[n];return p[n]=f,i.languages.DFS(i.languages,function(D,O){O===F&&D!=n&&(this[D]=f)}),f},DFS:function n(s,o,p,c){c=c||{};var f=i.util.objId;for(var b in s)if(s.hasOwnProperty(b)){o.call(s,b,s[b],p||b);var m=s[b],F=i.util.type(m);F==="Object"&&!c[f(m)]?(c[f(m)]=!0,n(m,o,null,c)):F==="Array"&&!c[f(m)]&&(c[f(m)]=!0,n(m,o,b,c))}}},plugins:{},highlightAll:function(n,s){i.highlightAllUnder(document,n,s)},highlightAllUnder:function(n,s,o){var p={callback:o,container:n,selector:'code[class*="language-"], [class*="language-"] code, code[class*="lang-"], [class*="lang-"] code'};i.hooks.run("before-highlightall",p),p.elements=Array.prototype.slice.apply(p.container.querySelectorAll(p.selector)),i.hooks.run("before-all-elements-highlight",p);for(var c=0,f;f=p.elements[c++];)i.highlightElement(f,s===!0,p.callback)},highlightElement:function(n,s,o){var p=i.util.getLanguage(n),c=i.languages[p];i.util.setLanguage(n,p);var f=n.parentElement;f&&f.nodeName.toLowerCase()==="pre"&&i.util.setLanguage(f,p);var b=n.textContent,m={element:n,language:p,grammar:c,code:b};function F(O){m.highlightedCode=O,i.hooks.run("before-insert",m),m.element.innerHTML=m.highlightedCode,i.hooks.run("after-highlight",m),i.hooks.run("complete",m),o&&o.call(m.element)}if(i.hooks.run("before-sanity-check",m),f=m.element.parentElement,f&&f.nodeName.toLowerCase()==="pre"&&!f.hasAttribute("tabindex")&&f.setAttribute("tabindex","0"),!m.code){i.hooks.run("complete",m),o&&o.call(m.element);return}if(i.hooks.run("before-highlight",m),!m.grammar){F(i.util.encode(m.code));return}if(s&&t.Worker){var D=new Worker(i.filename);D.onmessage=function(O){F(O.data)},D.postMessage(JSON.stringify({language:m.language,code:m.code,immediateClose:!0}))}else F(i.highlight(m.code,m.grammar,m.language))},highlight:function(n,s,o){var p={code:n,grammar:s,language:o};if(i.hooks.run("before-tokenize",p),!p.grammar)throw new Error('The language "'+p.language+'" has no grammar.');return p.tokens=i.tokenize(p.code,p.grammar),i.hooks.run("after-tokenize",p),g.stringify(i.util.encode(p.tokens),p.language)},tokenize:function(n,s){var o=s.rest;if(o){for(var p in o)s[p]=o[p];delete s.rest}var c=new x;return k(c,c.head,n),d(n,c,s,c.head,0),E(c)},hooks:{all:{},add:function(n,s){var o=i.hooks.all;o[n]=o[n]||[],o[n].push(s)},run:function(n,s){var o=i.hooks.all[n];if(!(!o||!o.length))for(var p=0,c;c=o[p++];)c(s)}},Token:g};t.Prism=i;function g(n,s,o,p){this.type=n,this.content=s,this.alias=o,this.length=(p||"").length|0}g.stringify=function n(s,o){if(typeof s=="string")return s;if(Array.isArray(s)){var p="";return s.forEach(function(F){p+=n(F,o)}),p}var c={type:s.type,content:n(s.content,o),tag:"span",classes:["token",s.type],attributes:{},language:o},f=s.alias;f&&(Array.isArray(f)?Array.prototype.push.apply(c.classes,f):c.classes.push(f)),i.hooks.run("wrap",c);var b="";for(var m in c.attributes)b+=" "+m+'="'+(c.attributes[m]||"").replace(/"/g,""")+'"';return"<"+c.tag+' class="'+c.classes.join(" ")+'"'+b+">"+c.content+""};function h(n,s,o,p){n.lastIndex=s;var c=n.exec(o);if(c&&p&&c[1]){var f=c[1].length;c.index+=f,c[0]=c[0].slice(f)}return c}function d(n,s,o,p,c,f){for(var b in o)if(!(!o.hasOwnProperty(b)||!o[b])){var m=o[b];m=Array.isArray(m)?m:[m];for(var F=0;F=f.reach);I+=S.value.length,S=S.next){var G=S.value;if(s.length>n.length)return;if(!(G instanceof g)){var me=1,L;if(Ue){if(L=h(We,I,n,Ge),!L||L.index>=n.length)break;var fe=L.index,Tt=L.index+L[0].length,$=I;for($+=S.value.length;fe>=$;)S=S.next,$+=S.value.length;if($-=S.value.length,I=$,S.value instanceof g)continue;for(var Q=S;Q!==s.tail&&($f.reach&&(f.reach=De);var he=S.prev;Re&&(he=k(s,he,Re),I+=Re.length),T(s,he,me);var _t=new g(b,O?i.tokenize(ge,O):ge,kt,ge);if(S=k(s,he,_t),Ze&&k(s,S,Ze),me>1){var Se={cause:b+","+F,reach:De};d(n,s,o,S.prev,I,Se),f&&Se.reach>f.reach&&(f.reach=Se.reach)}}}}}}function x(){var n={value:null,prev:null,next:null},s={value:null,prev:n,next:null};n.next=s,this.head=n,this.tail=s,this.length=0}function k(n,s,o){var p=s.next,c={value:o,prev:s,next:p};return s.next=c,p.prev=c,n.length++,c}function T(n,s,o){for(var p=s.next,c=0;c/,greedy:!0},prolog:{pattern:/<\?[\s\S]+?\?>/,greedy:!0},doctype:{pattern:/"'[\]]|"[^"]*"|'[^']*')+(?:\[(?:[^<"'\]]|"[^"]*"|'[^']*'|<(?!!--)|)*\]\s*)?>/i,greedy:!0,inside:{"internal-subset":{pattern:/(^[^\[]*\[)[\s\S]+(?=\]>$)/,lookbehind:!0,greedy:!0,inside:null},string:{pattern:/"[^"]*"|'[^']*'/,greedy:!0},punctuation:/^$|[[\]]/,"doctype-tag":/^DOCTYPE/i,name:/[^\s<>'"]+/}},cdata:{pattern://i,greedy:!0},tag:{pattern:/<\/?(?!\d)[^\s>\/=$<%]+(?:\s(?:\s*[^\s>\/=]+(?:\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))|(?=[\s/>])))+)?\s*\/?>/,greedy:!0,inside:{tag:{pattern:/^<\/?[^\s>\/]+/,inside:{punctuation:/^<\/?/,namespace:/^[^\s>\/:]+:/}},"special-attr":[],"attr-value":{pattern:/=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+)/,inside:{punctuation:[{pattern:/^=/,alias:"attr-equals"},{pattern:/^(\s*)["']|["']$/,lookbehind:!0}]}},punctuation:/\/?>/,"attr-name":{pattern:/[^\s>\/]+/,inside:{namespace:/^[^\s>\/:]+:/}}}},entity:[{pattern:/&[\da-z]{1,8};/i,alias:"named-entity"},/&#x?[\da-f]{1,8};/i]};u.languages.markup.tag.inside["attr-value"].inside.entity=u.languages.markup.entity;u.languages.markup.doctype.inside["internal-subset"].inside=u.languages.markup;u.hooks.add("wrap",function(t){t.type==="entity"&&(t.attributes.title=t.content.replace(/&/,"&"))});Object.defineProperty(u.languages.markup.tag,"addInlined",{value:function(e,r){var l={};l["language-"+r]={pattern:/(^$)/i,lookbehind:!0,inside:u.languages[r]},l.cdata=/^$/i;var i={"included-cdata":{pattern://i,inside:l}};i["language-"+r]={pattern:/[\s\S]+/,inside:u.languages[r]};var g={};g[e]={pattern:RegExp(/(<__[^>]*>)(?:))*\]\]>|(?!)/.source.replace(/__/g,function(){return e}),"i"),lookbehind:!0,greedy:!0,inside:i},u.languages.insertBefore("markup","cdata",g)}});Object.defineProperty(u.languages.markup.tag,"addAttribute",{value:function(t,e){u.languages.markup.tag.inside["special-attr"].push({pattern:RegExp(/(^|["'\s])/.source+"(?:"+t+")"+/\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))/.source,"i"),lookbehind:!0,inside:{"attr-name":/^[^\s=]+/,"attr-value":{pattern:/=[\s\S]+/,inside:{value:{pattern:/(^=\s*(["']|(?!["'])))\S[\s\S]*(?=\2$)/,lookbehind:!0,alias:[e,"language-"+e],inside:u.languages[e]},punctuation:[{pattern:/^=/,alias:"attr-equals"},/"|'/]}}}})}});u.languages.html=u.languages.markup;u.languages.mathml=u.languages.markup;u.languages.svg=u.languages.markup;u.languages.xml=u.languages.extend("markup",{});u.languages.ssml=u.languages.xml;u.languages.atom=u.languages.xml;u.languages.rss=u.languages.xml;(function(t){var e=/(?:"(?:\\(?:\r\n|[\s\S])|[^"\\\r\n])*"|'(?:\\(?:\r\n|[\s\S])|[^'\\\r\n])*')/;t.languages.css={comment:/\/\*[\s\S]*?\*\//,atrule:{pattern:RegExp("@[\\w-](?:"+/[^;{\s"']|\s+(?!\s)/.source+"|"+e.source+")*?"+/(?:;|(?=\s*\{))/.source),inside:{rule:/^@[\w-]+/,"selector-function-argument":{pattern:/(\bselector\s*\(\s*(?![\s)]))(?:[^()\s]|\s+(?![\s)])|\((?:[^()]|\([^()]*\))*\))+(?=\s*\))/,lookbehind:!0,alias:"selector"},keyword:{pattern:/(^|[^\w-])(?:and|not|only|or)(?![\w-])/,lookbehind:!0}}},url:{pattern:RegExp("\\burl\\((?:"+e.source+"|"+/(?:[^\\\r\n()"']|\\[\s\S])*/.source+")\\)","i"),greedy:!0,inside:{function:/^url/i,punctuation:/^\(|\)$/,string:{pattern:RegExp("^"+e.source+"$"),alias:"url"}}},selector:{pattern:RegExp(`(^|[{}\\s])[^{}\\s](?:[^{};"'\\s]|\\s+(?![\\s{])|`+e.source+")*(?=\\s*\\{)"),lookbehind:!0},string:{pattern:e,greedy:!0},property:{pattern:/(^|[^-\w\xA0-\uFFFF])(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*(?=\s*:)/i,lookbehind:!0},important:/!important\b/i,function:{pattern:/(^|[^-a-z0-9])[-a-z0-9]+(?=\()/i,lookbehind:!0},punctuation:/[(){};:,]/},t.languages.css.atrule.inside.rest=t.languages.css;var r=t.languages.markup;r&&(r.tag.addInlined("style","css"),r.tag.addAttribute("style","css"))})(u);u.languages.clike={comment:[{pattern:/(^|[^\\])\/\*[\s\S]*?(?:\*\/|$)/,lookbehind:!0,greedy:!0},{pattern:/(^|[^\\:])\/\/.*/,lookbehind:!0,greedy:!0}],string:{pattern:/(["'])(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/,greedy:!0},"class-name":{pattern:/(\b(?:class|extends|implements|instanceof|interface|new|trait)\s+|\bcatch\s+\()[\w.\\]+/i,lookbehind:!0,inside:{punctuation:/[.\\]/}},keyword:/\b(?:break|catch|continue|do|else|finally|for|function|if|in|instanceof|new|null|return|throw|try|while)\b/,boolean:/\b(?:false|true)\b/,function:/\b\w+(?=\()/,number:/\b0x[\da-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:e[+-]?\d+)?/i,operator:/[<>]=?|[!=]=?=?|--?|\+\+?|&&?|\|\|?|[?*/~^%]/,punctuation:/[{}[\];(),.:]/};u.languages.javascript=u.languages.extend("clike",{"class-name":[u.languages.clike["class-name"],{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$A-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\.(?:constructor|prototype))/,lookbehind:!0}],keyword:[{pattern:/((?:^|\})\s*)catch\b/,lookbehind:!0},{pattern:/(^|[^.]|\.\.\.\s*)\b(?:as|assert(?=\s*\{)|async(?=\s*(?:function\b|\(|[$\w\xA0-\uFFFF]|$))|await|break|case|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally(?=\s*(?:\{|$))|for|from(?=\s*(?:['"]|$))|function|(?:get|set)(?=\s*(?:[#\[$\w\xA0-\uFFFF]|$))|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)\b/,lookbehind:!0}],function:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*(?:\.\s*(?:apply|bind|call)\s*)?\()/,number:{pattern:RegExp(/(^|[^\w$])/.source+"(?:"+(/NaN|Infinity/.source+"|"+/0[bB][01]+(?:_[01]+)*n?/.source+"|"+/0[oO][0-7]+(?:_[0-7]+)*n?/.source+"|"+/0[xX][\dA-Fa-f]+(?:_[\dA-Fa-f]+)*n?/.source+"|"+/\d+(?:_\d+)*n/.source+"|"+/(?:\d+(?:_\d+)*(?:\.(?:\d+(?:_\d+)*)?)?|\.\d+(?:_\d+)*)(?:[Ee][+-]?\d+(?:_\d+)*)?/.source)+")"+/(?![\w$])/.source),lookbehind:!0},operator:/--|\+\+|\*\*=?|=>|&&=?|\|\|=?|[!=]==|<<=?|>>>?=?|[-+*/%&|^!=<>]=?|\.{3}|\?\?=?|\?\.?|[~:]/});u.languages.javascript["class-name"][0].pattern=/(\b(?:class|extends|implements|instanceof|interface|new)\s+)[\w.\\]+/;u.languages.insertBefore("javascript","keyword",{regex:{pattern:RegExp(/((?:^|[^$\w\xA0-\uFFFF."'\])\s]|\b(?:return|yield))\s*)/.source+/\//.source+"(?:"+/(?:\[(?:[^\]\\\r\n]|\\.)*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}/.source+"|"+/(?:\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.)*\])*\])*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}v[dgimyus]{0,7}/.source+")"+/(?=(?:\s|\/\*(?:[^*]|\*(?!\/))*\*\/)*(?:$|[\r\n,.;:})\]]|\/\/))/.source),lookbehind:!0,greedy:!0,inside:{"regex-source":{pattern:/^(\/)[\s\S]+(?=\/[a-z]*$)/,lookbehind:!0,alias:"language-regex",inside:u.languages.regex},"regex-delimiter":/^\/|\/$/,"regex-flags":/^[a-z]+$/}},"function-variable":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*[=:]\s*(?:async\s*)?(?:\bfunction\b|(?:\((?:[^()]|\([^()]*\))*\)|(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)\s*=>))/,alias:"function"},parameter:[{pattern:/(function(?:\s+(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)?\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\))/,lookbehind:!0,inside:u.languages.javascript},{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$a-z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*=>)/i,lookbehind:!0,inside:u.languages.javascript},{pattern:/(\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*=>)/,lookbehind:!0,inside:u.languages.javascript},{pattern:/((?:\b|\s|^)(?!(?:as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)(?![$\w\xA0-\uFFFF]))(?:(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*)\(\s*|\]\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*\{)/,lookbehind:!0,inside:u.languages.javascript}],constant:/\b[A-Z](?:[A-Z_]|\dx?)*\b/});u.languages.insertBefore("javascript","string",{hashbang:{pattern:/^#!.*/,greedy:!0,alias:"comment"},"template-string":{pattern:/`(?:\\[\s\S]|\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}|(?!\$\{)[^\\`])*`/,greedy:!0,inside:{"template-punctuation":{pattern:/^`|`$/,alias:"string"},interpolation:{pattern:/((?:^|[^\\])(?:\\{2})*)\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}/,lookbehind:!0,inside:{"interpolation-punctuation":{pattern:/^\$\{|\}$/,alias:"punctuation"},rest:u.languages.javascript}},string:/[\s\S]+/}},"string-property":{pattern:/((?:^|[,{])[ \t]*)(["'])(?:\\(?:\r\n|[\s\S])|(?!\2)[^\\\r\n])*\2(?=\s*:)/m,lookbehind:!0,greedy:!0,alias:"property"}});u.languages.insertBefore("javascript","operator",{"literal-property":{pattern:/((?:^|[,{])[ \t]*)(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*:)/m,lookbehind:!0,alias:"property"}});u.languages.markup&&(u.languages.markup.tag.addInlined("script","javascript"),u.languages.markup.tag.addAttribute(/on(?:abort|blur|change|click|composition(?:end|start|update)|dblclick|error|focus(?:in|out)?|key(?:down|up)|load|mouse(?:down|enter|leave|move|out|over|up)|reset|resize|scroll|select|slotchange|submit|unload|wheel)/.source,"javascript"));u.languages.js=u.languages.javascript;(function(){if(typeof u>"u"||typeof document>"u")return;Element.prototype.matches||(Element.prototype.matches=Element.prototype.msMatchesSelector||Element.prototype.webkitMatchesSelector);var t="Loading\u2026",e=function(_,v){return"\u2716 Error "+_+" while fetching file: "+v},r="\u2716 Error: File does not exist or is empty",l={js:"javascript",py:"python",rb:"ruby",ps1:"powershell",psm1:"powershell",sh:"bash",bat:"batch",h:"c",tex:"latex"},i="data-src-status",g="loading",h="loaded",d="failed",x="pre[data-src]:not(["+i+'="'+h+'"]):not(['+i+'="'+g+'"])';function k(_,v,w){var n=new XMLHttpRequest;n.open("GET",_,!0),n.onreadystatechange=function(){n.readyState==4&&(n.status<400&&n.responseText?v(n.responseText):n.status>=400?w(e(n.status,n.statusText)):w(r))},n.send(null)}function T(_){var v=/^\s*(\d+)\s*(?:(,)\s*(?:(\d+)\s*)?)?$/.exec(_||"");if(v){var w=Number(v[1]),n=v[2],s=v[3];return n?s?[w,Number(s)]:[w,void 0]:[w,w]}}u.hooks.add("before-highlightall",function(_){_.selector+=", "+x}),u.hooks.add("before-sanity-check",function(_){var v=_.element;if(v.matches(x)){_.code="",v.setAttribute(i,g);var w=v.appendChild(document.createElement("CODE"));w.textContent=t;var n=v.getAttribute("data-src"),s=_.language;if(s==="none"){var o=(/\.(\w+)$/.exec(n)||[,"none"])[1];s=l[o]||o}u.util.setLanguage(w,s),u.util.setLanguage(v,s);var p=u.plugins.autoloader;p&&p.loadLanguages(s),k(n,function(c){v.setAttribute(i,h);var f=T(v.getAttribute("data-range"));if(f){var b=c.split(/\r\n?|\n/g),m=f[0],F=f[1]==null?b.length:f[1];m<0&&(m+=b.length),m=Math.max(0,Math.min(m-1,b.length)),F<0&&(F+=b.length),F=Math.max(0,Math.min(F,b.length)),c=b.slice(m,F).join(`
-`),v.hasAttribute("data-start")||v.setAttribute("data-start",String(m+1))}w.textContent=c,u.highlightElement(w)},function(c){v.setAttribute(i,d),w.textContent=c})}}),u.plugins.fileHighlight={highlight:function(v){for(var w=(v||document).querySelectorAll(x),n=0,s;s=w[n++];)u.highlightElement(s)}};var E=!1;u.fileHighlight=function(){E||(console.warn("Prism.fileHighlight is deprecated. Use `Prism.plugins.fileHighlight.highlight` instead."),E=!0),u.plugins.fileHighlight.highlight.apply(this,arguments)}})()});var ce=C((Er,bt)=>{bt.exports={...He()}});var or={};Dt(or,{BUILD_ID:()=>lr,TempleComponent:()=>R.TempleComponent,TempleElement:()=>R.TempleElement,TempleEmitter:()=>R.TempleEmitter,TempleException:()=>R.TempleException,TempleRegistry:()=>R.TempleRegistry,children:()=>R.children,components:()=>ar,data:()=>R.data,emitter:()=>R.emitter,props:()=>R.props,signal:()=>R.signal});var j=M(B());var Ae=M(B()),Z=class extends Ae.TempleComponent{static component=["main","Main_fd7f1af6410c5b5c8e1f"];styles(){return""}template(){let e=this.props,r=()=>this.originalChildren;return()=>[Ae.TempleRegistry.createElement("main",{},[...this._toNodeList(r())]).element]}};var A=M(B()),qe=M(yt()),xt=M(ce()),N=class extends A.TempleComponent{static component=["code","Code_6f36bc13bb6a166c7abc"];styles(){return`:host {
+var TempleAPI=(()=>{var zt=Object.create;var Ce=Object.defineProperty;var Jt=Object.getOwnPropertyDescriptor;var Gt=Object.getOwnPropertyNames;var Wt=Object.getPrototypeOf,Ut=Object.prototype.hasOwnProperty;var P=(t,e)=>()=>(e||t((e={exports:{}}).exports,e),e.exports),Zt=(t,e)=>{for(var r in e)Ce(t,r,{get:e[r],enumerable:!0})},ht=(t,e,r,a)=>{if(e&&typeof e=="object"||typeof e=="function")for(let n of Gt(e))!Ut.call(t,n)&&n!==r&&Ce(t,n,{get:()=>e[n],enumerable:!(a=Jt(e,n))||a.enumerable});return t};var R=(t,e,r)=>(r=t!=null?zt(Wt(t)):{},ht(e||!t||!t.__esModule?Ce(r,"default",{value:t,enumerable:!0}):r,t)),Xt=t=>ht(Ce({},"__esModule",{value:!0}),t);var fe=P(Ke=>{"use strict";Object.defineProperty(Ke,"__esModule",{value:!0});var Ve=class extends Error{static for(e,...r){return r.forEach(function(a){e=e.replace("%s",a)}),new this(e)}static forErrorsFound(e){let r=new this("Invalid Parameters");return r.errors=e,r}static require(e,r,...a){if(!e){for(let n of a)r=r.replace("%s",n);throw new this(r)}}constructor(e,r=500){super(),this.errors={},this.start=0,this.end=0,this.message=e,this.name=this.constructor.name,this.code=r}withCode(e){return this.code=e,this}withPosition(e,r){return this.start=e,this.end=r,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};Ke.default=Ve});var Me=P(j=>{"use strict";var Yt=j&&j.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(j,"__esModule",{value:!0});j.match=j.TempleEmitter=j.events=void 0;j.bindAttribute=J;j.unbindAttribute=yt;var gt=Yt(Ie());j.events=["click","dblclick","mousedown","mouseup","mousemove","mouseover","mouseout","wheel","keydown","keypress","keyup","blur","change","contextmenu","focus","input","submit","invalid","reset","search","select","copy","cut","paste","drag","dragstart","dragend","dragover","dragenter","dragleave","drop","scroll","durationchange","ended","error","loadeddata","loadedmetadata","loadstart","pause","play","playing","progress","ratechange","seeked","seeking","stalled","suspend","timeupdate","volumechange","waiting","animationstart","animationend","animationiteration","transitionend","toggle"];var Pe=class extends EventTarget{emit(e,r){return this.dispatchEvent(new CustomEvent(e,{detail:r})),this}on(e,r){if(e==="ready"&&document.readyState!=="loading"){let a=new CustomEvent("ready");return setTimeout(()=>r(a),1),this}return this.addEventListener(e,r),this}once(e,r){let a=n=>{this.unbind(e,a),r(n)};return this.on(e,a),this}unbind(e,r){return this.removeEventListener(e,r),this}};j.TempleEmitter=Pe;var Vt=(t,e)=>Array.from(t.querySelectorAll("*")).filter(r=>{let a=gt.default.get(r),n=a&&a.hasAttribute(e)&&!a.hasEvent(e);return n&&a.addEvent(e),n}).map(r=>gt.default.get(r));j.match=Vt;function J(t,e){je.on("mounted",r=>{if(!r.detail)return;let a=r.detail;(0,j.match)(a.shadowRoot||a,t).forEach(e)})}function yt(t,e){je.on("unmounted",r=>{if(!r.detail)return;let a=r.detail;(0,j.match)(a.shadowRoot||a,t).forEach(e)})}var je=new Pe;j.default=(document.onreadystatechange=()=>{document.readyState!=="loading"&&je.emit("ready")},J("mount",t=>{let e=t.getAttribute("mount");if(typeof e=="function"){let r=new CustomEvent("mount",{detail:{node:t,target:t.element}});e(r)}}),yt("unmount",t=>{let e=t.getAttribute("unmount");if(typeof e=="function"){let r=new CustomEvent("unmount",{detail:{node:t,target:t.element}});e(r)}}),J("connect",t=>{let e=t.getAttribute("connect");if(typeof e=="function"){let r=new CustomEvent("connect",{detail:{node:t,target:t.element}});e(r)}}),J("disconnect",t=>{let e=t.getAttribute("disconnect");if(typeof e=="function"){let r=new CustomEvent("disconnect",{detail:{node:t,target:t.element}});e(r)}}),J("adopt",t=>{let e=t.getAttribute("adopt");if(typeof e=="function"){let r=new CustomEvent("adopt",{detail:{node:t,target:t.element}});e(r)}}),J("if",t=>{let e=t.getAttribute("if");(e===!1||e==="false"||typeof e=="function"&&!e())&&t.element.remove()}),j.events.forEach(t=>J(t,e=>{let r=e.getAttribute(t);typeof r=="function"&&(e.element.removeEventListener(t,r),e.element.addEventListener(t,r))})),je)});var tt=P(he=>{"use strict";var Kt=he&&he.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(he,"__esModule",{value:!0});var Qe=Kt(Me()),et=class{get attributes(){return Object.assign({},this._attributes)}get element(){return this._element}get events(){return this._events}constructor(e,r){this._events=new Set,this._element=e,this._attributes=r}addEvent(e){return this._events.add(e),this}getAttribute(e){return this._attributes[e]}hasAttribute(e){return e in this._attributes}hasEvent(e){return this._events.has(e)}removeAttribute(e,r=!1){let a=this.getAttribute(e);return typeof a>"u"?this:(delete this._attributes[e],this._element.removeAttribute(e),r||Qe.default.emit("attribute-remove",{element:this,key:e,previous:a}),this)}setAttribute(e,r,a=!1){if(typeof r>"u")return this.removeAttribute(e,a);let n=this.getAttribute(e);return n===r?this:(this._attributes[e]=r,typeof r=="string"&&this._element.setAttribute(e,r),a||(typeof n>"u"?Qe.default.emit("attribute-create",{element:this,key:e,value:r}):Qe.default.emit("attribute-update",{element:this,key:e,value:r,previous:n})),this)}setAttributes(e,r=!1){for(let[n,u]of Object.entries(e))this.setAttribute(n,u,r);let a=Object.keys(e);for(let n of Object.keys(this._attributes))a.includes(n)||this.removeAttribute(n,r);return this}};he.default=et});var Ie=P(ge=>{"use strict";var Qt=ge&&ge.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ge,"__esModule",{value:!0});var er=Qt(tt()),bt=document.createElement("textarea"),tr=t=>(bt.innerHTML=t,bt.value),Ne=class{static get elements(){return this._elements}static createComponent(e,r,a,n=[]){let u=document.createElement("template");u.innerHTML=`<${e}>`;let d=u.content.querySelector(`${e}`);return Object.setPrototypeOf(d,r.prototype),d.constructor=r.constructor,d.constructor.component=r.component,d.register(a,n),d.element}static createElement(e,r,a=[]){let n=document.createElement(e);for(let[u,y]of Object.entries(r))typeof y=="string"?n.setAttribute(u,y):y===!0&&n.setAttribute(u,u);return a.filter(u=>typeof u<"u").forEach(u=>n.appendChild(u)),this.register(n,r)}static createText(e,r=!0){return document.createTextNode(tr(e))}static filter(e){let r=[];return this._elements.forEach((a,n)=>{e(a,n)&&r.push(a)}),r}static get(e){return this._elements.get(e)||null}static has(e){return this._elements.has(e)}static map(e){let r=[];return this._elements.forEach((a,n)=>{r.push(e(a,n))}),r}static register(e,r){if(this.has(e))return this.get(e);let a=new er.default(e,r||{});return this._elements.set(e,a),a}};Ne._elements=new Map;ge.default=Ne});var Q=P(ye=>{"use strict";Object.defineProperty(ye,"__esModule",{value:!0});ye.TempleDataMap=void 0;var Oe=class{constructor(){window.__APP_DATA__||(window.__APP_DATA__={})}clear(){return window.__APP_DATA__={},this}delete(e){return this.has(e)?(delete window.__APP_DATA__[e],!0):!1}entries(){return Object.entries(window.__APP_DATA__)}has(e){return e in window.__APP_DATA__}get(e){return window.__APP_DATA__[e]}keys(){return Object.keys(window.__APP_DATA__)}set(e,r){return window.__APP_DATA__[e]=r,this}values(){return Object.values(window.__APP_DATA__)}};ye.TempleDataMap=Oe;var rr=new Oe;ye.default=rr});var kt=P(be=>{"use strict";var Be=be&&be.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(be,"__esModule",{value:!0});var xt=Be(fe()),G=Be(Ie()),W=Be(Me()),$e=Be(Q()),rt=class t extends HTMLElement{static register(){customElements.define(this.component[0],this)}get attr(){return Object.fromEntries(Array.from(this.attributes).map(e=>[e.name,e.value]))}get element(){if(!G.default.has(this))throw xt.default.for("Component not mapped.");return G.default.get(this)}get metadata(){let[e,r]=this.constructor.component;return{tagname:e,classname:r}}get originalChildren(){return this._children}get initiated(){return this._initiated}get props(){return this.getAttributes()}get virtual(){return this._virtual}set props(e){this.setAttributes(e)}constructor(){if(super(),this._initiated=!1,this._template=null,this._children=void 0,this._rendering=!1,this._observer=null,this._virtual=!1,!G.default.has(this))throw xt.default.for("Component not mapped.")}adoptedCallback(){this.render(),W.default.emit("adopt",this)}connectedCallback(){this.wait(),W.default.emit("connect",this)}disconnectedCallback(){W.default.emit("disconnect",this)}getAttribute(e){return this.element.getAttribute(e)}getAttributes(){return Object.assign({},this.element.attributes)}getParentComponent(){let e=this.parentElement;for(;e;){if(e instanceof t)return e;e=e.parentElement}return null}hasAttribute(e){return this.element.hasAttribute(e)}register(e={},r=[]){G.default.has(this)?G.default.get(this).setAttributes(e):G.default.register(this,e);for(let[a,n]of Object.entries(e))typeof n=="string"?super.setAttribute(a,n):n===!0&&super.setAttribute(a,a);this._children=r,this._virtual=!0,this.connectedCallback()}removeAttribute(e){this.hasAttribute(e)&&this.element.removeAttribute(e),super.hasAttribute(e)&&super.removeAttribute(e)}render(){let e=this.getParentComponent();if(e&&!e.initiated)return;if(this._rendering)return;this._rendering=!0;let r=$e.default.get("current");$e.default.set("current",this);let a=this.styles();this._template?W.default.emit("unmounted",this):this._template=this.template();let n=this._template().filter(Boolean);if(a.length===0)this.textContent="",n.forEach(u=>this.appendChild(u));else{this.shadowRoot||this.attachShadow({mode:"open"});let u=this.shadowRoot;this.textContent="",u.textContent="";let y=document.createElement("style");y.innerText=a,u.appendChild(y),n.forEach(d=>{var k;return(k=this.shadowRoot)===null||k===void 0?void 0:k.appendChild(d)})}return r?$e.default.set("current",r):$e.default.delete("current"),this._initiated=!0,this._rendering=!1,W.default.emit("mounted",this),this.shadowRoot?this.shadowRoot.innerHTML:this.innerHTML}setAttribute(e,r){this.element.setAttribute(e,r),(typeof r=="string"||r===!0)&&super.setAttribute(e,r)}setAttributes(e){this.element.setAttributes(e)}wait(){if(document.readyState!=="loading")this._update();else{let e=()=>{this._update(),W.default.unbind("ready",e)};W.default.on("ready",e)}}_toNodeList(e){return e instanceof Node?[e]:Array.isArray(e)&&e.every(r=>r instanceof Node)?e:[G.default.createText(String(e))]}_update(){typeof this._children>"u"&&(this._children=Array.from(this.childNodes||[])),this._initiated||this.render()}};be.default=rt});var ee=P(xe=>{"use strict";var vt=xe&&xe.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(xe,"__esModule",{value:!0});xe.default=ir;var nr=vt(fe()),sr=vt(Q());function ir(t=null,e=!1){if(!t&&(t=sr.default.get("current"),!t)){if(!e)throw nr.default.for("Not called within a Temple component");return null}return t}});var Tt=P(ke=>{"use strict";var ar=ke&&ke.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ke,"__esModule",{value:!0});var lr=ar(Q());function or(t){let e=lr.default.get("env")||{};return t?e[t]||null:e}ke.default=or});var nt=P(ve=>{"use strict";var _t=ve&&ve.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(ve,"__esModule",{value:!0});ve.default=dr;var pr=_t(ee()),cr=_t(Q());function dr(t=null){let e=(0,pr.default)(t,!0);return typeof e=="string"?cr.default.get("props")||{}:e?e.props:{}}});var At=P(te=>{"use strict";var wt=te&&te.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(te,"__esModule",{value:!0});te.classlist=fr;te.default=hr;var ur=wt(ee()),mr=wt(nt());function fr(t=null){var e;if(t==="body")return document.body.classList;if(t==="head")return document.head.classList;if(t==="document")return(e=document.body.parentElement)===null||e===void 0?void 0:e.classList;let r=(0,ur.default)(t);return r?.classList}function hr(t=null){return(0,mr.default)(t).class}});var Et=P(U=>{"use strict";var gr=U&&U.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(U,"__esModule",{value:!0});U.innerHTML=br;U.innerText=xr;U.default=st;var yr=gr(ee());function br(t=null){let e=st(t),r=document.createElement("template");return r.append(...e.map(a=>a.cloneNode(!0))),r.innerHTML}function xr(t=null){let e=st(t),r=document.createElement("template");return r.append(...e.map(a=>a.cloneNode(!0))),r.innerText}function st(t=null){let e=(0,yr.default)(t,!0);return typeof e!="string"&&e?e.originalChildren||[]:[]}});var Rt=P(Z=>{"use strict";var Lt=Z&&Z.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(Z,"__esModule",{value:!0});Z.SignalRegistry=void 0;Z.default=Tr;var kr=Lt(ee()),vr=Lt(fe()),re=class t{static observe(e,r){let a={getter:()=>u.raw,setter:d=>d},n=new Set,u={raw:r,change(d){n.add(d)},getter(d){return a.getter=d,u},setter(d){return a.setter=d,u}};Object.defineProperty(u,"value",{get(){return a.getter()},set(d){let k=a.setter(d),x=t.serialize(k)!==t.serialize(u.raw);u.raw=k,x&&(n.forEach(f=>f(k)),e.render())}});let y=this._observers.get(e);return y?(y.observed++,y.values.push(u)):this._observers.set(e,{observed:1,values:[u]}),u}static observer(e){return this._observers.get(e)||null}static serialize(e){return JSON.stringify(e)}};Z.SignalRegistry=re;re._observers=new Map;function Tr(t,e=null){let r=(0,kr.default)(e);if(!r.initiated)return re.observe(r,t);let a=re.observer(r);if(!a)throw vr.default.for("Signal state mismatch");return a.values[a.observed++%a.values.length]}});var at=P(b=>{"use strict";var _r=b&&b.__createBinding||(Object.create?function(t,e,r,a){a===void 0&&(a=r);var n=Object.getOwnPropertyDescriptor(e,r);(!n||("get"in n?!e.__esModule:n.writable||n.configurable))&&(n={enumerable:!0,get:function(){return e[r]}}),Object.defineProperty(t,a,n)}:function(t,e,r,a){a===void 0&&(a=r),t[a]=e[r]}),wr=b&&b.__setModuleDefault||(Object.create?function(t,e){Object.defineProperty(t,"default",{enumerable:!0,value:e})}:function(t,e){t.default=e}),Te=b&&b.__importStar||function(t){if(t&&t.__esModule)return t;var e={};if(t!=null)for(var r in t)r!=="default"&&Object.prototype.hasOwnProperty.call(t,r)&&_r(e,t,r);return wr(e,t),e},X=b&&b.__importDefault||function(t){return t&&t.__esModule?t:{default:t}};Object.defineProperty(b,"__esModule",{value:!0});b.SignalRegistry=b.TempleException=b.TempleEmitter=b.TempleElement=b.TempleRegistry=b.TempleComponent=b.TempleDataMap=b.emitter=b.signal=b.innerHTML=b.innerText=b.children=b.classnames=b.classlist=b.props=b.env=b.data=b.component=void 0;var Ar=X(fe());b.TempleException=Ar.default;var Er=X(kt());b.TempleComponent=Er.default;var Lr=X(Ie());b.TempleRegistry=Lr.default;var Rr=X(tt());b.TempleElement=Rr.default;var Ft=Te(Me());b.emitter=Ft.default;Object.defineProperty(b,"TempleEmitter",{enumerable:!0,get:function(){return Ft.TempleEmitter}});var Fr=X(ee());b.component=Fr.default;var St=Te(Q());b.data=St.default;Object.defineProperty(b,"TempleDataMap",{enumerable:!0,get:function(){return St.TempleDataMap}});var Sr=X(Tt());b.env=Sr.default;var Dr=X(nt());b.props=Dr.default;var Dt=Te(At());b.classnames=Dt.default;Object.defineProperty(b,"classlist",{enumerable:!0,get:function(){return Dt.classlist}});var it=Te(Et());b.children=it.default;Object.defineProperty(b,"innerHTML",{enumerable:!0,get:function(){return it.innerHTML}});Object.defineProperty(b,"innerText",{enumerable:!0,get:function(){return it.innerText}});var Ct=Te(Rt());b.signal=Ct.default;Object.defineProperty(b,"SignalRegistry",{enumerable:!0,get:function(){return Ct.SignalRegistry}})});var I=P((Kr,Pt)=>{Pt.exports={...at()}});var B=P((Qr,jt)=>{jt.exports={...at()}});var lt=P((ln,We)=>{var Cr=typeof window<"u"?window:typeof WorkerGlobalScope<"u"&&self instanceof WorkerGlobalScope?self:{};var m=function(t){var e=/(?:^|\s)lang(?:uage)?-([\w-]+)(?=\s|$)/i,r=0,a={},n={manual:t.Prism&&t.Prism.manual,disableWorkerMessageHandler:t.Prism&&t.Prism.disableWorkerMessageHandler,util:{encode:function l(i){return i instanceof u?new u(i.type,l(i.content),i.alias):Array.isArray(i)?i.map(l):i.replace(/&/g,"&").replace(/"u")return null;if("currentScript"in document)return document.currentScript;try{throw new Error}catch(c){var l=(/at [^(\r\n]*\((.*):[^:]+:[^:]+\)$/i.exec(c.stack)||[])[1];if(l){var i=document.getElementsByTagName("script");for(var p in i)if(i[p].src==l)return i[p]}return null}},isActive:function(l,i,p){for(var c="no-"+i;l;){var o=l.classList;if(o.contains(i))return!0;if(o.contains(c))return!1;l=l.parentElement}return!!p}},languages:{plain:a,plaintext:a,text:a,txt:a,extend:function(l,i){var p=n.util.clone(n.languages[l]);for(var c in i)p[c]=i[c];return p},insertBefore:function(l,i,p,c){c=c||n.languages;var o=c[l],h={};for(var v in o)if(o.hasOwnProperty(v)){if(v==i)for(var g in p)p.hasOwnProperty(g)&&(h[g]=p[g]);p.hasOwnProperty(v)||(h[v]=o[v])}var F=c[l];return c[l]=h,n.languages.DFS(n.languages,function(D,q){q===F&&D!=l&&(this[D]=h)}),h},DFS:function l(i,p,c,o){o=o||{};var h=n.util.objId;for(var v in i)if(i.hasOwnProperty(v)){p.call(i,v,i[v],c||v);var g=i[v],F=n.util.type(g);F==="Object"&&!o[h(g)]?(o[h(g)]=!0,l(g,p,null,o)):F==="Array"&&!o[h(g)]&&(o[h(g)]=!0,l(g,p,v,o))}}},plugins:{},highlightAll:function(l,i){n.highlightAllUnder(document,l,i)},highlightAllUnder:function(l,i,p){var c={callback:p,container:l,selector:'code[class*="language-"], [class*="language-"] code, code[class*="lang-"], [class*="lang-"] code'};n.hooks.run("before-highlightall",c),c.elements=Array.prototype.slice.apply(c.container.querySelectorAll(c.selector)),n.hooks.run("before-all-elements-highlight",c);for(var o=0,h;h=c.elements[o++];)n.highlightElement(h,i===!0,c.callback)},highlightElement:function(l,i,p){var c=n.util.getLanguage(l),o=n.languages[c];n.util.setLanguage(l,c);var h=l.parentElement;h&&h.nodeName.toLowerCase()==="pre"&&n.util.setLanguage(h,c);var v=l.textContent,g={element:l,language:c,grammar:o,code:v};function F(q){g.highlightedCode=q,n.hooks.run("before-insert",g),g.element.innerHTML=g.highlightedCode,n.hooks.run("after-highlight",g),n.hooks.run("complete",g),p&&p.call(g.element)}if(n.hooks.run("before-sanity-check",g),h=g.element.parentElement,h&&h.nodeName.toLowerCase()==="pre"&&!h.hasAttribute("tabindex")&&h.setAttribute("tabindex","0"),!g.code){n.hooks.run("complete",g),p&&p.call(g.element);return}if(n.hooks.run("before-highlight",g),!g.grammar){F(n.util.encode(g.code));return}if(i&&t.Worker){var D=new Worker(n.filename);D.onmessage=function(q){F(q.data)},D.postMessage(JSON.stringify({language:g.language,code:g.code,immediateClose:!0}))}else F(n.highlight(g.code,g.grammar,g.language))},highlight:function(l,i,p){var c={code:l,grammar:i,language:p};if(n.hooks.run("before-tokenize",c),!c.grammar)throw new Error('The language "'+c.language+'" has no grammar.');return c.tokens=n.tokenize(c.code,c.grammar),n.hooks.run("after-tokenize",c),u.stringify(n.util.encode(c.tokens),c.language)},tokenize:function(l,i){var p=i.rest;if(p){for(var c in p)i[c]=p[c];delete i.rest}var o=new k;return x(o,o.head,l),d(l,o,i,o.head,0),_(o)},hooks:{all:{},add:function(l,i){var p=n.hooks.all;p[l]=p[l]||[],p[l].push(i)},run:function(l,i){var p=n.hooks.all[l];if(!(!p||!p.length))for(var c=0,o;o=p[c++];)o(i)}},Token:u};t.Prism=n;function u(l,i,p,c){this.type=l,this.content=i,this.alias=p,this.length=(c||"").length|0}u.stringify=function l(i,p){if(typeof i=="string")return i;if(Array.isArray(i)){var c="";return i.forEach(function(F){c+=l(F,p)}),c}var o={type:i.type,content:l(i.content,p),tag:"span",classes:["token",i.type],attributes:{},language:p},h=i.alias;h&&(Array.isArray(h)?Array.prototype.push.apply(o.classes,h):o.classes.push(h)),n.hooks.run("wrap",o);var v="";for(var g in o.attributes)v+=" "+g+'="'+(o.attributes[g]||"").replace(/"/g,""")+'"';return"<"+o.tag+' class="'+o.classes.join(" ")+'"'+v+">"+o.content+""};function y(l,i,p,c){l.lastIndex=i;var o=l.exec(p);if(o&&c&&o[1]){var h=o[1].length;o.index+=h,o[0]=o[0].slice(h)}return o}function d(l,i,p,c,o,h){for(var v in p)if(!(!p.hasOwnProperty(v)||!p[v])){var g=p[v];g=Array.isArray(g)?g:[g];for(var F=0;F=h.reach);H+=C.value.length,C=C.next){var K=C.value;if(i.length>l.length)return;if(!(K instanceof u)){var Re=1,$;if(ut){if($=y(mt,H,l,dt),!$||$.index>=l.length)break;var Fe=$.index,Ht=$.index+$[0].length,z=H;for(z+=C.value.length;Fe>=z;)C=C.next,z+=C.value.length;if(z-=C.value.length,H=z,C.value instanceof u)continue;for(var me=C;me!==i.tail&&(zh.reach&&(h.reach=Xe);var De=C.prev;Ze&&(De=x(i,De,Ze),H+=Ze.length),f(i,De,Re);var qt=new u(v,q?n.tokenize(Se,q):Se,$t,Se);if(C=x(i,De,qt),ft&&x(i,C,ft),Re>1){var Ye={cause:v+","+F,reach:Xe};d(l,i,p,C.prev,H,Ye),h&&Ye.reach>h.reach&&(h.reach=Ye.reach)}}}}}}function k(){var l={value:null,prev:null,next:null},i={value:null,prev:l,next:null};l.next=i,this.head=l,this.tail=i,this.length=0}function x(l,i,p){var c=i.next,o={value:p,prev:i,next:c};return i.next=o,c.prev=o,l.length++,o}function f(l,i,p){for(var c=i.next,o=0;o/,greedy:!0},prolog:{pattern:/<\?[\s\S]+?\?>/,greedy:!0},doctype:{pattern:/"'[\]]|"[^"]*"|'[^']*')+(?:\[(?:[^<"'\]]|"[^"]*"|'[^']*'|<(?!!--)|)*\]\s*)?>/i,greedy:!0,inside:{"internal-subset":{pattern:/(^[^\[]*\[)[\s\S]+(?=\]>$)/,lookbehind:!0,greedy:!0,inside:null},string:{pattern:/"[^"]*"|'[^']*'/,greedy:!0},punctuation:/^$|[[\]]/,"doctype-tag":/^DOCTYPE/i,name:/[^\s<>'"]+/}},cdata:{pattern://i,greedy:!0},tag:{pattern:/<\/?(?!\d)[^\s>\/=$<%]+(?:\s(?:\s*[^\s>\/=]+(?:\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))|(?=[\s/>])))+)?\s*\/?>/,greedy:!0,inside:{tag:{pattern:/^<\/?[^\s>\/]+/,inside:{punctuation:/^<\/?/,namespace:/^[^\s>\/:]+:/}},"special-attr":[],"attr-value":{pattern:/=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+)/,inside:{punctuation:[{pattern:/^=/,alias:"attr-equals"},{pattern:/^(\s*)["']|["']$/,lookbehind:!0}]}},punctuation:/\/?>/,"attr-name":{pattern:/[^\s>\/]+/,inside:{namespace:/^[^\s>\/:]+:/}}}},entity:[{pattern:/&[\da-z]{1,8};/i,alias:"named-entity"},/&#x?[\da-f]{1,8};/i]};m.languages.markup.tag.inside["attr-value"].inside.entity=m.languages.markup.entity;m.languages.markup.doctype.inside["internal-subset"].inside=m.languages.markup;m.hooks.add("wrap",function(t){t.type==="entity"&&(t.attributes.title=t.content.replace(/&/,"&"))});Object.defineProperty(m.languages.markup.tag,"addInlined",{value:function(e,r){var a={};a["language-"+r]={pattern:/(^$)/i,lookbehind:!0,inside:m.languages[r]},a.cdata=/^$/i;var n={"included-cdata":{pattern://i,inside:a}};n["language-"+r]={pattern:/[\s\S]+/,inside:m.languages[r]};var u={};u[e]={pattern:RegExp(/(<__[^>]*>)(?:))*\]\]>|(?!)/.source.replace(/__/g,function(){return e}),"i"),lookbehind:!0,greedy:!0,inside:n},m.languages.insertBefore("markup","cdata",u)}});Object.defineProperty(m.languages.markup.tag,"addAttribute",{value:function(t,e){m.languages.markup.tag.inside["special-attr"].push({pattern:RegExp(/(^|["'\s])/.source+"(?:"+t+")"+/\s*=\s*(?:"[^"]*"|'[^']*'|[^\s'">=]+(?=[\s>]))/.source,"i"),lookbehind:!0,inside:{"attr-name":/^[^\s=]+/,"attr-value":{pattern:/=[\s\S]+/,inside:{value:{pattern:/(^=\s*(["']|(?!["'])))\S[\s\S]*(?=\2$)/,lookbehind:!0,alias:[e,"language-"+e],inside:m.languages[e]},punctuation:[{pattern:/^=/,alias:"attr-equals"},/"|'/]}}}})}});m.languages.html=m.languages.markup;m.languages.mathml=m.languages.markup;m.languages.svg=m.languages.markup;m.languages.xml=m.languages.extend("markup",{});m.languages.ssml=m.languages.xml;m.languages.atom=m.languages.xml;m.languages.rss=m.languages.xml;(function(t){var e=/(?:"(?:\\(?:\r\n|[\s\S])|[^"\\\r\n])*"|'(?:\\(?:\r\n|[\s\S])|[^'\\\r\n])*')/;t.languages.css={comment:/\/\*[\s\S]*?\*\//,atrule:{pattern:RegExp("@[\\w-](?:"+/[^;{\s"']|\s+(?!\s)/.source+"|"+e.source+")*?"+/(?:;|(?=\s*\{))/.source),inside:{rule:/^@[\w-]+/,"selector-function-argument":{pattern:/(\bselector\s*\(\s*(?![\s)]))(?:[^()\s]|\s+(?![\s)])|\((?:[^()]|\([^()]*\))*\))+(?=\s*\))/,lookbehind:!0,alias:"selector"},keyword:{pattern:/(^|[^\w-])(?:and|not|only|or)(?![\w-])/,lookbehind:!0}}},url:{pattern:RegExp("\\burl\\((?:"+e.source+"|"+/(?:[^\\\r\n()"']|\\[\s\S])*/.source+")\\)","i"),greedy:!0,inside:{function:/^url/i,punctuation:/^\(|\)$/,string:{pattern:RegExp("^"+e.source+"$"),alias:"url"}}},selector:{pattern:RegExp(`(^|[{}\\s])[^{}\\s](?:[^{};"'\\s]|\\s+(?![\\s{])|`+e.source+")*(?=\\s*\\{)"),lookbehind:!0},string:{pattern:e,greedy:!0},property:{pattern:/(^|[^-\w\xA0-\uFFFF])(?!\s)[-_a-z\xA0-\uFFFF](?:(?!\s)[-\w\xA0-\uFFFF])*(?=\s*:)/i,lookbehind:!0},important:/!important\b/i,function:{pattern:/(^|[^-a-z0-9])[-a-z0-9]+(?=\()/i,lookbehind:!0},punctuation:/[(){};:,]/},t.languages.css.atrule.inside.rest=t.languages.css;var r=t.languages.markup;r&&(r.tag.addInlined("style","css"),r.tag.addAttribute("style","css"))})(m);m.languages.clike={comment:[{pattern:/(^|[^\\])\/\*[\s\S]*?(?:\*\/|$)/,lookbehind:!0,greedy:!0},{pattern:/(^|[^\\:])\/\/.*/,lookbehind:!0,greedy:!0}],string:{pattern:/(["'])(?:\\(?:\r\n|[\s\S])|(?!\1)[^\\\r\n])*\1/,greedy:!0},"class-name":{pattern:/(\b(?:class|extends|implements|instanceof|interface|new|trait)\s+|\bcatch\s+\()[\w.\\]+/i,lookbehind:!0,inside:{punctuation:/[.\\]/}},keyword:/\b(?:break|catch|continue|do|else|finally|for|function|if|in|instanceof|new|null|return|throw|try|while)\b/,boolean:/\b(?:false|true)\b/,function:/\b\w+(?=\()/,number:/\b0x[\da-f]+\b|(?:\b\d+(?:\.\d*)?|\B\.\d+)(?:e[+-]?\d+)?/i,operator:/[<>]=?|[!=]=?=?|--?|\+\+?|&&?|\|\|?|[?*/~^%]/,punctuation:/[{}[\];(),.:]/};m.languages.javascript=m.languages.extend("clike",{"class-name":[m.languages.clike["class-name"],{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$A-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\.(?:constructor|prototype))/,lookbehind:!0}],keyword:[{pattern:/((?:^|\})\s*)catch\b/,lookbehind:!0},{pattern:/(^|[^.]|\.\.\.\s*)\b(?:as|assert(?=\s*\{)|async(?=\s*(?:function\b|\(|[$\w\xA0-\uFFFF]|$))|await|break|case|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally(?=\s*(?:\{|$))|for|from(?=\s*(?:['"]|$))|function|(?:get|set)(?=\s*(?:[#\[$\w\xA0-\uFFFF]|$))|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)\b/,lookbehind:!0}],function:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*(?:\.\s*(?:apply|bind|call)\s*)?\()/,number:{pattern:RegExp(/(^|[^\w$])/.source+"(?:"+(/NaN|Infinity/.source+"|"+/0[bB][01]+(?:_[01]+)*n?/.source+"|"+/0[oO][0-7]+(?:_[0-7]+)*n?/.source+"|"+/0[xX][\dA-Fa-f]+(?:_[\dA-Fa-f]+)*n?/.source+"|"+/\d+(?:_\d+)*n/.source+"|"+/(?:\d+(?:_\d+)*(?:\.(?:\d+(?:_\d+)*)?)?|\.\d+(?:_\d+)*)(?:[Ee][+-]?\d+(?:_\d+)*)?/.source)+")"+/(?![\w$])/.source),lookbehind:!0},operator:/--|\+\+|\*\*=?|=>|&&=?|\|\|=?|[!=]==|<<=?|>>>?=?|[-+*/%&|^!=<>]=?|\.{3}|\?\?=?|\?\.?|[~:]/});m.languages.javascript["class-name"][0].pattern=/(\b(?:class|extends|implements|instanceof|interface|new)\s+)[\w.\\]+/;m.languages.insertBefore("javascript","keyword",{regex:{pattern:RegExp(/((?:^|[^$\w\xA0-\uFFFF."'\])\s]|\b(?:return|yield))\s*)/.source+/\//.source+"(?:"+/(?:\[(?:[^\]\\\r\n]|\\.)*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}/.source+"|"+/(?:\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.|\[(?:[^[\]\\\r\n]|\\.)*\])*\])*\]|\\.|[^/\\\[\r\n])+\/[dgimyus]{0,7}v[dgimyus]{0,7}/.source+")"+/(?=(?:\s|\/\*(?:[^*]|\*(?!\/))*\*\/)*(?:$|[\r\n,.;:})\]]|\/\/))/.source),lookbehind:!0,greedy:!0,inside:{"regex-source":{pattern:/^(\/)[\s\S]+(?=\/[a-z]*$)/,lookbehind:!0,alias:"language-regex",inside:m.languages.regex},"regex-delimiter":/^\/|\/$/,"regex-flags":/^[a-z]+$/}},"function-variable":{pattern:/#?(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*[=:]\s*(?:async\s*)?(?:\bfunction\b|(?:\((?:[^()]|\([^()]*\))*\)|(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)\s*=>))/,alias:"function"},parameter:[{pattern:/(function(?:\s+(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*)?\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\))/,lookbehind:!0,inside:m.languages.javascript},{pattern:/(^|[^$\w\xA0-\uFFFF])(?!\s)[_$a-z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*=>)/i,lookbehind:!0,inside:m.languages.javascript},{pattern:/(\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*=>)/,lookbehind:!0,inside:m.languages.javascript},{pattern:/((?:\b|\s|^)(?!(?:as|async|await|break|case|catch|class|const|continue|debugger|default|delete|do|else|enum|export|extends|finally|for|from|function|get|if|implements|import|in|instanceof|interface|let|new|null|of|package|private|protected|public|return|set|static|super|switch|this|throw|try|typeof|undefined|var|void|while|with|yield)(?![$\w\xA0-\uFFFF]))(?:(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*\s*)\(\s*|\]\s*\(\s*)(?!\s)(?:[^()\s]|\s+(?![\s)])|\([^()]*\))+(?=\s*\)\s*\{)/,lookbehind:!0,inside:m.languages.javascript}],constant:/\b[A-Z](?:[A-Z_]|\dx?)*\b/});m.languages.insertBefore("javascript","string",{hashbang:{pattern:/^#!.*/,greedy:!0,alias:"comment"},"template-string":{pattern:/`(?:\\[\s\S]|\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}|(?!\$\{)[^\\`])*`/,greedy:!0,inside:{"template-punctuation":{pattern:/^`|`$/,alias:"string"},interpolation:{pattern:/((?:^|[^\\])(?:\\{2})*)\$\{(?:[^{}]|\{(?:[^{}]|\{[^}]*\})*\})+\}/,lookbehind:!0,inside:{"interpolation-punctuation":{pattern:/^\$\{|\}$/,alias:"punctuation"},rest:m.languages.javascript}},string:/[\s\S]+/}},"string-property":{pattern:/((?:^|[,{])[ \t]*)(["'])(?:\\(?:\r\n|[\s\S])|(?!\2)[^\\\r\n])*\2(?=\s*:)/m,lookbehind:!0,greedy:!0,alias:"property"}});m.languages.insertBefore("javascript","operator",{"literal-property":{pattern:/((?:^|[,{])[ \t]*)(?!\s)[_$a-zA-Z\xA0-\uFFFF](?:(?!\s)[$\w\xA0-\uFFFF])*(?=\s*:)/m,lookbehind:!0,alias:"property"}});m.languages.markup&&(m.languages.markup.tag.addInlined("script","javascript"),m.languages.markup.tag.addAttribute(/on(?:abort|blur|change|click|composition(?:end|start|update)|dblclick|error|focus(?:in|out)?|key(?:down|up)|load|mouse(?:down|enter|leave|move|out|over|up)|reset|resize|scroll|select|slotchange|submit|unload|wheel)/.source,"javascript"));m.languages.js=m.languages.javascript;(function(){if(typeof m>"u"||typeof document>"u")return;Element.prototype.matches||(Element.prototype.matches=Element.prototype.msMatchesSelector||Element.prototype.webkitMatchesSelector);var t="Loading\u2026",e=function(E,T){return"\u2716 Error "+E+" while fetching file: "+T},r="\u2716 Error: File does not exist or is empty",a={js:"javascript",py:"python",rb:"ruby",ps1:"powershell",psm1:"powershell",sh:"bash",bat:"batch",h:"c",tex:"latex"},n="data-src-status",u="loading",y="loaded",d="failed",k="pre[data-src]:not(["+n+'="'+y+'"]):not(['+n+'="'+u+'"])';function x(E,T,L){var l=new XMLHttpRequest;l.open("GET",E,!0),l.onreadystatechange=function(){l.readyState==4&&(l.status<400&&l.responseText?T(l.responseText):l.status>=400?L(e(l.status,l.statusText)):L(r))},l.send(null)}function f(E){var T=/^\s*(\d+)\s*(?:(,)\s*(?:(\d+)\s*)?)?$/.exec(E||"");if(T){var L=Number(T[1]),l=T[2],i=T[3];return l?i?[L,Number(i)]:[L,void 0]:[L,L]}}m.hooks.add("before-highlightall",function(E){E.selector+=", "+k}),m.hooks.add("before-sanity-check",function(E){var T=E.element;if(T.matches(k)){E.code="",T.setAttribute(n,u);var L=T.appendChild(document.createElement("CODE"));L.textContent=t;var l=T.getAttribute("data-src"),i=E.language;if(i==="none"){var p=(/\.(\w+)$/.exec(l)||[,"none"])[1];i=a[p]||p}m.util.setLanguage(L,i),m.util.setLanguage(T,i);var c=m.plugins.autoloader;c&&c.loadLanguages(i),x(l,function(o){T.setAttribute(n,y);var h=f(T.getAttribute("data-range"));if(h){var v=o.split(/\r\n?|\n/g),g=h[0],F=h[1]==null?v.length:h[1];g<0&&(g+=v.length),g=Math.max(0,Math.min(g-1,v.length)),F<0&&(F+=v.length),F=Math.max(0,Math.min(F,v.length)),o=v.slice(g,F).join(`
+`),T.hasAttribute("data-start")||T.setAttribute("data-start",String(g+1))}L.textContent=o,m.highlightElement(L)},function(o){T.setAttribute(n,d),L.textContent=o})}}),m.plugins.fileHighlight={highlight:function(T){for(var L=(T||document).querySelectorAll(k),l=0,i;i=L[l++];)m.highlightElement(i)}};var _=!1;m.fileHighlight=function(){_||(console.warn("Prism.fileHighlight is deprecated. Use `Prism.plugins.fileHighlight.highlight` instead."),_=!0),m.plugins.fileHighlight.highlight.apply(this,arguments)}})()});var Nr={};Zt(Nr,{BUILD_ID:()=>Ir,TempleComponent:()=>S.TempleComponent,TempleElement:()=>S.TempleElement,TempleEmitter:()=>S.TempleEmitter,TempleException:()=>S.TempleException,TempleRegistry:()=>S.TempleRegistry,children:()=>S.children,components:()=>Mr,data:()=>S.data,emitter:()=>S.emitter,props:()=>S.props,signal:()=>S.signal});var N=R(I());var Mt=R(I()),O=R(B()),ne=class extends Mt.TempleComponent{static component=["layout","Layout_9f3ab204ce271feaf6f7"];styles(){return""}template(){(0,O.classlist)().add("relative","w-full","vh","scroll-hidden");let e=(0,O.children)(),r=e.find(f=>f.nodeName.endsWith("PANEL-MAIN")),a=e.find(f=>f.nodeName.endsWith("PANEL-HEAD")),n=e.find(f=>f.nodeName.endsWith("PANEL-FOOT")),u=e.find(f=>f.nodeName.endsWith("PANEL-LEFT")),y=e.find(f=>f.nodeName.endsWith("PANEL-RIGHT")),d={head:!!a,foot:!!n,left:!!u,right:!!y},k=new Set,x={left:!1,right:!1,change:f=>k.add(f)};return r&&O.TempleRegistry.get(r).setAttribute("show",x).setAttribute("layout",d),a&&O.TempleRegistry.get(a).setAttribute("show",x).setAttribute("layout",d),n&&O.TempleRegistry.get(n).setAttribute("show",x).setAttribute("layout",d),u&&O.TempleRegistry.get(u).setAttribute("show",x).setAttribute("layout",d),y&&O.TempleRegistry.get(y).setAttribute("show",x).setAttribute("layout",d),this.toggle=f=>{x[f]=!x[f],k.forEach(_=>_())},()=>[O.TempleRegistry.createText(`
+`,!1),...this._toNodeList(e)]}};var _e=R(I()),He=R(B()),se=class extends _e.TempleComponent{static component=["head","Head_2bf4dff19bc88ba4138b"];styles(){return""}template(){let{layout:e,show:r}=this.element.attributes,a=(0,He.classlist)(),n=u=>{this.classList.add("absolute","top-0","right-0","h-60","transition-500"),e?.left?(this.classList.remove("left-0"),this.classList.add("left-226")):this.classList.add("left-0"),r.left?(this.classList.remove("md-left-0"),this.classList.add("md-left-226")):(this.classList.remove("md-left-226"),this.classList.add("md-left-0"))};return r.change(n),n(),()=>[_e.TempleRegistry.createText(`
+`,!1),_e.TempleRegistry.createElement("header",{class:"block w-full h-full relative"},[...this._toNodeList((0,He.children)())]).element]}};var we=R(I()),qe=R(B()),ie=class extends we.TempleComponent{static component=["left","Left_f4ab589e043eee17d229"];styles(){return""}template(){let{layout:e,show:r}=this.element.attributes,a=(0,qe.classlist)(),n=u=>{this.classList.add("w-226","absolute","bottom-0","left-0","top-0","transition-500"),r.left?(this.classList.remove("md-left--226"),this.classList.add("md-left-0")):this.classList.add("md-left--226")};return r.change(n),n(),()=>[we.TempleRegistry.createText(`
+`,!1),we.TempleRegistry.createElement("aside",{class:"block w-full h-full relative"},[...this._toNodeList((0,qe.children)())]).element]}};var Ae=R(I()),ze=R(B()),ae=class extends Ae.TempleComponent{static component=["main","Main_847772763f4518728ede"];styles(){return""}template(){let{layout:e,show:r}=this.element.attributes,a=(0,ze.classlist)(),n=u=>{this.classList.add("absolute","transition-500"),e?.head?(this.classList.remove("top-0"),this.classList.add("top-60")):this.classList.add("top-0"),e?.foot?(this.classList.remove("bottom-0"),this.classList.add("bottom-60")):this.classList.add("bottom-0"),e?.left?(this.classList.remove("left-0"),this.classList.add("left-226")):this.classList.add("left-0"),e?.right?(this.classList.remove("right-0"),this.classList.add("right-200")):this.classList.add("right-0"),r.left?(this.classList.remove("md-left-0"),this.classList.add("md-left-226")):(this.classList.remove("md-left-226"),this.classList.add("md-left-0")),r.right?(this.classList.remove("md-right-0"),this.classList.add("md-right-200")):(this.classList.remove("md-right-200"),this.classList.add("md-right-0"))};return r.change(n),n(),()=>[Ae.TempleRegistry.createText(`
+`,!1),Ae.TempleRegistry.createElement("main",{class:"block w-full h-full relative"},[...this._toNodeList((0,ze.children)())]).element]}};var Je=R(I()),oe=R(B()),le=class extends Je.TempleComponent{static component=["alert","Alert_f0fe98801b4b833c4233"];styles(){return""}template(){let{curved:e,rounded:r,pill:a,info:n,warning:u,success:y,error:d,muted:k,primary:x,color:f,secondary:_,outline:E,transparent:T,solid:L,style:l,class:i,...p}=(0,oe.props)(),c=(0,oe.component)(),o=document.createElement("div");(0,oe.children)().forEach(v=>o.appendChild(v)),c.classList.add("block"),o.classList.add("block","p-16"),e?o.classList.add("curved"):r?o.classList.add("rounded"):a&&o.classList.add("pill");let h=E?"outline":T?"transparent":"solid";return h==="outline"||h==="transparent"?(o.classList.add("bd-solid","bd-thin"),h==="outline"&&o.classList.add("bg-white"),f?(o.style.color=f,o.style.borderColor=f):n?o.classList.add("bd-info","tx-info"):u?o.classList.add("bd-warning","tx-warning"):y?o.classList.add("bd-success","tx-success"):d?o.classList.add("bd-error","tx-error"):k?o.classList.add("bd-muted","tx-muted"):x?o.classList.add("bd-primary","tx-primary"):_&&o.classList.add("bd-secondary","tx-secondary")):(o.classList.add("tx-white"),f?o.style.backgroundColor=f:n?o.classList.add("bg-info"):u?o.classList.add("bg-warning"):y?o.classList.add("bg-success"):d?o.classList.add("bg-error"):k?o.classList.add("bg-muted"):x?o.classList.add("bg-primary"):_&&o.classList.add("bg-secondary")),()=>[Je.TempleRegistry.createText(`
+`,!1),...this._toNodeList([o])]}};var Ee=R(I()),Ge=R(B()),pe=class extends Ee.TempleComponent{static component=["docs","Docs_40562a7bb56d70d971df"];styles(){return""}template(){return(0,Ge.classlist)().add("block","w-full","h-full","scroll-y-auto","scroll-x-hidden"),()=>[Ee.TempleRegistry.createText(`
+`,!1),Ee.TempleRegistry.createElement("article",{class:"block p-10 tx-t-1"},[...this._toNodeList((0,Ge.children)())]).element]}};var s=R(I());var w=R(I()),ot=R(lt()),It=R(B()),Y=class extends w.TempleComponent{static component=["code","Code_6f36bc13bb6a166c7abc"];styles(){return`:host {
     display: block;
     font-size: 14px;
     line-height: 20px;
   }
   :host([inline]) {
-    display: inline;
+    display: inline !important;
   }
   :host([inline]),
   :host([inline]) > pre,
   :host([inline]) > pre > code {
-    display: inline;
+    display: inline !important;
   }
   .snippet {
     background-color: #000000;
     color: #ABB2BF;
+    height: 100%;
     margin: 0;
+    overflow: auto;
     padding: 0;
   }
 
@@ -73,23 +81,30 @@ var TempleAPI=(()=>{var wt=Object.create;var ye=Object.defineProperty;var At=Obj
 
   .terminal {
     background-color: #000000;
+    font-family: 'Courier New', Courier, monospace;
     font-size: 15px;
+    height: 100%;
+    overflow: auto;
     padding: 10px;
   }
   .terminal span {
     color: #00FF00;
-  }`}template(){let e=this.props,{lang:r="markup",numbers:l=!1,inline:i=!1,trim:g=!1,ltrim:h=!1,rtrim:d=!1,detab:x=0}=e,k=(0,xt.children)(),T=k[0]?.textContent||"";x&&(T=T.replace(new RegExp(`\\n {${x}}`,"g"),`
-`)),g?T=T.trim():h?T=T.replace(/^\s+/,""):d&&(T=T.replace(/\s+$/,""));let E=_=>{if(!T)return;let v=qe.default.highlight(T,qe.default.languages[r],r);if(_.detail.target.innerHTML=v,l){let w=v.match(/\n(?!$)/g),n=w?w.length+1:1,s=new Array(n+1).join(""),o=document.createElement("span");o.setAttribute("aria-hidden","true"),o.className="line-numbers-rows",o.innerHTML=s,_.detail.target.appendChild(o)}};return()=>[A.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism.min.css"}).element,A.TempleRegistry.createText(`
-`,!1),A.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism-tomorrow.min.css"}).element,A.TempleRegistry.createText(`
-`,!1),...r==="bash"?[A.TempleRegistry.createText(`
-  `,!1),A.TempleRegistry.createElement("div",{class:"terminal"},[A.TempleRegistry.createElement("span",{},[A.TempleRegistry.createText("$",!1)]).element,A.TempleRegistry.createText(" ",!1),...this._toNodeList(k)]).element,A.TempleRegistry.createText(`
-`,!1)]:T?[,A.TempleRegistry.createText(`
-  `,!1),...l?[A.TempleRegistry.createText(`
-    `,!1),A.TempleRegistry.createElement("pre",{class:"snippet line-numbers"},[A.TempleRegistry.createElement("code",{mount:E},[]).element]).element,A.TempleRegistry.createText(`
-  `,!1)]:[,A.TempleRegistry.createText(`
-    `,!1),A.TempleRegistry.createElement("pre",{class:"snippet pad"},[A.TempleRegistry.createElement("code",{mount:E},[]).element]).element,A.TempleRegistry.createText(`
-  `,!1)],A.TempleRegistry.createText(`
-`,!1)]:[]]}};var a=M(B());var ue=M(ce());var de={Asset:{type:{kind:"property",list:!1,type:["text/html","text/javascript","text/css","text/plain"],description:"The MIME type of the build file asset"},content:{kind:"property",list:!1,type:"string",description:"The source code of the build file asset."}},Path:{path:{kind:"property",list:!1,type:"string",description:"The file path",example:"'/path/to/file'"},type:{kind:"property",list:!1,type:"string",description:"The type of path.",example:"'file'"}},Config:{brand:{kind:"property",list:!1,type:"string",description:"The brand prefixed before the component tag name.",example:"'temple'"},cwd:{kind:"property",list:!1,type:"string",description:"The project's current working directory (cwd).",example:"'/path/to/project'"},fs:{kind:"property",list:!1,type:"FileSystem",description:"The file system being used to read/write files.",example:`import fs from 'fs';
+  }`}template(){let e=this.props,{lang:r="markup",numbers:a=!1,inline:n=!1,trim:u=!1,ltrim:y=!1,rtrim:d=!1,detab:k=0}=e,x=(0,It.children)(),f=x[0]?.textContent||"";k&&(f=f.replace(new RegExp(`\\n {${k}}`,"g"),`
+`)),u?f=f.trim():y?f=f.replace(/^\s+/,""):d&&(f=f.replace(/\s+$/,""));let _=E=>{if(!f)return;let T=ot.default.highlight(f,ot.default.languages[r],r);if(E.detail.target.innerHTML=T,a){let L=T.match(/\n(?!$)/g),l=L?L.length+1:1,i=new Array(l+1).join(""),p=document.createElement("span");p.setAttribute("aria-hidden","true"),p.className="line-numbers-rows",p.innerHTML=i,E.detail.target.appendChild(p)}};return()=>[w.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism.min.css"}).element,w.TempleRegistry.createText(`
+`,!1),w.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism-tomorrow.min.css"}).element,w.TempleRegistry.createText(`
+`,!1),...r==="bash"?[w.TempleRegistry.createText(`
+  `,!1),w.TempleRegistry.createElement("div",{class:"terminal"},[w.TempleRegistry.createElement("span",{},[w.TempleRegistry.createText("$",!1)]).element,w.TempleRegistry.createText(" ",!1),...this._toNodeList(x)]).element,w.TempleRegistry.createText(`
+`,!1)]:f?[,w.TempleRegistry.createText(`
+  `,!1),...a?[w.TempleRegistry.createText(`
+    `,!1),w.TempleRegistry.createElement("pre",{class:"snippet line-numbers"},[w.TempleRegistry.createElement("code",{mount:_},[]).element]).element,w.TempleRegistry.createText(`
+  `,!1)]:[,w.TempleRegistry.createText(`
+    `,!1),w.TempleRegistry.createElement("pre",{class:"snippet pad"},[w.TempleRegistry.createElement("code",{mount:_},[]).element]).element,w.TempleRegistry.createText(`
+  `,!1)],w.TempleRegistry.createText(`
+`,!1)]:[,w.TempleRegistry.createText(`
+  `,!1),w.TempleRegistry.createElement("span",{},[w.TempleRegistry.createText("????",!1)]).element,w.TempleRegistry.createText(`
+`,!1)],w.TempleRegistry.createText(`
+
+`,!1)]}};var V=R(B());var Le={Asset:{type:{kind:"property",list:!1,type:["text/html","text/javascript","text/css","text/plain"],description:"The MIME type of the build file asset"},content:{kind:"property",list:!1,type:"string",description:"The source code of the build file asset."}},Path:{path:{kind:"property",list:!1,type:"string",description:"The file path",example:"'/path/to/file'"},type:{kind:"property",list:!1,type:"string",description:"The type of path.",example:"'file'"}},Config:{brand:{kind:"property",list:!1,type:"string",description:"The brand prefixed before the component tag name.",example:"'temple'"},cwd:{kind:"property",list:!1,type:"string",description:"The project's current working directory (cwd).",example:"'/path/to/project'"},fs:{kind:"property",list:!1,type:"FileSystem",description:"The file system being used to read/write files.",example:`import fs from 'fs';
 
 fs`},emitter:{kind:"property",list:!1,type:"EventEmitter",description:"The NodeJS EventEmitter instance being used.",example:`import EventEmitter from 'events';
 
@@ -171,342 +186,207 @@ const compiler = temple({ emitter });'`},"minify?":{kind:"property",list:!1,type
   { href: '/' }
 ); ]`},TempleEmitter:{kind:"property",list:!1,type:"TempleEmitter",description:"The Temple emitter class used to create custom events.",example:"new TempleAPI.TempleEmitter();"},TempleException:{kind:"property",list:!1,type:"TempleException",description:"The Temple exception class used to create custom errors.",example:"throw TempleAPI.TempleException.for('error message');"},TempleRegistry:{kind:"property",list:!1,type:"TempleRegistry",description:"The Temple registry class used to store custom elements.",example:"new TempleAPI.TempleRegistry.createElement('a', { href: '/' });"},children:{kind:"function",args:[{kind:"property",list:!1,name:"component",type:"TempleComponent"}],returns:{kind:"property",list:!0,type:"Node"},description:"Returns an array of child nodes.",example:"TempleAPI.children(component); //--> [ Element, Text, Element, ... ]"},components:{kind:"property",list:!1,type:"Record",description:"Returns an object of Temple components classes used in the DOM.",example:"new TempleAPI.components['fancy-button']; //--> TempleComponent"},data:{kind:"property",list:!1,type:"TempleDataMap",description:"The Temple data map used to bring server side data to the client.",example:"TempleAPI.data.get('props');"},emitter:{kind:"property",list:!1,type:"TempleEmitter",description:"The Temple emitter class used to create custom events.",example:"TempleAPI.emitter.on('click', () => {});"},props:{kind:"function",args:[{kind:"property",list:!1,name:"component",type:"TempleComponent"}],returns:{kind:"property",list:!0,type:"Hash"},description:"Returns an object of component attributes",example:"TempleAPI.props(component); //--> { foo: 'bar', count: 4 }"},signal:{kind:"function",args:[{kind:"property",list:!1,name:"component",type:"TempleComponent"}],returns:{kind:"property",list:!1,type:"Signal"},description:"Returns a signal object used to re-render components whenever its value changes",example:"const count = TempleAPI.signal(1, component)"}},"Render Methods":{asset:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"assetFile",type:"string"}],returns:{kind:"property",list:!1,type:"Asset"},description:"Returns a compiled build asset, given an asset file name.",example:"await compiler.asset('abc123.css'); //--> { type: 'text/css', content: '...' }"},client:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"sourceFile",type:"string"}],returns:{kind:"property",list:!1,type:"string"},description:"Returns a compiled client script, given the the template source file.",example:"await compiler.client('./docs/api.dtml'); //client script"},markup:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"sourceFile",type:"string"}],returns:{kind:"property",list:!1,type:"string"},description:"Returns a compiled markup, given the the template source file.",example:"await compiler.markup('./docs/api.dtml'); //--> ..."},render:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"sourceFile",type:"string"},{kind:"property",list:!1,name:"props",type:"Hash"}],returns:{kind:"property",list:!1,type:"string"},description:"Returns the final HTML markup, given the the template source file.",example:`await compiler.render('./docs/api.dtml', {
   title: 'API Documentation'
-});`},server:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"sourceFile",type:"string"}],returns:{kind:"property",list:!1,type:"string"},description:"Returns compiled server code, given the the template source file.",example:"await compiler.server('./docs/api.dtml'); // server script"},styles:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"sourceFile",type:"string"}],returns:{kind:"property",list:!1,type:"string"},description:"Returns compiled css styles, given the the template source file.",example:"await compiler.styles('./docs/api.dtml'); //css styles"}}};var X=class extends a.TempleComponent{static component=["ui","Ui_dcdb1ec28ab9a6dac63a"];styles(){return`:host {
-    border-radius: 5px;
-    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
+});`},server:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"sourceFile",type:"string"}],returns:{kind:"property",list:!1,type:"string"},description:"Returns compiled server code, given the the template source file.",example:"await compiler.server('./docs/api.dtml'); // server script"},styles:{kind:"function",async:!0,args:[{kind:"property",list:!1,name:"sourceFile",type:"string"}],returns:{kind:"property",list:!1,type:"string"},description:"Returns compiled css styles, given the the template source file.",example:"await compiler.styles('./docs/api.dtml'); //css styles"}},DeveloperOptions:{"cwd?":{kind:"property",list:!1,type:"string",description:"The current working directory",example:"const { refresh, router } = dev({ cwd: process.cwd() })"},"emitter?":{kind:"property",list:!1,type:"EventEmitter",description:"The NodeJS EventEmitter instance being used.",example:`import emitter from 'events';
+
+const { refresh, router } = dev({ emitter });'`},"include?":{kind:"property",list:!0,type:"string",description:"An array of extension names to watch for",example:"const { refresh, router } = dev({ include: [ '.js', '.ts', '.tml', '.dtml' ] });'"},"ignore?":{kind:"property",list:!0,type:"(string|RegExp)",description:"An array of extension names to ignore",example:"const { refresh, router } = dev({ ignore: [ '*.test.*' ] });'"},"route?":{kind:"property",list:!1,type:"string",description:"The route path to use for the client watcher",example:"const { refresh, router } = dev({ route: '/__temple_dev__' })"},"tsconfig?":{kind:"property",list:!1,type:"string",description:"The path to the tsconfig.json file",example:"const { refresh, router } = dev({ tsconfig: '/path/to/tsconfig.json' })"},"extname?":{kind:"property",list:!1,type:"string",description:"the component file extension",example:"const { refresh, router } = dev({ extname: '.tml' })"}},RefreshServer:{cwd:{kind:"property",list:!1,type:"string",description:"The current working directory",example:"refresh.cwd"},emitter:{kind:"property",list:!1,type:"EventEmitter",description:"The NodeJS EventEmitter instance being used.",example:`refresh.emitter.on('render', e => {
+  console.log(e.params);
+});`},sync:{kind:"function",args:[{kind:"property",name:"builder",list:!1,type:"DocumentBuilder"}],returns:{kind:"property",list:!1,type:"void"},description:"Registers a document builder to a client watcher list",example:`refresh.emitter.on('render', e => {
+  console.log(e.params);
+});`},close:{kind:"function",args:[],returns:{kind:"property",list:!1,type:"RefreshServer"},description:"Closes the server and stops the watchers.",example:"refresh.close();"},refresh:{kind:"function",args:[{kind:"property",list:!1,name:"filePath",type:"string"}],returns:{kind:"property",list:!1,type:"Promise"},description:"Whenever a file is changed this will be called to instruct each client watcher how to update their document.",example:"await refresh.refresh('/some/file.tml');"},wait:{kind:"function",args:[{kind:"property",list:!1,name:"req",type:"Request"},{kind:"property",list:!1,name:"res",type:"Response"}],returns:{kind:"property",list:!1,type:"RefreshServer"},description:"Opens a connection to the server via SSE and waits for changes.",example:"refresh.wait(req, res);"},watch:{kind:"function",args:[],returns:{kind:"property",list:!1,type:"RefreshServer"},description:"Starts the server that watches for file changes.",example:"refresh.watch();"}},"Developer Tools":{refresh:{kind:"property",list:!1,type:"RefreshServer",description:"The refresh server instance used to update clients.",example:`const { refresh } = dev();
+refresh.sync(builder);`},router:{kind:"property",list:!1,type:"Function",description:"HTTP middleware to handle developer tool routes like '/dev.js' and '/__temple_dev__'.",example:`const { router } = dev();
+app.use(router);`}},"Express Developer Tools":{refresh:{kind:"property",list:!1,type:"RefreshServer",description:"The refresh server instance used to update clients.",example:`const { refresh } = dev();
+refresh.sync(builder);`},router:{kind:"property",list:!1,type:"Function",description:"Express middleware to handle developer tool routes like '/dev.js' and '/__temple_dev__'.",example:`const { router } = dev();
+app.use(router);`},view:{kind:"property",list:!1,type:"Function",description:"Middleware used to setup an express view engine.",example:`const { view } = dev();
+app.engine('dtml', view(compiler));`}}};var ce=class extends s.TempleComponent{static component=["ui","Ui_0ec6f6ca4b362d125365"];styles(){return""}template(){(0,V.classlist)().add("block","my-40","scroll-hidden","curved","shadow-0-0-10-0-0-0-5");let{start:e="TempleCompiler"}=(0,V.props)(),r=(0,V.signal)([e]),a=(0,V.signal)(e),n=y=>{let d=y.target.getAttribute("data-type");r.value=[...r.value,d],a.value=d},u=()=>{r.value=r.value.slice(0,r.value.length-1),a.value=r.value[r.value.length-1]};return()=>[s.TempleRegistry.createText(`
+`,!1),s.TempleRegistry.createElement("h3",{class:"tx-secondary bg-t-2 tx-16 m-0 p-10"},[s.TempleRegistry.createText(`
+  `,!1),...r.value.length>1?[s.TempleRegistry.createText(`
+    `,!1),s.TempleRegistry.createElement("a",{class:"tx-t-1 cursor-pointer",click:u},[s.TempleRegistry.createText(`
+      `,!1),s.TempleRegistry.createElement("i",{class:"fas fa-arrow-left"},[]).element,s.TempleRegistry.createText(`
+    `,!1)]).element,s.TempleRegistry.createText(`
+  `,!1)]:[],s.TempleRegistry.createText(`
+  API: `,!1),...this._toNodeList(a.value),s.TempleRegistry.createText(`
+`,!1)]).element,s.TempleRegistry.createText(`
+`,!1),s.TempleRegistry.createElement("div",{class:"bg-t-0 p-10"},[s.TempleRegistry.createText(`
+  `,!1),s.TempleRegistry.createElement("div",{class:"relative mb-20 scroll-auto"},[s.TempleRegistry.createText(`
+    `,!1),s.TempleRegistry.createElement("table",{class:"w-full bd-collapse"},[s.TempleRegistry.createText(`
+      `,!1),s.TempleRegistry.createElement("thead",{},[s.TempleRegistry.createText(`
+        `,!1),s.TempleRegistry.createElement("th",{class:"p-10 tx-left tx-uppercase"},[s.TempleRegistry.createText("Property",!1)]).element,s.TempleRegistry.createText(`
+        `,!1),...a.value.includes("Emitter")?[]:[s.TempleRegistry.createText(`
+          `,!1),s.TempleRegistry.createElement("th",{class:"p-10 tx-left tx-uppercase"},[s.TempleRegistry.createText("Returns",!1)]).element,s.TempleRegistry.createText(`
+        `,!1)],s.TempleRegistry.createText(`
+        `,!1),s.TempleRegistry.createElement("th",{class:"p-10 tx-left tx-uppercase"},[s.TempleRegistry.createText("Description",!1)]).element,s.TempleRegistry.createText(`
+      `,!1)]).element,s.TempleRegistry.createText(`
+      `,!1),s.TempleRegistry.createElement("tbody",{},[s.TempleRegistry.createText(`
+        `,!1),...Object.entries(Le[a.value]).map(([y,d])=>[s.TempleRegistry.createText(`
+          `,!1),s.TempleRegistry.createElement("tr",{},[s.TempleRegistry.createText(`
+            `,!1),...d.kind==="property"?[s.TempleRegistry.createText(`
+              `,!1),s.TempleRegistry.createElement("td",{class:"tx-primary tx-top tx-nowrap bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10"},[s.TempleRegistry.createText(`
+                `,!1),...this._toNodeList(y),s.TempleRegistry.createText(`
+              `,!1)]).element,s.TempleRegistry.createText(`
+              `,!1),...Le[d.type]?[s.TempleRegistry.createText(`
+                `,!1),s.TempleRegistry.createElement("td",{class:"tx-top tx-nowrap bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10"},[s.TempleRegistry.createText(`
+                  `,!1),s.TempleRegistry.createElement("a",{"data-type":d.type,click:n},[s.TempleRegistry.createText(`
+                    `,!1),...this._toNodeList(d.type),s.TempleRegistry.createText(`
+                  `,!1)]).element,...this._toNodeList(d.list?"[]":""),s.TempleRegistry.createText(`
+                `,!1)]).element,s.TempleRegistry.createText(`
+              `,!1)]:[,s.TempleRegistry.createText(`
+                `,!1),s.TempleRegistry.createElement("td",{class:"tx-top tx-nowrap bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10"},[s.TempleRegistry.createText(`
+                  `,!1),...this._toNodeList(d.type),...this._toNodeList(d.list?"[]":""),s.TempleRegistry.createText(`
+                `,!1)]).element,s.TempleRegistry.createText(`
+              `,!1)],s.TempleRegistry.createText(`
+            `,!1)]:d.kind==="function"?[,s.TempleRegistry.createText(`
+              `,!1),s.TempleRegistry.createElement("td",{class:"tx-primary tx-top bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10",nowrap:!0},[s.TempleRegistry.createText(`
+                `,!1),...this._toNodeList(y),s.TempleRegistry.createText(`(
+                  `,!1),...Object.entries(d.args).map(([k,x])=>[s.TempleRegistry.createText(`
+                    `,!1),...k>0?[s.TempleRegistry.createText(", ",!1)]:[],s.TempleRegistry.createText(`
+                    `,!1),...this._toNodeList(x.name),s.TempleRegistry.createText(`: 
+                    `,!1),...Le[x.type]?[s.TempleRegistry.createText(`
+                      `,!1),s.TempleRegistry.createElement("a",{"data-type":x.type,click:n},[s.TempleRegistry.createText(`
+                        `,!1),...this._toNodeList(x.type),s.TempleRegistry.createText(`
+                      `,!1)]).element,...this._toNodeList(x.list?"[]":""),s.TempleRegistry.createText(`
+                    `,!1)]:[,s.TempleRegistry.createText(`
+                      `,!1),...this._toNodeList(x.type),...this._toNodeList(x.list?"[]":""),s.TempleRegistry.createText(`
+                    `,!1)],s.TempleRegistry.createText(`
+                  `,!1)]).flat(),s.TempleRegistry.createText(`
+                )
+              `,!1)]).element,s.TempleRegistry.createText(`
+              `,!1),...Le[d.returns.type]?[s.TempleRegistry.createText(`
+                `,!1),s.TempleRegistry.createElement("td",{class:"tx-top tx-nowrap bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10"},[s.TempleRegistry.createText(`
+                  `,!1),s.TempleRegistry.createElement("a",{"data-type":d.returns.type,click:n},[s.TempleRegistry.createText(`
+                    `,!1),...this._toNodeList(d.returns.type),s.TempleRegistry.createText(`
+                  `,!1)]).element,...this._toNodeList(d.returns.list?"[]":""),s.TempleRegistry.createText(`
+                `,!1)]).element,s.TempleRegistry.createText(`
+              `,!1)]:[,s.TempleRegistry.createText(`
+                `,!1),s.TempleRegistry.createElement("td",{class:"tx-top tx-nowrap bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10"},[s.TempleRegistry.createText(`
+                  `,!1),...this._toNodeList(d.returns.type),...this._toNodeList(d.returns.list?"[]":""),s.TempleRegistry.createText(`
+                `,!1)]).element,s.TempleRegistry.createText(`
+              `,!1)],s.TempleRegistry.createText(`
+            `,!1)]:d.kind==="event"?[,s.TempleRegistry.createText(`
+              `,!1),s.TempleRegistry.createElement("td",{class:"tx-primary tx-top bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10",nowrap:!0},[s.TempleRegistry.createText(`
+                `,!1),...this._toNodeList(`on('${y}', (event: Event) => void)`),s.TempleRegistry.createText(`
+              `,!1)]).element,s.TempleRegistry.createText(`
+            `,!1)]:[],s.TempleRegistry.createText(`
+            `,!1),s.TempleRegistry.createElement("td",{class:"tx-top tx-lh-24 bd-solid bd-t-2 bdx-0 bdb-0 bdt-1 p-10"},[s.TempleRegistry.createText(`
+              `,!1),...d.description?[s.TempleRegistry.createText(`
+                `,!1),s.TempleRegistry.createElement("p",{class:"pb-10"},[...this._toNodeList(d.description)]).element,s.TempleRegistry.createText(`
+                `,!1),...d.example?[s.TempleRegistry.createText(`
+                  `,!1),s.TempleRegistry.createElement("h5",{},[s.TempleRegistry.createText("Example",!1)]).element,s.TempleRegistry.createText(`
+                  `,!1),s.TempleRegistry.createComponent("api-ide-code",Y,{lang:"js"},[...this._toNodeList(d.example)]).element,s.TempleRegistry.createText(` 
+                `,!1)]:[],s.TempleRegistry.createText(`
+              `,!1)]:[],s.TempleRegistry.createText(`
+            `,!1)]).element,s.TempleRegistry.createText(`
+          `,!1)]).element,s.TempleRegistry.createText(`
+        `,!1)]).flat(),s.TempleRegistry.createText(`
+      `,!1)]).element,s.TempleRegistry.createText(`
+    `,!1)]).element,s.TempleRegistry.createText(`
+  `,!1)]).element,s.TempleRegistry.createText(`
+`,!1)]).element]}};var A=R(I()),pt=R(lt()),Nt=R(B()),de=class extends A.TempleComponent{static component=["code","Code_5294df1c620ef5ddbd2f"];styles(){return`:host {
     display: block;
-    margin: 40px 0;
-    overflow: hidden;
-  }
-  a {
-    color: #007BFF;
-    cursor: pointer;
-  }
-  th {
-    padding: 10px;
-    text-align: left;
-    text-transform: uppercase;
-  }
-  td {
-    border-color: #666666;
-    border-top-style: solid;
-    border-top-width: 1px;
-    padding: 10px;
+    font-size: 14px;
+    line-height: 20px;
   }
-  .tbl-container {
-    position: relative;
-    margin-bottom: 20px;
-    overflow: auto;
+  :host([inline]) {
+    display: inline !important;
   }
-  .tbl {
-    border-collapse: collapse;
-    display: table;
-    width: 100%;
+  :host([inline]),
+  :host([inline]) > pre,
+  :host([inline]) > pre > code {
+    display: inline !important;
   }
-
-  .tbl-scroll {
-    overflow: auto;
-    flex-grow: 1;
+  .snippet {
+    background-color: #000000;
+    color: #ABB2BF;
     height: 100%;
-    width: 100%;
-  }
-
-  .tbl-valign="top" nowrap {
-    white-space: valign="top" nowrap;
-  }
-
-  .tbl-z0 {
-    z-index: 0;
-  }
-  .tbl-z1 {
-    z-index: 1;
-  }
-  .tbl-z2 {
-    z-index: 2;
-  }
-  .tbl-z3 {
-    z-index: 3;
-  }
-  .tbl-z4 {
-    z-index: 4;
-  }
-
-  .tbl-sticky {
-    position: sticky;
-  }
-  .tbl-sticky-b {
-    bottom: 0;
-  }
-  .tbl-sticky-l {
-    left: 0;
-  }
-  .tbl-sticky-t {
-    top: 0;
-  }
-  .tbl-sticky-r {
-    right: 0;
+    margin: 0;
+    padding: 0;
   }
 
-  .tbl-col {
-    border-color: black;
-    border-style: solid;
-    border-top-width: 1px;
-    padding-bottom: 16px;
-    padding-left: 12px;
-    padding-right: 12px;
-    padding-top: 16px;
+  .line-numbers {
+    position: relative;
+    padding-left: 3.8em;
+    counter-reset: linenumber;
   }
-
-  .tbl-foot {
-    border-color: black;
-    border-style: solid;
-    border-top-width: 1px;
-    padding-bottom: 16px;
-    padding-left: 12px;
-    padding-right: 12px;
-    padding-top: 16px;
+  :host([inline]) .line-numbers {
+    position: static;
+    padding-left: 0;
   }
 
-  .tbl-row {
-    padding-bottom: 16px;
-    padding-left: 12px;
-    padding-right: 12px;
-    padding-top: 16px;
+  .line-numbers > code {
+    position: relative;
+    white-space: inherit;
   }
 
-  .tbl-head {
-    border-color: black;
-    border-style: solid;
-    border-top-width: 1px;
-    padding-bottom: 16px;
-    padding-left: 12px;
-    padding-right: 12px;
-    padding-top: 16px;
-  }
+  .line-numbers .line-numbers-rows {
+    position: absolute;
+    pointer-events: none;
+    top: 0;
+    font-size: 100%;
+    left: -3.8em;
+    width: 3em; /* works for line-numbers below 1000 lines */
+    letter-spacing: -1px;
+    border-right: 1px solid #999;
 
-  tr td:first-child {
-    color: #E49F1A;
-  }
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
 
-  h3 {
-    color: #DA532C;
-    background: #1A1A1A;
-    border-bottom: 1px solid #29252A;
-    font-size: 16px;
-    margin: 0;
-    padding: 10px;
-  }
-  h5 {
-    font-weight: normal;
-    margin: 15px 0 5px;
-    text-transform: uppercase;
-  }
-  td p {
-    margin: 0 0 10px;
-  }
-  .container {
-    background-color: #020202;
-    padding: 10px;
-  }`}template(){let{start:e="TempleCompiler"}=(0,ue.props)(),r=(0,ue.signal)([e]),l=(0,ue.signal)(e),i=h=>{let d=h.target.getAttribute("data-type");r.value=[...r.value,d],l.value=d},g=()=>{r.value=r.value.slice(0,r.value.length-1),l.value=r.value[r.value.length-1]};return()=>[a.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/fontawesome/all.css"}).element,a.TempleRegistry.createText(`
-`,!1),a.TempleRegistry.createElement("div",{},[a.TempleRegistry.createText(`
-  `,!1),a.TempleRegistry.createElement("h3",{},[a.TempleRegistry.createText(`
-    `,!1),...r.value.length>1?[a.TempleRegistry.createText(`
-      `,!1),a.TempleRegistry.createElement("a",{click:g},[a.TempleRegistry.createText(`
-        `,!1),a.TempleRegistry.createElement("i",{class:"fas fa-arrow-left"},[]).element,a.TempleRegistry.createText(`
-      `,!1)]).element,a.TempleRegistry.createText(`
-    `,!1)]:[],a.TempleRegistry.createText(`
-    API: `,!1),...this._toNodeList(l.value),a.TempleRegistry.createText(`
-  `,!1)]).element,a.TempleRegistry.createText(`
-  `,!1),a.TempleRegistry.createElement("div",{class:"container"},[a.TempleRegistry.createText(`
-    `,!1),a.TempleRegistry.createElement("div",{class:"tbl-container"},[a.TempleRegistry.createText(`
-      `,!1),a.TempleRegistry.createElement("table",{class:"tbl"},[a.TempleRegistry.createText(`
-        `,!1),a.TempleRegistry.createElement("thead",{},[a.TempleRegistry.createText(`
-          `,!1),a.TempleRegistry.createElement("th",{},[a.TempleRegistry.createText("Property",!1)]).element,a.TempleRegistry.createText(`
-          `,!1),...l.value.includes("Emitter")?[]:[a.TempleRegistry.createText(`
-            `,!1),a.TempleRegistry.createElement("th",{},[a.TempleRegistry.createText("Returns",!1)]).element,a.TempleRegistry.createText(`
-          `,!1)],a.TempleRegistry.createText(`
-          `,!1),a.TempleRegistry.createElement("th",{},[a.TempleRegistry.createText("Description",!1)]).element,a.TempleRegistry.createText(`
-        `,!1)]).element,a.TempleRegistry.createText(`
-        `,!1),a.TempleRegistry.createElement("tbody",{},[a.TempleRegistry.createText(`
-          `,!1),...Object.entries(de[l.value]).map(([h,d])=>[a.TempleRegistry.createText(`
-            `,!1),a.TempleRegistry.createElement("tr",{},[a.TempleRegistry.createText(`
-              `,!1),...d.kind==="property"?[a.TempleRegistry.createText(`
-                `,!1),a.TempleRegistry.createElement("td",{valign:"top",nowrap:!0},[...this._toNodeList(h)]).element,a.TempleRegistry.createText(`
-                `,!1),...de[d.type]?[a.TempleRegistry.createText(`
-                  `,!1),a.TempleRegistry.createElement("td",{valign:"top",nowrap:!0},[a.TempleRegistry.createText(`
-                    `,!1),a.TempleRegistry.createElement("a",{"data-type":d.type,click:i},[a.TempleRegistry.createText(`
-                      `,!1),...this._toNodeList(d.type),a.TempleRegistry.createText(`
-                    `,!1)]).element,...this._toNodeList(d.list?"[]":""),a.TempleRegistry.createText(`
-                  `,!1)]).element,a.TempleRegistry.createText(`
-                `,!1)]:[,a.TempleRegistry.createText(`
-                  `,!1),a.TempleRegistry.createElement("td",{valign:"top",nowrap:!0},[...this._toNodeList(d.type),...this._toNodeList(d.list?"[]":"")]).element,a.TempleRegistry.createText(`
-                `,!1)],a.TempleRegistry.createText(`
-              `,!1)]:d.kind==="function"?[,a.TempleRegistry.createText(`
-                `,!1),a.TempleRegistry.createElement("td",{valign:"top",nowrap:!0},[a.TempleRegistry.createText(`
-                  `,!1),...this._toNodeList(h),a.TempleRegistry.createText(`(
-                    `,!1),...Object.entries(d.args).map(([x,k])=>[a.TempleRegistry.createText(`
-                      `,!1),...x>0?[a.TempleRegistry.createText(", ",!1)]:[],a.TempleRegistry.createText(`
-                      `,!1),...this._toNodeList(k.name),a.TempleRegistry.createText(`: 
-                      `,!1),...de[k.type]?[a.TempleRegistry.createText(`
-                        `,!1),a.TempleRegistry.createElement("a",{"data-type":k.type,click:i},[a.TempleRegistry.createText(`
-                          `,!1),...this._toNodeList(k.type),a.TempleRegistry.createText(`
-                        `,!1)]).element,...this._toNodeList(k.list?"[]":""),a.TempleRegistry.createText(`
-                      `,!1)]:[,a.TempleRegistry.createText(`
-                        `,!1),...this._toNodeList(k.type),...this._toNodeList(k.list?"[]":""),a.TempleRegistry.createText(`
-                      `,!1)],a.TempleRegistry.createText(`
-                    `,!1)]).flat(),a.TempleRegistry.createText(`
-                  )
-                `,!1)]).element,a.TempleRegistry.createText(`
-                `,!1),...de[d.returns.type]?[a.TempleRegistry.createText(`
-                  `,!1),a.TempleRegistry.createElement("td",{valign:"top",nowrap:!0},[a.TempleRegistry.createText(`
-                    `,!1),a.TempleRegistry.createElement("a",{"data-type":d.returns.type,click:i},[a.TempleRegistry.createText(`
-                      `,!1),...this._toNodeList(d.returns.type),a.TempleRegistry.createText(`
-                    `,!1)]).element,...this._toNodeList(d.returns.list?"[]":""),a.TempleRegistry.createText(`
-                  `,!1)]).element,a.TempleRegistry.createText(`
-                `,!1)]:[,a.TempleRegistry.createText(`
-                  `,!1),a.TempleRegistry.createElement("td",{valign:"top",nowrap:!0},[...this._toNodeList(d.returns.type),...this._toNodeList(d.returns.list?"[]":"")]).element,a.TempleRegistry.createText(`
-                `,!1)],a.TempleRegistry.createText(`
-              `,!1)]:d.kind==="event"?[,a.TempleRegistry.createText(`
-                `,!1),a.TempleRegistry.createElement("td",{valign:"top",nowrap:!0},[...this._toNodeList(`on('${h}', (event: Event) => void)`)]).element,a.TempleRegistry.createText(`
-              `,!1)]:[],a.TempleRegistry.createText(`
-              `,!1),a.TempleRegistry.createElement("td",{},[a.TempleRegistry.createText(`
-                `,!1),...d.description?[a.TempleRegistry.createText(`
-                  `,!1),a.TempleRegistry.createElement("p",{},[...this._toNodeList(d.description)]).element,a.TempleRegistry.createText(`
-                  `,!1),...d.example?[a.TempleRegistry.createText(`
-                    `,!1),a.TempleRegistry.createElement("h5",{},[a.TempleRegistry.createText("Example",!1)]).element,a.TempleRegistry.createText(`
-                    `,!1),a.TempleRegistry.createComponent("ide-code",N,{lang:"js"},[...this._toNodeList(d.example)]).element,a.TempleRegistry.createText(` 
-                  `,!1)]:[],a.TempleRegistry.createText(`
-                `,!1)]:[],a.TempleRegistry.createText(`
-              `,!1)]).element,a.TempleRegistry.createText(`
-            `,!1)]).element,a.TempleRegistry.createText(`
-          `,!1)]).flat(),a.TempleRegistry.createText(`
-        `,!1)]).element,a.TempleRegistry.createText(`
-      `,!1)]).element,a.TempleRegistry.createText(`
-    `,!1)]).element,a.TempleRegistry.createText(`
-  `,!1)]).element,a.TempleRegistry.createText(`
-`,!1)]).element]}};var H=M(B()),V=M(ce()),Y=class extends H.TempleComponent{static component=["alert","Alert_6b81bcb0566ce7f0cd2d"];styles(){return`:host {
-    --black: #222222;
-    --white: #FCFCFC;
-    --info: #1474FC;
-    --error: #DC3545;
-    --warning: #FF7B07;
-    --success: #28A745;
-    --muted: #999999;
-    --primary: #E49F1A;
-    --secondary: #DA532C;
   }
 
-  /* Text Colors
-  ---------------------------------*/
-  .tx-white, .tx-white a {
-    color: var(--info);
-  }
-  .tx-white, .tx-white a {
-    color: var(--white);
-  }
-  .tx-error, .tx-error a {
-    color: var(--error);
-  }
-  .tx-warning, .tx-warning a {
-    color: var(--warning);
-  }
-  .tx-success, .tx-success a {
-    color: var(--success);
-  }
-  .tx-muted, .tx-muted a {
-    color: var(--muted);
-  }
-  .tx-primary, .tx-primary a {
-    color: var(--primary);
-  }
-  .tx-secondary, .tx-secondary a {
-    color: var(--secondary);
+  :host([inline]) .line-numbers .line-numbers-rows {
+    display: none;
   }
 
-  /* Borders
-  ---------------------------------*/
-  .curved {
-    border-radius: 5px;
-  }
-  .rounded {
-    border-radius:12px;
-  }
-  .pill {
-    border-radius: 10000px;
-  }
-  .solid {
-    border-style: solid;
-  }
-  .thin {
-    border-width: 1px;
+  .line-numbers-rows > span {
+    display: block;
+    counter-increment: linenumber;
   }
 
-  .bd-info {
-    border-color: var(--info);
-  }
-  .bd-error {
-    border-color: var(--error);
-  }
-  .bd-warning {
-    border-color: var(--warning);
-  }
-  .bd-success {
-    border-color: var(--success);
-  }
-  .bd-muted {
-    border-color: var(--muted);
-  }
-  .bd-primary {
-    border-color: var(--primary);
+  .line-numbers-rows > span:before {
+    content: counter(linenumber);
+    color: #999;
+    display: block;
+    padding-right: 0.8em;
+    text-align: right;
   }
-  .bd-secondary {
-    border-color: var(--secondary);
+  .pad {
+    padding: 5px;
   }
 
-  /* Backgrounds
-  ---------------------------------*/
-  .bg-white {
-    background-color: var(--white);
-  }
-  .bg-info {
-    background-color: var(--info);
-  }
-  .bg-error {
-    background-color: var(--error);
-  }
-  .bg-warning {
-    background-color: var(--warning);
-  }
-  .bg-success {
-    background-color: var(--success);
-  }
-  .bg-muted {
-    background-color: var(--muted);
-  }
-  .bg-primary {
-    background-color: var(--primary);
-  }
-  .bg-secondary {
-    background-color: var(--secondary);
+  .terminal {
+    background-color: #000000;
+    font-family: 'Courier New', Courier, monospace;
+    font-size: 15px;
+    height: 100%;
+    padding: 10px;
   }
+  .terminal span {
+    color: #00FF00;
+  }`}template(){let e=this.props,{lang:r="markup",numbers:a=!1,inline:n=!1,trim:u=!1,ltrim:y=!1,rtrim:d=!1,detab:k=0}=e,x=(0,Nt.children)(),f=x[0]?.textContent||"";k&&(f=f.replace(new RegExp(`\\n {${k}}`,"g"),`
+`)),u?f=f.trim():y?f=f.replace(/^\s+/,""):d&&(f=f.replace(/\s+$/,""));let _=E=>{if(!f)return;let T=pt.default.highlight(f,pt.default.languages[r],r);if(E.detail.target.innerHTML=T,a){let L=T.match(/\n(?!$)/g),l=L?L.length+1:1,i=new Array(l+1).join(""),p=document.createElement("span");p.setAttribute("aria-hidden","true"),p.className="line-numbers-rows",p.innerHTML=i,E.detail.target.appendChild(p)}};return()=>[A.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism.min.css"}).element,A.TempleRegistry.createText(`
+`,!1),A.TempleRegistry.createElement("link",{rel:"stylesheet",href:"https://cdnjs.cloudflare.com/ajax/libs/prism/9000.0.1/themes/prism-tomorrow.min.css"}).element,A.TempleRegistry.createText(`
+`,!1),...r==="bash"?[A.TempleRegistry.createText(`
+  `,!1),A.TempleRegistry.createElement("div",{class:"terminal"},[A.TempleRegistry.createElement("span",{},[A.TempleRegistry.createText("$",!1)]).element,A.TempleRegistry.createText(" ",!1),...this._toNodeList(x)]).element,A.TempleRegistry.createText(`
+`,!1)]:f?[,A.TempleRegistry.createText(`
+  `,!1),...a?[A.TempleRegistry.createText(`
+    `,!1),A.TempleRegistry.createElement("pre",{class:"snippet line-numbers"},[A.TempleRegistry.createElement("code",{mount:_},[]).element]).element,A.TempleRegistry.createText(`
+  `,!1)]:[,A.TempleRegistry.createText(`
+    `,!1),A.TempleRegistry.createElement("pre",{class:"snippet pad"},[A.TempleRegistry.createElement("code",{mount:_},[]).element]).element,A.TempleRegistry.createText(`
+  `,!1)],A.TempleRegistry.createText(`
+`,!1)]:[,A.TempleRegistry.createText(`
+  `,!1),A.TempleRegistry.createElement("span",{},[A.TempleRegistry.createText("????",!1)]).element,A.TempleRegistry.createText(`
+`,!1)],A.TempleRegistry.createText(`
 
-  /* Alert
-  ---------------------------------*/
-  .alert {
-    padding: 16px;
-  }`}template(){let{color:e,info:r,warning:l,success:i,error:g,muted:h,primary:d,secondary:x,solid:k,outline:T,curved:E,rounded:_,pill:v,style:w}=(0,V.props)(),n={classes:["alert"],styles:""},s=T?"outline":"solid";E?n.classes.push("curved"):_?n.classes.push("rounded"):v&&n.classes.push("pill"),s==="outline"?(n.classes.push("solid","thin"),e?(n.styles+=`border-color: ${e};`,n.styles+=`color: ${e};`):r?n.classes.push("bd-info","tx-info"):l?n.classes.push("bd-warning","tx-warning"):i?n.classes.push("bd-success","tx-success"):g?n.classes.push("bd-error","tx-error"):h?n.classes.push("bd-muted","tx-muted"):d?n.classes.push("bd-primary","tx-primary"):x&&n.classes.push("bd-secondary","tx-secondary")):(n.classes.push("tx-white"),e?n.styles+=`background-color: ${e};`:r?n.classes.push("bg-info"):l?n.classes.push("bg-warning"):i?n.classes.push("bg-success"):g?n.classes.push("bg-error"):h?n.classes.push("bg-muted"):d?n.classes.push("bg-primary"):x&&n.classes.push("bg-secondary"));let o={classes:[...n.classes,(0,V.classnames)()].join(" "),styles:{...n.styles,...w}};return()=>[H.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/fontawesome/all.css"}).element,H.TempleRegistry.createText(`
-`,!1),H.TempleRegistry.createElement("div",{class:o.classes,style:o.styles},[H.TempleRegistry.createText(`
-  `,!1),...this._toNodeList((0,V.children)()),H.TempleRegistry.createText(`
-`,!1)]).element]}};var P=M(B());var ze=function(t,...e){let r=Je(t);for(let l=0;l[P.TempleRegistry.createText(`
-    `,!1),...r?[P.TempleRegistry.createText(`
-      `,!1),P.TempleRegistry.createElement("p",{},[...this._toNodeList(T)]).element,P.TempleRegistry.createText(`
-    `,!1)]:l?[,P.TempleRegistry.createText(`
-      `,!1),P.TempleRegistry.createElement("li",{},[...this._toNodeList(T)]).element,P.TempleRegistry.createText(`
-    `,!1)]:i?[,P.TempleRegistry.createText(`
-      `,!1),P.TempleRegistry.createElement("div",{},[...this._toNodeList(T)]).element,P.TempleRegistry.createText(`
-    `,!1)]:[,P.TempleRegistry.createText(`
-      `,!1),...this._toNodeList(T),P.TempleRegistry.createText(`
-    `,!1)]]}};var R=M(B());j.emitter.once("ready",()=>{let t=document.querySelector("script[data-app]");if(!t)throw j.TempleException.for("APP_DATA not found");try{let h=atob(t.getAttribute("data-app"));window.__APP_DATA__=JSON.parse(h),Object.entries(window.__APP_DATA__).forEach(([d,x])=>{j.data.set(d,x)})}catch{throw j.TempleException.for("APP_DATA is not a valid JSON")}j.data.set("current","document");let e="/docs/client-api.html",r=ze("Client API - Temple reactive web component template engine."),l=ze("Client API documentation for Temple."),i=h=>{document.body.classList.toggle("panel-left-open")};j.data.delete("current");let g={0:{class:"head panel-head"},1:{class:"menu fas fa-fw fa-bars",click:i},2:{href:"/temple"},3:{src:"/temple/temple-icon.png",alt:"Temple Logo"},5:{class:"tx-white",href:"/temple"},7:{class:"tx-white",href:"/temple/docs/index.html"},8:{class:"github",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},9:{class:"fab fa-github"},10:{class:"npm",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},11:{class:"fab fa-npm text-white"},12:{class:"discord",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},13:{class:"fab fa-discord text-white"},14:{class:"left panel-left"},16:{href:"/temple"},17:{src:"/temple/temple-icon.png",alt:"Temple Logo"},19:{class:"tx-white",href:"/temple"},20:{class:"toggle fas fa-fw fa-chevron-left",click:i},23:{href:"/temple/docs/index.html"},24:{href:"/temple/docs/getting-started.html"},26:{href:"/temple/docs/markup-syntax.html"},27:{href:"/temple/docs/state-management.html"},28:{href:"/temple/docs/component-strategy.html"},29:{href:"/temple/docs/compiler-api.html"},30:{href:"/temple/docs/client-api.html"},32:{href:"/temple/docs/template-engine.html"},33:{href:"/temple/docs/single-page.html"},34:{href:"/temple/docs/static-site.html"},35:{href:"/temple/docs/component-publisher.html"},36:{href:"/temple/docs/developer-tools.html"},37:{class:"panel-main"},38:{class:"docs container"},40:{p:!0,trim:!0},41:{inline:!0},42:{curved:!0,secondary:!0},43:{class:"fas fa-exclamation-triangle"},45:{start:"TempleAPI"},46:{class:"pager"},47:{class:"prev",href:"/temple/docs/compiler-api.html"},48:{class:"fas fa-fw fa-chevron-left"},49:{class:"next",href:"/temple/docs/template-engine.html"},50:{class:"fas fa-fw fa-chevron-right"},51:{class:"foot"}};for(let h of document.body.querySelectorAll("*")){let d=Object.fromEntries(Array.from(h.attributes).map(k=>[k.nodeName,k.nodeValue.length>0?k.nodeValue:!0])),x=String(j.TempleRegistry.elements.size);g[x]&&(Object.assign(d,g[x]),h.TempleAttributes=g[x]),j.TempleRegistry.register(h,d)}customElements.define("panel-main",Z),customElements.define("ide-code",N),customElements.define("api-ui",X),customElements.define("tui-alert",Y),customElements.define("i18n-translate",K),j.emitter.emit("mounted",document.body)});var ar={PanelMain_fd7f1af6410c5b5c8e1f:Z,IdeCode_6f36bc13bb6a166c7abc:N,ApiUi_dcdb1ec28ab9a6dac63a:X,TuiAlert_6b81bcb0566ce7f0cd2d:Y,I18nTranslate_7d25e372f5ffb5e39dad:K},lr="f859bf7a335e9eba03e0";return St(or);})();
+`,!1)]}};var M=R(I());var Ot=function(t){return t};var Ue=R(B()),ue=class extends M.TempleComponent{static component=["translate","Translate_0014b007fc91289b2776"];styles(){return""}template(){let{trim:e=!1,p:r=!1,li:a=!1,div:n=!1}=(0,Ue.props)(),u=(0,Ue.children)(),y=[],d=[];for(let _ of u)typeof _=="string"?y.push(_):_ instanceof Node&&_.textContent?y.push(_.textContent):(y.push("%s"),d.push(_));let k=y.join("");e&&(k=k.replace(/\s+/," ").trim());let x=Ot(k).split("%s"),f=[];for(let _=0;_[M.TempleRegistry.createText(`
+    `,!1),...r?[M.TempleRegistry.createText(`
+      `,!1),M.TempleRegistry.createElement("p",{},[...this._toNodeList(f)]).element,M.TempleRegistry.createText(`
+    `,!1)]:a?[,M.TempleRegistry.createText(`
+      `,!1),M.TempleRegistry.createElement("li",{},[...this._toNodeList(f)]).element,M.TempleRegistry.createText(`
+    `,!1)]:n?[,M.TempleRegistry.createText(`
+      `,!1),M.TempleRegistry.createElement("div",{},[...this._toNodeList(f)]).element,M.TempleRegistry.createText(`
+    `,!1)]:[,M.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(f),M.TempleRegistry.createText(`
+    `,!1)]]}};var ct=function(t,...e){let r=jr(t);for(let a=0;a{let t=document.querySelector("script[data-app]");if(!t)throw N.TempleException.for("APP_DATA not found");try{let y=atob(t.getAttribute("data-app"));window.__APP_DATA__=JSON.parse(y),Object.entries(window.__APP_DATA__).forEach(([d,k])=>{N.data.set(d,k)})}catch{throw N.TempleException.for("APP_DATA is not a valid JSON")}N.data.set("current","document");let e="/docs/client-api.html",r=ct("Client API - Temple reactive web component template engine."),a=ct("Client API documentation for Temple."),n=()=>{document.getElementsByTagName("panel-layout")[0].toggle("left")};N.data.delete("current");let u={2:{class:"flex flex-center-y px-20 py-15 m-0 bg-t-1"},3:{class:"fas fa-fw fa-bars cursor-pointer py-5 pr-10 none md-inline-block tx-t-1",click:n},4:{class:"flex-grow"},5:{class:"flex flex-center-y"},6:{class:"tx-white",href:"/temple/docs/index.html"},7:{class:"tx-t-1 tx-5xl ml-10",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},8:{class:"fab fa-github"},9:{class:"bg-h-cb3837 pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},10:{class:"fab fa-npm text-white"},11:{class:"bg-h-7289da pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},12:{class:"fab fa-discord text-white"},14:{class:"flex flex-center-y bg-t-2 py-15 pr-5 pl-10"},15:{href:"/temple"},16:{class:"h-26 mr-10",src:"/temple/temple-icon.png",alt:"Temple Logo"},17:{class:"flex-grow m-0 tx-uppercase"},18:{class:"tx-white",href:"/temple"},19:{class:"fas fa-fw fa-chevron-left cursor-pointer none md-inline-block",click:n},20:{class:"bg-t-1 scroll-auto h-calc-full-60"},21:{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-0 pt-20 pb-10 pl-10 tx-uppercase"},22:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/index.html"},23:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/getting-started.html"},24:{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},25:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/markup-syntax.html"},26:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/state-management.html"},27:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-strategy.html"},28:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/compiler-api.html"},29:{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/client-api.html"},30:{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},31:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/template-engine.html"},32:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/single-page.html"},33:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/static-site.html"},34:{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-publisher.html"},35:{class:"block tx-t-1 py-10 pl-10 mb-100",href:"/temple/docs/developer-tools.html"},38:{class:"tx-primary tx-uppercase tx-30 py-20"},39:{p:!0,trim:!0,class:"tx-lh-36 py-20"},40:{inline:!0},41:{curved:!0,secondary:!0,class:"py-20 tx-lh-24"},42:{class:"fas fa-exclamation-triangle"},44:{start:"TempleAPI"},45:{class:"flex"},46:{class:"tx-primary py-40",href:"/temple/docs/compiler-api.html"},47:{class:"fas fa-fw fa-chevron-left tx-t-1"},48:{class:"flex-grow tx-right tx-primary py-40",href:"/temple/docs/template-engine.html"},49:{class:"fas fa-fw fa-chevron-right tx-t-1"},50:{class:"foot"}};for(let y of document.body.querySelectorAll("*")){let d=Object.fromEntries(Array.from(y.attributes).map(x=>[x.nodeName,x.nodeValue.length>0?x.nodeValue:!0])),k=String(N.TempleRegistry.elements.size);u[k]&&(Object.assign(d,u[k]),y.TempleAttributes=u[k]),N.TempleRegistry.register(y,d)}customElements.define("panel-layout",ne),customElements.define("panel-head",se),customElements.define("panel-left",ie),customElements.define("panel-main",ae),customElements.define("tui-alert",le),customElements.define("api-docs",pe),customElements.define("api-ui",ce),customElements.define("ide-code",de),customElements.define("i18n-translate",ue),N.emitter.emit("mounted",document.body)});var Mr={PanelLayout_9f3ab204ce271feaf6f7:ne,PanelHead_2bf4dff19bc88ba4138b:se,PanelLeft_f4ab589e043eee17d229:ie,PanelMain_847772763f4518728ede:ae,TuiAlert_f0fe98801b4b833c4233:le,ApiDocs_40562a7bb56d70d971df:pe,ApiUi_0ec6f6ca4b362d125365:ce,ApiIdeCode_6f36bc13bb6a166c7abc:Y,IdeCode_5294df1c620ef5ddbd2f:de,I18nTranslate_0014b007fc91289b2776:ue},Ir="f859bf7a335e9eba03e0";return Xt(Nr);})();
 /*! Bundled license information:
 
 prismjs/prism.js:
diff --git a/docs/build/manifest.json b/docs/build/manifest.json
index 62feae6..c88c56e 100644
--- a/docs/build/manifest.json
+++ b/docs/build/manifest.json
@@ -1 +1 @@
-{"055f1a2f37d39d4fe92a":"/Users/cblanquera/server/projects/ossph/temple/packages/temple-web/src/pages/500.dtml","f01cefc94e8ee605f3f5":"/Users/cblanquera/server/projects/ossph/temple/packages/temple-web/src/pages/index.dtml","f859bf7a335e9eba03e0":"/Users/cblanquera/server/projects/ossph/temple/packages/temple-web/src/pages/docs/client-api.dtml","38ccffadc3c6e8b93d28":"/Users/cblanquera/server/projects/ossph/temple/packages/temple-web/src/pages/docs/compiler-api.dtml","8f2ff6d48aec3c3f0dc4":"/Users/cblanquera/server/projects/ossph/temple/packages/temple-web/src/pages/docs/component-publisher.dtml","75ff7698b5db04ad540c":"/Users/cblanquera/server/projects/ossph/temple/packages/temple-web/src/pages/docs/component-strategy.dtml","13781afd4fbd704a9789":"/Users/cblanquera/server/projects/ossph/temple/packages/temple-web/src/pages/docs/developer-tools.dtml","a67341498153885a2fc0":"/Users/cblanquera/server/projects/ossph/temple/packages/temple-web/src/pages/docs/getting-started.dtml","3e6a90cc5da3e950a902":"/Users/cblanquera/server/projects/ossph/temple/packages/temple-web/src/pages/docs/index.dtml","57e37fa233b38c87fe71":"/Users/cblanquera/server/projects/ossph/temple/packages/temple-web/src/pages/docs/markup-syntax.dtml","3550a936d66e61695120":"/Users/cblanquera/server/projects/ossph/temple/packages/temple-web/src/pages/docs/single-page.dtml","269f8b60f20cebb43be6":"/Users/cblanquera/server/projects/ossph/temple/packages/temple-web/src/pages/docs/state-management.dtml","1bf701a55aaad047771e":"/Users/cblanquera/server/projects/ossph/temple/packages/temple-web/src/pages/docs/static-site.dtml","2d721d6aed73f41f4e72":"/Users/cblanquera/server/projects/ossph/temple/packages/temple-web/src/pages/docs/template-engine.dtml"}
\ No newline at end of file
+{"055f1a2f37d39d4fe92a":"/Users/cblanquera/server/projects/ossph/temple/packages/temple-web/src/pages/500.dtml","f01cefc94e8ee605f3f5":"/Users/cblanquera/server/projects/ossph/temple/packages/temple-web/src/pages/index.dtml","a52462b5d1f8879f7b73":"/Users/cblanquera/server/projects/ossph/temple/packages/temple-web/src/pages/template-1.dtml","f859bf7a335e9eba03e0":"/Users/cblanquera/server/projects/ossph/temple/packages/temple-web/src/pages/docs/client-api.dtml","38ccffadc3c6e8b93d28":"/Users/cblanquera/server/projects/ossph/temple/packages/temple-web/src/pages/docs/compiler-api.dtml","8f2ff6d48aec3c3f0dc4":"/Users/cblanquera/server/projects/ossph/temple/packages/temple-web/src/pages/docs/component-publisher.dtml","75ff7698b5db04ad540c":"/Users/cblanquera/server/projects/ossph/temple/packages/temple-web/src/pages/docs/component-strategy.dtml","13781afd4fbd704a9789":"/Users/cblanquera/server/projects/ossph/temple/packages/temple-web/src/pages/docs/developer-tools.dtml","a67341498153885a2fc0":"/Users/cblanquera/server/projects/ossph/temple/packages/temple-web/src/pages/docs/getting-started.dtml","3e6a90cc5da3e950a902":"/Users/cblanquera/server/projects/ossph/temple/packages/temple-web/src/pages/docs/index.dtml","57e37fa233b38c87fe71":"/Users/cblanquera/server/projects/ossph/temple/packages/temple-web/src/pages/docs/markup-syntax.dtml","3550a936d66e61695120":"/Users/cblanquera/server/projects/ossph/temple/packages/temple-web/src/pages/docs/single-page.dtml","269f8b60f20cebb43be6":"/Users/cblanquera/server/projects/ossph/temple/packages/temple-web/src/pages/docs/state-management.dtml","1bf701a55aaad047771e":"/Users/cblanquera/server/projects/ossph/temple/packages/temple-web/src/pages/docs/static-site.dtml","2d721d6aed73f41f4e72":"/Users/cblanquera/server/projects/ossph/temple/packages/temple-web/src/pages/docs/template-engine.dtml"}
\ No newline at end of file
diff --git a/docs/build/server/055f1a2f37d39d4fe92a.js b/docs/build/server/055f1a2f37d39d4fe92a.js
index 53fd7c7..2b35e9c 100644
--- a/docs/build/server/055f1a2f37d39d4fe92a.js
+++ b/docs/build/server/055f1a2f37d39d4fe92a.js
@@ -1,698 +1,74 @@
-var TempleAPI = (() => {
-  var __create = Object.create;
-  var __defProp = Object.defineProperty;
-  var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-  var __getOwnPropNames = Object.getOwnPropertyNames;
-  var __getProtoOf = Object.getPrototypeOf;
-  var __hasOwnProp = Object.prototype.hasOwnProperty;
-  var __commonJS = (cb, mod) => function __require() {
-    return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
-  };
-  var __export = (target, all) => {
-    for (var name in all)
-      __defProp(target, name, { get: all[name], enumerable: true });
-  };
-  var __copyProps = (to, from, except, desc) => {
-    if (from && typeof from === "object" || typeof from === "function") {
-      for (let key of __getOwnPropNames(from))
-        if (!__hasOwnProp.call(to, key) && key !== except)
-          __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-    }
-    return to;
-  };
-  var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-    // If the importer is in node compatibility mode or this is not an ESM
-    // file that has been converted to a CommonJS file using a Babel-
-    // compatible transform (i.e. "__esModule" has not been set), then set
-    // "default" to the CommonJS "module.exports" for node compatibility.
-    isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-    mod
-  ));
-  var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-
-  // ../temple/dist/Exception.js
-  var require_Exception = __commonJS({
-    "../temple/dist/Exception.js"(exports) {
-      "use strict";
-      Object.defineProperty(exports, "__esModule", { value: true });
-      var TempleException = class extends Error {
-        static for(message, ...values) {
-          values.forEach(function(value) {
-            message = message.replace("%s", value);
-          });
-          return new this(message);
-        }
-        static forErrorsFound(errors) {
-          const exception = new this("Invalid Parameters");
-          exception.errors = errors;
-          return exception;
-        }
-        static require(condition, message, ...values) {
-          if (!condition) {
-            for (const value of values) {
-              message = message.replace("%s", value);
-            }
-            throw new this(message);
-          }
-        }
-        constructor(message, code = 500) {
-          super();
-          this.errors = {};
-          this.start = 0;
-          this.end = 0;
-          this.message = message;
-          this.name = this.constructor.name;
-          this.code = code;
-        }
-        withCode(code) {
-          this.code = code;
-          return this;
-        }
-        withPosition(start, end) {
-          this.start = start;
-          this.end = end;
-          return this;
-        }
-        toJSON() {
-          return {
-            error: true,
-            code: this.code,
-            message: this.message
-          };
-        }
-      };
-      exports.default = TempleException;
-    }
-  });
-
-  // ../temple/dist/server/TempleCollection.js
-  var require_TempleCollection = __commonJS({
-    "../temple/dist/server/TempleCollection.js"(exports) {
-      "use strict";
-      Object.defineProperty(exports, "__esModule", { value: true });
-      var TempleCollection = class {
-        constructor(elements = []) {
-          this._elements = /* @__PURE__ */ new Set();
-          elements.forEach((element) => this._elements.add(element));
-        }
-        add(element) {
-          this._elements.add(element);
-        }
-        toArray() {
-          return Array.from(this._elements);
-        }
-        toString() {
-          return Array.from(this._elements).map((child) => child.toString()).join("");
-        }
-      };
-      exports.default = TempleCollection;
-    }
-  });
-
-  // ../temple/dist/server/data.js
-  var require_data = __commonJS({
-    "../temple/dist/server/data.js"(exports) {
-      "use strict";
-      Object.defineProperty(exports, "__esModule", { value: true });
-      var data = /* @__PURE__ */ new Map();
-      exports.default = data;
-    }
-  });
-
-  // ../temple/dist/server/TempleElement.js
-  var require_TempleElement = __commonJS({
-    "../temple/dist/server/TempleElement.js"(exports) {
-      "use strict";
-      var __importDefault = exports && exports.__importDefault || function(mod) {
-        return mod && mod.__esModule ? mod : { "default": mod };
-      };
-      Object.defineProperty(exports, "__esModule", { value: true });
-      var TempleCollection_1 = __importDefault(require_TempleCollection());
-      var selfClosingTags = [
-        "area",
-        "base",
-        "br",
-        "col",
-        "embed",
-        "hr",
-        "img",
-        "input",
-        "link",
-        "meta",
-        "param",
-        "source",
-        "track",
-        "wbr"
-      ];
-      var TempleElement2 = class {
-        static render(markup) {
-          return markup.map((child) => child.toString()).join("");
-        }
-        get name() {
-          return this._name;
-        }
-        get attributes() {
-          return this._attributes;
-        }
-        get children() {
-          return this._children;
-        }
-        constructor(name, attributes = {}, children = []) {
-          this._attributes = {};
-          this._name = name;
-          this._attributes = attributes;
-          this._children = new TempleCollection_1.default(children);
-        }
-        toString() {
-          const entries = Object.entries(this._attributes);
-          const attributes = entries.length > 0 ? " " + entries.map(([key, value]) => {
-            if (typeof value === "string") {
-              return `${key}="${value}"`;
-            } else if (typeof value === "boolean") {
-              return value ? key : "";
-            }
-          }).join(" ") : "";
-          if (selfClosingTags.includes(this._name)) {
-            return `<${this._name}${attributes} />`;
-          }
-          const children = this._children.toString();
-          return `<${this._name}${attributes}>${children}`;
-        }
-      };
-      exports.default = TempleElement2;
-    }
-  });
-
-  // ../temple/dist/server/TempleText.js
-  var require_TempleText = __commonJS({
-    "../temple/dist/server/TempleText.js"(exports) {
-      "use strict";
-      Object.defineProperty(exports, "__esModule", { value: true });
-      var TempleText = class {
-        get value() {
-          return this._escape ? this._value.replace(/&/g, "&").replace(//g, ">") : this._value;
-        }
-        constructor(value, escape = false) {
-          this._escape = escape;
-          this._value = value;
-        }
-        toString() {
-          return this.value;
-        }
-      };
-      exports.default = TempleText;
-    }
-  });
-
-  // ../temple/dist/server/TempleRegistry.js
-  var require_TempleRegistry = __commonJS({
-    "../temple/dist/server/TempleRegistry.js"(exports) {
-      "use strict";
-      var __importDefault = exports && exports.__importDefault || function(mod) {
-        return mod && mod.__esModule ? mod : { "default": mod };
-      };
-      Object.defineProperty(exports, "__esModule", { value: true });
-      var TempleText_1 = __importDefault(require_TempleText());
-      var TempleElement_1 = __importDefault(require_TempleElement());
-      var TempleRegistry2 = class {
-        static createElement(name, attributes, children = []) {
-          return new TempleElement_1.default(name, attributes, children);
-        }
-        static createText(value, escape = true) {
-          return new TempleText_1.default(value, escape);
-        }
-      };
-      exports.default = TempleRegistry2;
-    }
-  });
-
-  // ../temple/dist/server/TempleDocument.js
-  var require_TempleDocument = __commonJS({
-    "../temple/dist/server/TempleDocument.js"(exports) {
-      "use strict";
-      var __importDefault = exports && exports.__importDefault || function(mod) {
-        return mod && mod.__esModule ? mod : { "default": mod };
-      };
-      Object.defineProperty(exports, "__esModule", { value: true });
-      var Exception_1 = __importDefault(require_Exception());
-      var data_1 = __importDefault(require_data());
-      var TempleElement_1 = __importDefault(require_TempleElement());
-      var TempleRegistry_1 = __importDefault(require_TempleRegistry());
-      var TempleDocument2 = class {
-        render(props2 = {}) {
-          data_1.default.set("props", props2 || {});
-          data_1.default.set("env", Object.assign(Object.assign({}, process.env || {}), { BUILD_ID: this.id(), APP_DATA: btoa(JSON.stringify(Object.assign(Object.assign({}, Object.fromEntries(data_1.default.entries())), { env: Object.assign(Object.assign({}, Object.fromEntries(Object.entries(process.env || {}).filter((entry) => entry[0].startsWith("PUBLIC_")))), { BUILD_ID: this.id() }) }))) }));
-          const children = this.template();
-          let document2 = TempleElement_1.default.render(children).trim();
-          if (!document2.toLowerCase().startsWith(" tag.");
-          }
-          return `
-${document2}`;
-        }
-        _toNodeList(value) {
-          if (typeof value === "object" && typeof value.nodeType === "number") {
-            return [value];
-          }
-          if (Array.isArray(value)) {
-            if (value.every((item) => typeof item === "object" && typeof item.nodeType === "number")) {
-              return value;
-            }
-          }
-          return [TempleRegistry_1.default.createText(String(value))];
-        }
-      };
-      exports.default = TempleDocument2;
-    }
-  });
-
-  // ../temple/dist/server/TempleEmitter.js
-  var require_TempleEmitter = __commonJS({
-    "../temple/dist/server/TempleEmitter.js"(exports) {
-      "use strict";
-      Object.defineProperty(exports, "__esModule", { value: true });
-      exports.TempleEmitter = void 0;
-      var TempleEmitter = class {
-        emit(event, target) {
-          return this;
-        }
-        on(event, callback) {
-          return this;
-        }
-        once(event, callback) {
-          return this;
-        }
-        unbind(event, callback) {
-          return this;
-        }
-      };
-      exports.TempleEmitter = TempleEmitter;
-      var emitter = new TempleEmitter();
-      exports.default = emitter;
-    }
-  });
-
-  // ../temple/dist/server/env.js
-  var require_env = __commonJS({
-    "../temple/dist/server/env.js"(exports) {
-      "use strict";
-      var __importDefault = exports && exports.__importDefault || function(mod) {
-        return mod && mod.__esModule ? mod : { "default": mod };
-      };
-      Object.defineProperty(exports, "__esModule", { value: true });
-      var data_1 = __importDefault(require_data());
-      function env2(name) {
-        const env3 = data_1.default.get("env") || {};
-        if (name) {
-          return env3[name] || null;
-        }
-        return env3;
-      }
-      exports.default = env2;
-    }
-  });
-
-  // ../temple/dist/server/props.js
-  var require_props = __commonJS({
-    "../temple/dist/server/props.js"(exports) {
-      "use strict";
-      var __importDefault = exports && exports.__importDefault || function(mod) {
-        return mod && mod.__esModule ? mod : { "default": mod };
-      };
-      Object.defineProperty(exports, "__esModule", { value: true });
-      exports.default = props2;
-      var data_1 = __importDefault(require_data());
-      function props2() {
-        return data_1.default.get("props") || {};
-      }
-    }
-  });
-
-  // ../temple/dist/server/classnames.js
-  var require_classnames = __commonJS({
-    "../temple/dist/server/classnames.js"(exports) {
-      "use strict";
-      var __importDefault = exports && exports.__importDefault || function(mod) {
-        return mod && mod.__esModule ? mod : { "default": mod };
-      };
-      Object.defineProperty(exports, "__esModule", { value: true });
-      exports.default = classnames;
-      var props_1 = __importDefault(require_props());
-      function classnames() {
-        return (0, props_1.default)()["class"];
-      }
-    }
-  });
-
-  // ../temple/dist/server/signal.js
-  var require_signal = __commonJS({
-    "../temple/dist/server/signal.js"(exports) {
-      "use strict";
-      Object.defineProperty(exports, "__esModule", { value: true });
-      exports.default = signal;
-      function signal(value) {
-        const methods = {
-          getter: () => property.raw,
-          setter: (value2) => value2
-        };
-        const property = {
-          raw: value,
-          getter(callback) {
-            methods.getter = callback;
-            return property;
-          },
-          setter(callback) {
-            methods.setter = callback;
-            return property;
-          }
-        };
-        Object.defineProperty(property, "value", {
-          get() {
-            return methods.getter();
-          },
-          set(value2) {
-            property.raw = methods.setter(value2);
-          }
-        });
-        return property;
-      }
-    }
-  });
-
-  // ../temple/dist/server.js
-  var require_server = __commonJS({
-    "../temple/dist/server.js"(exports) {
-      "use strict";
-      var __createBinding = exports && exports.__createBinding || (Object.create ? function(o, m, k, k2) {
-        if (k2 === void 0) k2 = k;
-        var desc = Object.getOwnPropertyDescriptor(m, k);
-        if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-          desc = { enumerable: true, get: function() {
-            return m[k];
-          } };
-        }
-        Object.defineProperty(o, k2, desc);
-      } : function(o, m, k, k2) {
-        if (k2 === void 0) k2 = k;
-        o[k2] = m[k];
-      });
-      var __setModuleDefault = exports && exports.__setModuleDefault || (Object.create ? function(o, v) {
-        Object.defineProperty(o, "default", { enumerable: true, value: v });
-      } : function(o, v) {
-        o["default"] = v;
-      });
-      var __importStar = exports && exports.__importStar || function(mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) {
-          for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-        }
-        __setModuleDefault(result, mod);
-        return result;
-      };
-      var __importDefault = exports && exports.__importDefault || function(mod) {
-        return mod && mod.__esModule ? mod : { "default": mod };
-      };
-      Object.defineProperty(exports, "__esModule", { value: true });
-      exports.TempleText = exports.TempleException = exports.TempleEmitter = exports.TempleElement = exports.TempleRegistry = exports.TempleDocument = exports.TempleCollection = exports.signal = exports.classnames = exports.props = exports.emitter = exports.env = exports.data = void 0;
-      var Exception_1 = __importDefault(require_Exception());
-      exports.TempleException = Exception_1.default;
-      var TempleCollection_1 = __importDefault(require_TempleCollection());
-      exports.TempleCollection = TempleCollection_1.default;
-      var TempleDocument_1 = __importDefault(require_TempleDocument());
-      exports.TempleDocument = TempleDocument_1.default;
-      var TempleRegistry_1 = __importDefault(require_TempleRegistry());
-      exports.TempleRegistry = TempleRegistry_1.default;
-      var TempleElement_1 = __importDefault(require_TempleElement());
-      exports.TempleElement = TempleElement_1.default;
-      var TempleEmitter_1 = __importStar(require_TempleEmitter());
-      exports.emitter = TempleEmitter_1.default;
-      Object.defineProperty(exports, "TempleEmitter", { enumerable: true, get: function() {
-        return TempleEmitter_1.TempleEmitter;
-      } });
-      var TempleText_1 = __importDefault(require_TempleText());
-      exports.TempleText = TempleText_1.default;
-      var data_1 = __importDefault(require_data());
-      exports.data = data_1.default;
-      var env_1 = __importDefault(require_env());
-      exports.env = env_1.default;
-      var props_1 = __importDefault(require_props());
-      exports.props = props_1.default;
-      var classnames_1 = __importDefault(require_classnames());
-      exports.classnames = classnames_1.default;
-      var signal_1 = __importDefault(require_signal());
-      exports.signal = signal_1.default;
-    }
-  });
-
-  // ../temple/server.js
-  var require_server2 = __commonJS({
-    "../temple/server.js"(exports, module) {
-      module.exports = { ...require_server() };
-    }
-  });
-
-  // temple-document-server-resolver:/Users/cblanquera/server/projects/ossph/temple/packages/temple-web/src/pages/500.dtml
-  var __exports = {};
-  __export(__exports, {
-    default: () => N500_055f1a2f37d39d4fe92a
-  });
-  var import_server = __toESM(require_server2());
-  var import_server2 = __toESM(require_server2());
-
-  // src/modules/i18n/index.ts
-  var _ = function(phrase, ...variables) {
-    let translation = translate(phrase);
-    for (let i = 0; i < variables.length; i++) {
-      translation = translation.replace("%s", String(variables[i]));
-    }
-    return translation;
-  };
-  var translate = function(phrase) {
-    return phrase;
-  };
-
-  // temple-document-server-resolver:/Users/cblanquera/server/projects/ossph/temple/packages/temple-web/src/pages/500.dtml
-  var N500_055f1a2f37d39d4fe92a = class extends import_server.TempleDocument {
-    id() {
-      return "055f1a2f37d39d4fe92a";
-    }
-    styles() {
-      return `.container { padding: 20px; }
-  .error pre {
-    border: 1px solid #222222;
-    font-family: Courier, monospace;
-    line-height: 22px;
-    padding: 20px;
-    white-space: pre-wrap;
-    word-wrap: break-word;
-  }`;
-    }
-    template() {
-      const url = "/temple/500.html";
-      const title = _("Oops... - Temple - The reactive web component template engine.");
-      const description = _("Temple is a template engine hat generates web components and support reactivity.");
-      const { error } = (0, import_server2.props)();
-      const toggle = (_2) => {
-        document.body.classList.toggle("panel-left-open");
-      };
-      return [
-        import_server.TempleRegistry.createText(`
-`, false),
-        import_server.TempleRegistry.createElement("html", {}, [
-          import_server.TempleRegistry.createText(`
-  `, false),
-          ...[
-            import_server.TempleRegistry.createElement("head", {}, [
-              import_server.TempleRegistry.createText(`
-  `, false),
-              import_server.TempleRegistry.createElement("meta", { "charset": `utf-8` }),
-              import_server.TempleRegistry.createText(`
-  `, false),
-              import_server.TempleRegistry.createElement("meta", { "name": `viewport`, "content": `width=device-width, initial-scale=1` }),
-              import_server.TempleRegistry.createText(`
-  `, false),
-              import_server.TempleRegistry.createElement("title", {}, [
-                ...this._toNodeList(title)
-              ]),
-              import_server.TempleRegistry.createText(`
-  `, false),
-              import_server.TempleRegistry.createElement("meta", { "name": `description`, "content": description }),
-              import_server.TempleRegistry.createText(`
-  `, false),
-              import_server.TempleRegistry.createElement("meta", { "property": `og:title`, "content": title }),
-              import_server.TempleRegistry.createText(`
-  `, false),
-              import_server.TempleRegistry.createElement("meta", { "property": `og:description`, "content": description }),
-              import_server.TempleRegistry.createText(`
-  `, false),
-              import_server.TempleRegistry.createElement("meta", { "property": `og:image`, "content": `https://ossphilippines.github.io/temple/temple-logo.png` }),
-              import_server.TempleRegistry.createText(`
-  `, false),
-              import_server.TempleRegistry.createElement("meta", { "property": `og:url`, "content": `https://ossphilippines.github.io/temple${url}` }),
-              import_server.TempleRegistry.createText(`
-  `, false),
-              import_server.TempleRegistry.createElement("meta", { "property": `og:type`, "content": `website` }),
-              import_server.TempleRegistry.createText(`
-  `, false),
-              import_server.TempleRegistry.createElement("meta", { "name": `twitter:card`, "content": `summary` }),
-              import_server.TempleRegistry.createText(`
-  `, false),
-              import_server.TempleRegistry.createElement("meta", { "name": `twitter:site`, "content": `@OSSPhilippines` }),
-              import_server.TempleRegistry.createText(`
-  `, false),
-              import_server.TempleRegistry.createElement("meta", { "name": `twitter:title`, "content": title }),
-              import_server.TempleRegistry.createText(`
-  `, false),
-              import_server.TempleRegistry.createElement("meta", { "name": `twitter:description`, "content": description }),
-              import_server.TempleRegistry.createText(`
-  `, false),
-              import_server.TempleRegistry.createElement("meta", { "name": `twitter:image`, "content": `https://ossphilippines.github.io/temple/temple-logo.png` }),
-              import_server.TempleRegistry.createText(`
-  `, false),
-              import_server.TempleRegistry.createElement("link", { "rel": `favicon`, "href": `/temple/favicon.ico` }),
-              import_server.TempleRegistry.createText(`
-  `, false),
-              import_server.TempleRegistry.createElement("link", { "rel": `shortcut icon`, "type": `image/png`, "href": `/temple/favicon.png` }),
-              import_server.TempleRegistry.createText(`
-  `, false),
-              import_server.TempleRegistry.createElement("link", { "rel": `stylesheet`, "type": `text/css`, "href": `/temple/styles/fontawesome/all.css` }),
-              import_server.TempleRegistry.createText(`
-  `, false),
-              import_server.TempleRegistry.createElement("link", { "rel": `stylesheet`, "type": `text/css`, "href": `/temple/styles/theme.css` }),
-              import_server.TempleRegistry.createText(`
-  `, false),
-              import_server.TempleRegistry.createElement("link", { "rel": `stylesheet`, "type": `text/css`, "href": `/temple/build/client/${(0, import_server2.env)("BUILD_ID")}.css` }),
-              import_server.TempleRegistry.createText(`
+var TempleAPI=(()=>{var X=Object.create;var x=Object.defineProperty;var Z=Object.getOwnPropertyDescriptor;var ee=Object.getOwnPropertyNames;var te=Object.getPrototypeOf,re=Object.prototype.hasOwnProperty;var i=(r,t)=>()=>(t||r((t={exports:{}}).exports,t),t.exports),ae=(r,t)=>{for(var a in t)x(r,a,{get:t[a],enumerable:!0})},R=(r,t,a,s)=>{if(t&&typeof t=="object"||typeof t=="function")for(let n of ee(t))!re.call(r,n)&&n!==a&&x(r,n,{get:()=>t[n],enumerable:!(s=Z(t,n))||s.enumerable});return r};var J=(r,t,a)=>(a=r!=null?X(te(r)):{},R(t||!r||!r.__esModule?x(a,"default",{value:r,enumerable:!0}):a,r)),se=r=>R(x({},"__esModule",{value:!0}),r);var v=i(E=>{"use strict";Object.defineProperty(E,"__esModule",{value:!0});var w=class extends Error{static for(t,...a){return a.forEach(function(s){t=t.replace("%s",s)}),new this(t)}static forErrorsFound(t){let a=new this("Invalid Parameters");return a.errors=t,a}static require(t,a,...s){if(!t){for(let n of s)a=a.replace("%s",n);throw new this(a)}}constructor(t,a=500){super(),this.errors={},this.start=0,this.end=0,this.message=t,this.name=this.constructor.name,this.code=a}withCode(t){return this.code=t,this}withPosition(t,a){return this.start=t,this.end=a,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};E.default=w});var D=i(O=>{"use strict";Object.defineProperty(O,"__esModule",{value:!0});var j=class{get length(){return this._elements.size}constructor(t=[]){this._elements=new Set,t.forEach(a=>this._elements.add(a))}add(t){this._elements.add(t)}toArray(){return Array.from(this._elements)}toString(){return Array.from(this._elements).filter(Boolean).map(t=>t.toString()).join("")}};O.default=j});var p=i(P=>{"use strict";Object.defineProperty(P,"__esModule",{value:!0});var le=new Map;P.default=le});var q=i(M=>{"use strict";Object.defineProperty(M,"__esModule",{value:!0});var S=class{get value(){return this._escape?this._value.replace(/&/g,"&").replace(//g,">"):this._value}constructor(t,a=!1){this._escape=a,this._value=t}toString(){return this.value}};M.default=S});var $=i(u=>{"use strict";var ne=u&&u.__importDefault||function(r){return r&&r.__esModule?r:{default:r}};Object.defineProperty(u,"__esModule",{value:!0});var ie=ne(D()),ce=["area","base","br","col","embed","hr","img","input","link","meta","param","source","track","wbr"],k=class{get attributes(){return this._attributes}get children(){return this._children}get name(){return this._name}get props(){return this._props}constructor(t,a={},s="",n=[]){this._attributes={},this._name=t,this._attributes=a,this._props=s,this._children=new ie.default(n)}toString(){let t=Object.entries(this._attributes),a=t.length>0?" "+t.map(([n,_])=>{if(typeof _=="string")return`${n}="${_}"`;if(typeof _=="boolean")return _?n:""}).join(" "):"";if(ce.includes(this._name))return`<${this._name}${a} />`;let s=this._children.toString();return`<${this._name}${a}>${s}`}};u.default=k});var I=i(f=>{"use strict";var z=f&&f.__importDefault||function(r){return r&&r.__esModule?r:{default:r}};Object.defineProperty(f,"__esModule",{value:!0});var oe=z(q()),W=z($()),A=class{static render(t){return t.filter(Boolean).map(a=>a.toString()).join("")}static registry(t,a=new Set){return t.forEach(s=>{s instanceof W.default&&(["html","head","body"].includes(s.name)||a.add(s),s.name!=="head"&&s.children.length>0&&this.registry(s.children.toArray(),a))}),a}static createElement(t,a,s,n=[]){return new W.default(t,a,s,n)}static createText(t,a=!0){return new oe.default(t,a)}};f.default=A});var F=i(m=>{"use strict";var U=m&&m.__importDefault||function(r){return r&&r.__esModule?r:{default:r}};Object.defineProperty(m,"__esModule",{value:!0});var pe=U(v()),L=U(p()),B=U(I()),C=class{bindings(){let t=B.default.registry(this.template());return`{ ${Array.from(t.values()).map((s,n)=>s.props!=="{ }"?`'${n}': ${s.props}`:"").filter(s=>s!=="").join(", ")} }`}render(t={}){L.default.set("props",t||{}),L.default.set("env",Object.assign(Object.assign({},process.env||{}),{BUILD_ID:this.id(),APP_DATA:btoa(JSON.stringify(Object.assign(Object.assign({},Object.fromEntries(L.default.entries())),{env:Object.assign(Object.assign({},Object.fromEntries(Object.entries(process.env||{}).filter(n=>n[0].startsWith("PUBLIC_")))),{BUILD_ID:this.id()})})))}));let a=this.template(),s=B.default.render(a).trim();if(!s.toLowerCase().startsWith(" tag.");return`
+${s}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:Array.isArray(t)&&t.every(a=>typeof a=="object"&&typeof a.nodeType=="number")?t:[B.default.createText(String(t))]}};m.default=C});var V=i(h=>{"use strict";Object.defineProperty(h,"__esModule",{value:!0});h.TempleEmitter=void 0;var b=class{emit(t,a){return this}on(t,a){return this}once(t,a){return this}unbind(t,a){return this}};h.TempleEmitter=b;var ue=new b;h.default=ue});var Y=i(d=>{"use strict";var fe=d&&d.__importDefault||function(r){return r&&r.__esModule?r:{default:r}};Object.defineProperty(d,"__esModule",{value:!0});var me=fe(p());function he(r){let t=me.default.get("env")||{};return r?t[r]||null:t}d.default=he});var G=i(g=>{"use strict";var de=g&&g.__importDefault||function(r){return r&&r.__esModule?r:{default:r}};Object.defineProperty(g,"__esModule",{value:!0});g.default=_e;var ge=de(p());function _e(){return ge.default.get("props")||{}}});var K=i(l=>{"use strict";var xe=l&&l.__createBinding||(Object.create?function(r,t,a,s){s===void 0&&(s=a);var n=Object.getOwnPropertyDescriptor(t,a);(!n||("get"in n?!t.__esModule:n.writable||n.configurable))&&(n={enumerable:!0,get:function(){return t[a]}}),Object.defineProperty(r,s,n)}:function(r,t,a,s){s===void 0&&(s=a),r[s]=t[a]}),be=l&&l.__setModuleDefault||(Object.create?function(r,t){Object.defineProperty(r,"default",{enumerable:!0,value:t})}:function(r,t){r.default=t}),Te=l&&l.__importStar||function(r){if(r&&r.__esModule)return r;var t={};if(r!=null)for(var a in r)a!=="default"&&Object.prototype.hasOwnProperty.call(r,a)&&xe(t,r,a);return be(t,r),t},c=l&&l.__importDefault||function(r){return r&&r.__esModule?r:{default:r}};Object.defineProperty(l,"__esModule",{value:!0});l.TempleText=l.TempleException=l.TempleEmitter=l.TempleElement=l.TempleRegistry=l.TempleDocument=l.TempleCollection=l.props=l.emitter=l.env=l.data=void 0;var ye=c(v());l.TempleException=ye.default;var we=c(D());l.TempleCollection=we.default;var Ee=c(F());l.TempleDocument=Ee.default;var ve=c(I());l.TempleRegistry=ve.default;var je=c($());l.TempleElement=je.default;var H=Te(V());l.emitter=H.default;Object.defineProperty(l,"TempleEmitter",{enumerable:!0,get:function(){return H.TempleEmitter}});var Oe=c(q());l.TempleText=Oe.default;var De=c(p());l.data=De.default;var Pe=c(Y());l.env=Pe.default;var Se=c(G());l.props=Se.default});var N=i((ze,Q)=>{Q.exports={...K()}});var qe={};ae(qe,{default:()=>y});var e=J(N()),o=J(N());var T=function(r,...t){let a=Me(r);for(let s=0;s{var ee=Object.create;var E=Object.defineProperty;var te=Object.getOwnPropertyDescriptor;var re=Object.getOwnPropertyNames;var ae=Object.getPrototypeOf,le=Object.prototype.hasOwnProperty;var c=(r,t)=>()=>(t||r((t={exports:{}}).exports,t),t.exports),se=(r,t)=>{for(var a in t)E(r,a,{get:t[a],enumerable:!0})},F=(r,t,a,l)=>{if(t&&typeof t=="object"||typeof t=="function")for(let n of re(t))!le.call(r,n)&&n!==a&&E(r,n,{get:()=>t[n],enumerable:!(l=te(t,n))||l.enumerable});return r};var G=(r,t,a)=>(a=r!=null?ee(ae(r)):{},F(t||!r||!r.__esModule?E(a,"default",{value:r,enumerable:!0}):a,r)),ne=r=>F(E({},"__esModule",{value:!0}),r);var D=c(O=>{"use strict";Object.defineProperty(O,"__esModule",{value:!0});var j=class extends Error{static for(t,...a){return a.forEach(function(l){t=t.replace("%s",l)}),new this(t)}static forErrorsFound(t){let a=new this("Invalid Parameters");return a.errors=t,a}static require(t,a,...l){if(!t){for(let n of l)a=a.replace("%s",n);throw new this(a)}}constructor(t,a=500){super(),this.errors={},this.start=0,this.end=0,this.message=t,this.name=this.constructor.name,this.code=a}withCode(t){return this.code=t,this}withPosition(t,a){return this.start=t,this.end=a,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};O.default=j});var M=c(q=>{"use strict";Object.defineProperty(q,"__esModule",{value:!0});var P=class{constructor(t=[]){this._elements=new Set,t.forEach(a=>this._elements.add(a))}add(t){this._elements.add(t)}toArray(){return Array.from(this._elements)}toString(){return Array.from(this._elements).filter(Boolean).map(t=>t.toString()).join("")}};q.default=P});var f=c(S=>{"use strict";Object.defineProperty(S,"__esModule",{value:!0});var ce=new Map;S.default=ce});var b=c(m=>{"use strict";var ie=m&&m.__importDefault||function(r){return r&&r.__esModule?r:{default:r}};Object.defineProperty(m,"__esModule",{value:!0});var oe=ie(M()),fe=["area","base","br","col","embed","hr","img","input","link","meta","param","source","track","wbr"],L=class{static render(t){return t.filter(Boolean).map(a=>a.toString()).join("")}get name(){return this._name}get attributes(){return this._attributes}get children(){return this._children}constructor(t,a={},l=[]){this._attributes={},this._name=t,this._attributes=a,this._children=new oe.default(l)}toString(){let t=Object.entries(this._attributes),a=t.length>0?" "+t.map(([n,o])=>{if(typeof o=="string")return`${n}="${o}"`;if(typeof o=="boolean")return o?n:""}).join(" "):"";if(fe.includes(this._name))return`<${this._name}${a} />`;let l=this._children.toString();return`<${this._name}${a}>${l}`}};m.default=L});var C=c(A=>{"use strict";Object.defineProperty(A,"__esModule",{value:!0});var N=class{get value(){return this._escape?this._value.replace(/&/g,"&").replace(//g,">"):this._value}constructor(t,a=!1){this._escape=a,this._value=t}toString(){return this.value}};A.default=N});var I=c(u=>{"use strict";var J=u&&u.__importDefault||function(r){return r&&r.__esModule?r:{default:r}};Object.defineProperty(u,"__esModule",{value:!0});var me=J(C()),ue=J(b()),k=class{static createElement(t,a,l=[]){return new ue.default(t,a,l)}static createText(t,a=!0){return new me.default(t,a)}};u.default=k});var z=c(p=>{"use strict";var v=p&&p.__importDefault||function(r){return r&&r.__esModule?r:{default:r}};Object.defineProperty(p,"__esModule",{value:!0});var pe=v(D()),$=v(f()),de=v(b()),he=v(I()),B=class{render(t={}){$.default.set("props",t||{}),$.default.set("env",Object.assign(Object.assign({},process.env||{}),{BUILD_ID:this.id(),APP_DATA:btoa(JSON.stringify(Object.assign(Object.assign({},Object.fromEntries($.default.entries())),{env:Object.assign(Object.assign({},Object.fromEntries(Object.entries(process.env||{}).filter(n=>n[0].startsWith("PUBLIC_")))),{BUILD_ID:this.id()})})))}));let a=this.template(),l=de.default.render(a).trim();if(!l.toLowerCase().startsWith(" tag.");return`
-${l}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:Array.isArray(t)&&t.every(a=>typeof a=="object"&&typeof a.nodeType=="number")?t:[he.default.createText(String(t))]}};p.default=B});var V=c(d=>{"use strict";Object.defineProperty(d,"__esModule",{value:!0});d.TempleEmitter=void 0;var y=class{emit(t,a){return this}on(t,a){return this}once(t,a){return this}unbind(t,a){return this}};d.TempleEmitter=y;var Te=new y;d.default=Te});var Y=c(h=>{"use strict";var _e=h&&h.__importDefault||function(r){return r&&r.__esModule?r:{default:r}};Object.defineProperty(h,"__esModule",{value:!0});var xe=_e(f());function ge(r){let t=xe.default.get("env")||{};return r?t[r]||null:t}h.default=ge});var U=c(T=>{"use strict";var Ee=T&&T.__importDefault||function(r){return r&&r.__esModule?r:{default:r}};Object.defineProperty(T,"__esModule",{value:!0});T.default=ve;var be=Ee(f());function ve(){return be.default.get("props")||{}}});var H=c(_=>{"use strict";var ye=_&&_.__importDefault||function(r){return r&&r.__esModule?r:{default:r}};Object.defineProperty(_,"__esModule",{value:!0});_.default=je;var we=ye(U());function je(){return(0,we.default)().class}});var K=c(R=>{"use strict";Object.defineProperty(R,"__esModule",{value:!0});R.default=Oe;function Oe(r){let t={getter:()=>a.raw,setter:l=>l},a={raw:r,getter(l){return t.getter=l,a},setter(l){return t.setter=l,a}};return Object.defineProperty(a,"value",{get(){return t.getter()},set(l){a.raw=t.setter(l)}}),a}});var X=c(s=>{"use strict";var De=s&&s.__createBinding||(Object.create?function(r,t,a,l){l===void 0&&(l=a);var n=Object.getOwnPropertyDescriptor(t,a);(!n||("get"in n?!t.__esModule:n.writable||n.configurable))&&(n={enumerable:!0,get:function(){return t[a]}}),Object.defineProperty(r,l,n)}:function(r,t,a,l){l===void 0&&(l=a),r[l]=t[a]}),Pe=s&&s.__setModuleDefault||(Object.create?function(r,t){Object.defineProperty(r,"default",{enumerable:!0,value:t})}:function(r,t){r.default=t}),qe=s&&s.__importStar||function(r){if(r&&r.__esModule)return r;var t={};if(r!=null)for(var a in r)a!=="default"&&Object.prototype.hasOwnProperty.call(r,a)&&De(t,r,a);return Pe(t,r),t},i=s&&s.__importDefault||function(r){return r&&r.__esModule?r:{default:r}};Object.defineProperty(s,"__esModule",{value:!0});s.TempleText=s.TempleException=s.TempleEmitter=s.TempleElement=s.TempleRegistry=s.TempleDocument=s.TempleCollection=s.signal=s.classnames=s.props=s.emitter=s.env=s.data=void 0;var Me=i(D());s.TempleException=Me.default;var Se=i(M());s.TempleCollection=Se.default;var Le=i(z());s.TempleDocument=Le.default;var Ne=i(I());s.TempleRegistry=Ne.default;var Ae=i(b());s.TempleElement=Ae.default;var Q=qe(V());s.emitter=Q.default;Object.defineProperty(s,"TempleEmitter",{enumerable:!0,get:function(){return Q.TempleEmitter}});var Ce=i(C());s.TempleText=Ce.default;var ke=i(f());s.data=ke.default;var Ie=i(Y());s.env=Ie.default;var $e=i(U());s.props=$e.default;var Be=i(H());s.classnames=Be.default;var Ue=i(K());s.signal=Ue.default});var W=c((at,Z)=>{Z.exports={...X()}});var We={};se(We,{default:()=>w});var e=G(W()),g=G(W());var x=function(r,...t){let a=Re(r);for(let l=0;l{document.body.classList.toggle("panel-left-open")};return[e.TempleRegistry.createText(`
-`,!1),e.TempleRegistry.createElement("html",{},[e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("head",{},[e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{charset:"utf-8"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"viewport",content:"width=device-width, initial-scale=1"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("title",{},[...this._toNodeList(a)]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"description",content:l}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:title",content:a}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:description",content:l}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:image",content:"https://ossphilippines.github.io/temple/temple-logo.png"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:url",content:`https://ossphilippines.github.io/temple${t}`}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:type",content:"website"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:card",content:"summary"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:site",content:"@OSSPhilippines"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:title",content:a}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:description",content:l}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:image",content:"https://ossphilippines.github.io/temple/temple-logo.png"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"favicon",href:"/temple/favicon.ico"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"shortcut icon",type:"image/png",href:"/temple/favicon.png"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/fontawesome/all.css"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/theme.css"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:`/temple/build/client/${(0,g.env)("BUILD_ID")}.css`}),e.TempleRegistry.createText(`
+var TempleAPI=(()=>{var X=Object.create;var g=Object.defineProperty;var Z=Object.getOwnPropertyDescriptor;var ee=Object.getOwnPropertyNames;var te=Object.getPrototypeOf,le=Object.prototype.hasOwnProperty;var i=(l,t)=>()=>(t||l((t={exports:{}}).exports,t),t.exports),ae=(l,t)=>{for(var a in t)g(l,a,{get:t[a],enumerable:!0})},R=(l,t,a,s)=>{if(t&&typeof t=="object"||typeof t=="function")for(let n of ee(t))!le.call(l,n)&&n!==a&&g(l,n,{get:()=>t[n],enumerable:!(s=Z(t,n))||s.enumerable});return l};var G=(l,t,a)=>(a=l!=null?X(te(l)):{},R(t||!l||!l.__esModule?g(a,"default",{value:l,enumerable:!0}):a,l)),se=l=>R(g({},"__esModule",{value:!0}),l);var w=i(v=>{"use strict";Object.defineProperty(v,"__esModule",{value:!0});var E=class extends Error{static for(t,...a){return a.forEach(function(s){t=t.replace("%s",s)}),new this(t)}static forErrorsFound(t){let a=new this("Invalid Parameters");return a.errors=t,a}static require(t,a,...s){if(!t){for(let n of s)a=a.replace("%s",n);throw new this(a)}}constructor(t,a=500){super(),this.errors={},this.start=0,this.end=0,this.message=t,this.name=this.constructor.name,this.code=a}withCode(t){return this.code=t,this}withPosition(t,a){return this.start=t,this.end=a,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};v.default=E});var L=i(j=>{"use strict";Object.defineProperty(j,"__esModule",{value:!0});var k=class{get length(){return this._elements.size}constructor(t=[]){this._elements=new Set,t.forEach(a=>this._elements.add(a))}add(t){this._elements.add(t)}toArray(){return Array.from(this._elements)}toString(){return Array.from(this._elements).filter(Boolean).map(t=>t.toString()).join("")}};j.default=k});var p=i(N=>{"use strict";Object.defineProperty(N,"__esModule",{value:!0});var re=new Map;N.default=re});var S=i(P=>{"use strict";Object.defineProperty(P,"__esModule",{value:!0});var D=class{get value(){return this._escape?this._value.replace(/&/g,"&").replace(//g,">"):this._value}constructor(t,a=!1){this._escape=a,this._value=t}toString(){return this.value}};P.default=D});var M=i(m=>{"use strict";var ce=m&&m.__importDefault||function(l){return l&&l.__esModule?l:{default:l}};Object.defineProperty(m,"__esModule",{value:!0});var ne=ce(L()),ie=["area","base","br","col","embed","hr","img","input","link","meta","param","source","track","wbr"],O=class{get attributes(){return this._attributes}get children(){return this._children}get name(){return this._name}get props(){return this._props}constructor(t,a={},s="",n=[]){this._attributes={},this._name=t,this._attributes=a,this._props=s,this._children=new ne.default(n)}toString(){let t=Object.entries(this._attributes),a=t.length>0?" "+t.map(([n,b])=>{if(typeof b=="string")return`${n}="${b}"`;if(typeof b=="boolean")return b?n:""}).join(" "):"";if(ie.includes(this._name))return`<${this._name}${a} />`;let s=this._children.toString();return`<${this._name}${a}>${s}`}};m.default=O});var A=i(f=>{"use strict";var z=f&&f.__importDefault||function(l){return l&&l.__esModule?l:{default:l}};Object.defineProperty(f,"__esModule",{value:!0});var oe=z(S()),W=z(M()),q=class{static render(t){return t.filter(Boolean).map(a=>a.toString()).join("")}static registry(t,a=new Set){return t.forEach(s=>{s instanceof W.default&&(["html","head","body"].includes(s.name)||a.add(s),s.name!=="head"&&s.children.length>0&&this.registry(s.children.toArray(),a))}),a}static createElement(t,a,s,n=[]){return new W.default(t,a,s,n)}static createText(t,a=!0){return new oe.default(t,a)}};f.default=q});var F=i(h=>{"use strict";var B=h&&h.__importDefault||function(l){return l&&l.__esModule?l:{default:l}};Object.defineProperty(h,"__esModule",{value:!0});var pe=B(w()),I=B(p()),C=B(A()),$=class{bindings(){let t=C.default.registry(this.template());return`{ ${Array.from(t.values()).map((s,n)=>s.props!=="{ }"?`'${n}': ${s.props}`:"").filter(s=>s!=="").join(", ")} }`}render(t={}){I.default.set("props",t||{}),I.default.set("env",Object.assign(Object.assign({},process.env||{}),{BUILD_ID:this.id(),APP_DATA:btoa(JSON.stringify(Object.assign(Object.assign({},Object.fromEntries(I.default.entries())),{env:Object.assign(Object.assign({},Object.fromEntries(Object.entries(process.env||{}).filter(n=>n[0].startsWith("PUBLIC_")))),{BUILD_ID:this.id()})})))}));let a=this.template(),s=C.default.render(a).trim();if(!s.toLowerCase().startsWith(" tag.");return`
+${s}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:Array.isArray(t)&&t.every(a=>typeof a=="object"&&typeof a.nodeType=="number")?t:[C.default.createText(String(t))]}};h.default=$});var J=i(x=>{"use strict";Object.defineProperty(x,"__esModule",{value:!0});x.TempleEmitter=void 0;var y=class{emit(t,a){return this}on(t,a){return this}once(t,a){return this}unbind(t,a){return this}};x.TempleEmitter=y;var me=new y;x.default=me});var V=i(d=>{"use strict";var fe=d&&d.__importDefault||function(l){return l&&l.__esModule?l:{default:l}};Object.defineProperty(d,"__esModule",{value:!0});var he=fe(p());function xe(l){let t=he.default.get("env")||{};return l?t[l]||null:t}d.default=xe});var Y=i(u=>{"use strict";var de=u&&u.__importDefault||function(l){return l&&l.__esModule?l:{default:l}};Object.defineProperty(u,"__esModule",{value:!0});u.default=Te;var ue=de(p());function Te(){return ue.default.get("props")||{}}});var K=i(r=>{"use strict";var be=r&&r.__createBinding||(Object.create?function(l,t,a,s){s===void 0&&(s=a);var n=Object.getOwnPropertyDescriptor(t,a);(!n||("get"in n?!t.__esModule:n.writable||n.configurable))&&(n={enumerable:!0,get:function(){return t[a]}}),Object.defineProperty(l,s,n)}:function(l,t,a,s){s===void 0&&(s=a),l[s]=t[a]}),ge=r&&r.__setModuleDefault||(Object.create?function(l,t){Object.defineProperty(l,"default",{enumerable:!0,value:t})}:function(l,t){l.default=t}),ye=r&&r.__importStar||function(l){if(l&&l.__esModule)return l;var t={};if(l!=null)for(var a in l)a!=="default"&&Object.prototype.hasOwnProperty.call(l,a)&&be(t,l,a);return ge(t,l),t},o=r&&r.__importDefault||function(l){return l&&l.__esModule?l:{default:l}};Object.defineProperty(r,"__esModule",{value:!0});r.TempleText=r.TempleException=r.TempleEmitter=r.TempleElement=r.TempleRegistry=r.TempleDocument=r.TempleCollection=r.props=r.emitter=r.env=r.data=void 0;var _e=o(w());r.TempleException=_e.default;var Ee=o(L());r.TempleCollection=Ee.default;var ve=o(F());r.TempleDocument=ve.default;var we=o(A());r.TempleRegistry=we.default;var ke=o(M());r.TempleElement=ke.default;var H=ye(J());r.emitter=H.default;Object.defineProperty(r,"TempleEmitter",{enumerable:!0,get:function(){return H.TempleEmitter}});var je=o(S());r.TempleText=je.default;var Le=o(p());r.data=Le.default;var Ne=o(V());r.env=Ne.default;var De=o(Y());r.props=De.default});var U=i((ze,Q)=>{Q.exports={...K()}});var Se={};ae(Se,{default:()=>_});var e=G(U()),T=G(U());var c=function(l,...t){let a=Pe(l);for(let s=0;s{document.getElementsByTagName("panel-layout")[0].toggle("left")};return[e.TempleRegistry.createText(`
+`,!1),e.TempleRegistry.createElement("html",{},"{ }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("head",{},"{ }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{charset:"utf-8"},"{ 'charset': `utf-8` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"viewport",content:"width=device-width, initial-scale=1"},"{ 'name': `viewport`, 'content': `width=device-width, initial-scale=1` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("title",{},"{ }",[...this._toNodeList(a)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"description",content:s},"{ 'name': `description`, 'content': description }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:title",content:a},"{ 'property': `og:title`, 'content': title }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:description",content:s},"{ 'property': `og:description`, 'content': description }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:image",content:"https://ossphilippines.github.io/temple/temple-logo.png"},"{ 'property': `og:image`, 'content': `https://ossphilippines.github.io/temple/temple-logo.png` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:url",content:`https://ossphilippines.github.io/temple${t}`},"{ 'property': `og:url`, 'content': `https://ossphilippines.github.io/temple${url}` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:type",content:"website"},"{ 'property': `og:type`, 'content': `website` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:card",content:"summary"},"{ 'name': `twitter:card`, 'content': `summary` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:site",content:"@OSSPhilippines"},"{ 'name': `twitter:site`, 'content': `@OSSPhilippines` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:title",content:a},"{ 'name': `twitter:title`, 'content': title }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:description",content:s},"{ 'name': `twitter:description`, 'content': description }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:image",content:"https://ossphilippines.github.io/temple/temple-logo.png"},"{ 'name': `twitter:image`, 'content': `https://ossphilippines.github.io/temple/temple-logo.png` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"favicon",href:"/temple/favicon.ico"},"{ 'rel': `favicon`, 'href': `/temple/favicon.ico` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"shortcut icon",type:"image/png",href:"/temple/favicon.png"},"{ 'rel': `shortcut icon`, 'type': `image/png`, 'href': `/temple/favicon.png` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/fontawesome/all.css"},"{ 'rel': `stylesheet`, 'type': `text/css`, 'href': `/temple/styles/fontawesome/all.css` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/global.css"},"{ 'rel': `stylesheet`, 'type': `text/css`, 'href': `/temple/styles/global.css` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:`/temple/build/client/${(0,T.env)("BUILD_ID")}.css`},"{ 'rel': `stylesheet`, 'type': `text/css`, 'href': `/temple/build/client/${env('BUILD_ID')}.css` }"),e.TempleRegistry.createText(`
   
-  `,!1),e.TempleRegistry.createElement("script",{"data-app":(0,g.env)("APP_DATA"),src:`/temple/build/client/${(0,g.env)("BUILD_ID")}.js`}),e.TempleRegistry.createText(`
-  `,!1),...(0,g.env)("NODE_ENV")==="development"?[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("script",{src:"/dev.js"}),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("script",{"data-app":(0,T.env)("APP_DATA"),src:`/temple/build/client/${(0,T.env)("BUILD_ID")}.js`},"{ 'data-app': env('APP_DATA'), 'src': `/temple/build/client/${env('BUILD_ID')}.js` }"),e.TempleRegistry.createText(`
+  `,!1),...(0,T.env)("NODE_ENV")==="development"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("script",{src:"/dev.js"},"{ 'src': `/dev.js` }"),e.TempleRegistry.createText(`
   `,!1)]:[],e.TempleRegistry.createText(`
 `,!1)]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("body",{class:"dark panel with-head with-left"},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("header",{class:"head panel-head"},[e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("i",{class:"menu fas fa-fw fa-bars",click:n},[]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("a",{href:"/temple"},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("img",{src:"/temple/temple-icon.png",alt:"Temple Logo"}),e.TempleRegistry.createText(`
-  `,!1)]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("h3",{},[e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple"},[e.TempleRegistry.createText("Temple",!1)])]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("nav",{},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple/docs/index.html"},[e.TempleRegistry.createText("Docs",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{class:"github",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-github"},[]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("body",{class:"dark bg-t-0 tx-t1 arial"},"{ 'class': `dark bg-t-0 tx-t1 arial` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("panel-layout",{},"{ }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("panel-head",{},"{ }",[e.TempleRegistry.createElement("menu",{class:"flex flex-center-y px-20 py-15 m-0 bg-t-1"},"{ 'class': `flex flex-center-y px-20 py-15 m-0 bg-t-1` }",[e.TempleRegistry.createText(`
+  `,!1),...t!=="/temple/index.html"&&t!=="/temple/500.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-bars cursor-pointer py-5 pr-10 none md-inline-block tx-t-1",click:n},"{ 'class': `fas fa-fw fa-bars cursor-pointer py-5 pr-10 none md-inline-block tx-t-1`, 'click': toggle }",[]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("div",{class:"flex-grow"},"{ 'class': `flex-grow` }",[]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{href:"/temple"},"{ 'href': `/temple` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("img",{alt:"Temple Logo",class:"h-26 mr-10",src:"/temple/temple-icon.png"},"{ 'alt': `Temple Logo`, 'class': `h-26 mr-10`, 'src': `/temple/temple-icon.png` }"),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("h3",{class:"flex-grow tx-uppercase"},"{ 'class': `flex-grow tx-uppercase` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple"},"{ 'class': `tx-white`, 'href': `/temple` }",[e.TempleRegistry.createText("Temple",!1)]),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{class:"npm",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-npm text-white"},[]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("nav",{class:"flex flex-center-y"},"{ 'class': `flex flex-center-y` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple/docs/index.html"},"{ 'class': `tx-white`, 'href': `/temple/docs/index.html` }",[e.TempleRegistry.createText("Docs",!1)]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"tx-t-1 tx-5xl ml-10",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},"{ 'class': `tx-t-1 tx-5xl ml-10`, 'href': `https://github.com/OSSPhilippines/temple`, 'target': `_blank` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-github"},"{ 'class': `fab fa-github` }",[]),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{class:"discord",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-discord text-white"},[]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"bg-h-cb3837 pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},"{ 'class': `bg-h-cb3837 pill tx-t-1 tx-lg ml-5 p-5 tx-center`, 'href': `https://www.npmjs.com/package/@ossph/temple`, 'target': `_blank` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-npm text-white"},"{ 'class': `fab fa-npm text-white` }",[]),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"bg-h-7289da pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},"{ 'class': `bg-h-7289da pill tx-t-1 tx-lg ml-5 p-5 tx-center`, 'href': `https://discord.gg/open-source-software-ph-905496362982981723`, 'target': `_blank` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-discord text-white"},"{ 'class': `fab fa-discord text-white` }",[]),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]),e.TempleRegistry.createText(`
+`,!1)])]),e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("panel-left",{},"{ }",[e.TempleRegistry.createElement("header",{class:"flex flex-center-y bg-t-2 py-15 pr-5 pl-10"},"{ 'class': `flex flex-center-y bg-t-2 py-15 pr-5 pl-10` }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("a",{href:"/temple"},"{ 'href': `/temple` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("img",{class:"h-26 mr-10",src:"/temple/temple-icon.png",alt:"Temple Logo"},"{ 'class': `h-26 mr-10`, 'src': `/temple/temple-icon.png`, 'alt': `Temple Logo` }"),e.TempleRegistry.createText(`
   `,!1)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("h3",{class:"flex-grow m-0 tx-uppercase"},"{ 'class': `flex-grow m-0 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple"},"{ 'class': `tx-white`, 'href': `/temple` }",[e.TempleRegistry.createText("Temple",!1)]),e.TempleRegistry.createText(`
+  `,!1)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-left cursor-pointer none md-inline-block",click:n},"{ 'class': `fas fa-fw fa-chevron-left cursor-pointer none md-inline-block`, 'click': toggle }",[]),e.TempleRegistry.createText(`
 `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("aside",{class:"left panel-left"},[e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("header",{},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("img",{src:"/temple/temple-icon.png",alt:"Temple Logo"}),e.TempleRegistry.createText(`
-    `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("h3",{},[e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple"},[e.TempleRegistry.createText("Temple",!1)])]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("i",{class:"toggle fas fa-fw fa-chevron-left",click:n},[]),e.TempleRegistry.createText(`
+`,!1),e.TempleRegistry.createElement("nav",{class:"bg-t-1 scroll-auto h-calc-full-60"},"{ 'class': `bg-t-1 scroll-auto h-calc-full-60` }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("h6",{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-0 pt-20 pb-10 pl-10 tx-uppercase"},"{ 'class': `bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-0 pt-20 pb-10 pl-10 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),...this._toNodeList(c("Introduction")),e.TempleRegistry.createText(`
   `,!1)]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("nav",{},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("h6",{},[e.TempleRegistry.createText("Introduction",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/index.html"},[e.TempleRegistry.createText("Documentation",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/getting-started.html"},[e.TempleRegistry.createText("Getting Started",!1)]),e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/index.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/index.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/index.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("Documentation")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/index.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/index.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("Documentation")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/getting-started.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/getting-started.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/getting-started.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("Getting Started")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/getting-started.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/getting-started.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("Getting Started")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
 
-    `,!1),e.TempleRegistry.createElement("h6",{},[e.TempleRegistry.createText("Features",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/markup-syntax.html"},[e.TempleRegistry.createText("Markup Syntax",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/state-management.html"},[e.TempleRegistry.createText("State Management",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/component-strategy.html"},[e.TempleRegistry.createText("Component Strategy",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/compiler-api.html"},[e.TempleRegistry.createText("Compiler API",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/client-api.html"},[e.TempleRegistry.createText("Client API",!1)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("h6",{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},"{ 'class': `bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),...this._toNodeList(c("Features")),e.TempleRegistry.createText(`
+  `,!1)]),e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/markup-syntax.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/markup-syntax.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/markup-syntax.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("Markup Syntax")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/markup-syntax.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/markup-syntax.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("Markup Syntax")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/state-management.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/state-management.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/state-management.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("State Management")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/state-management.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/state-management.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("State Management")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/component-strategy.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/component-strategy.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/component-strategy.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("Component Strategy")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-strategy.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/component-strategy.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("Component Strategy")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/compiler-api.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/compiler-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/compiler-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("Compiler API")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/compiler-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/compiler-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("Compiler API")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/client-api.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/client-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/client-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("Client API")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/client-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/client-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("Client API")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
 
-    `,!1),e.TempleRegistry.createElement("h6",{},[e.TempleRegistry.createText("Usage",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/template-engine.html"},[e.TempleRegistry.createText("Template Engine",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/single-page.html"},[e.TempleRegistry.createText("Single Page App",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/static-site.html"},[e.TempleRegistry.createText("Static Site Generator",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/component-publisher.html"},[e.TempleRegistry.createText("Component Publisher",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/developer-tools.html"},[e.TempleRegistry.createText("Developer Tools",!1)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("h6",{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},"{ 'class': `bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),...this._toNodeList(c("Usage")),e.TempleRegistry.createText(`
   `,!1)]),e.TempleRegistry.createText(`
-`,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("panel-main",{class:"panel-main"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("div",{class:"docs container"},[e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("h1",{},[...this._toNodeList(x("Developer Tools"))]),e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/template-engine.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/template-engine.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/template-engine.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("Template Engine")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/template-engine.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/template-engine.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("Template Engine")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/single-page.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/single-page.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/single-page.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("Single Page App")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/single-page.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/single-page.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("Single Page App")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/static-site.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/static-site.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/static-site.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("Static Site Generator")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/static-site.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/static-site.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("Static Site Generator")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/component-publisher.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/component-publisher.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/component-publisher.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("Component Publisher")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-publisher.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/component-publisher.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("Component Publisher")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/developer-tools.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold mb-100",href:"/temple/docs/developer-tools.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold mb-100`, 'href': `/temple/docs/developer-tools.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("Developer Tools")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 mb-100",href:"/temple/docs/developer-tools.html"},"{ 'class': `block tx-t-1 py-10 pl-10 mb-100`, 'href': `/temple/docs/developer-tools.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("Developer Tools")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+`,!1)])]),e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("panel-main",{},"{ }",[e.TempleRegistry.createText(`
+        `,!1),e.TempleRegistry.createElement("api-docs",{},"{ }",[e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("h1",{class:"tx-primary tx-uppercase tx-30 py-20"},"{ 'class': `tx-primary tx-uppercase tx-30 py-20` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(c("Developer Tools")),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Temple provides a separate package for a better development 
-          experience when working with server frameworks that utilize 
-          the native http module. Start by installing adding 
-          `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},[...this._toNodeList("'@ossph/temple-dev'")]),e.TempleRegistry.createText(`
-          to your project.
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("ide-app",{title:"Terminal"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("ide-code",{lang:"bash"},[e.TempleRegistry.createText(`
-            npm install --save-dev @ossph/temple-dev
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            Temple provides a separate package for a better development 
+            experience when working with server frameworks that utilize 
+            the native http module. Start by installing adding 
+            `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},"{ 'lang': `js`, 'inline': true }",[...this._toNodeList("@ossph/temple-dev")]),e.TempleRegistry.createText(`
+            to your project.
           `,!1)]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Next, import the `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},[...this._toNodeList("dev()")]),e.TempleRegistry.createText(` 
-          function from the package and use it in your existing 
-          `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},[...this._toNodeList("'src/index.ts'")]),e.TempleRegistry.createText(` 
-          file to create a development server as shown in the example below.
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("ide-app",{title:"src/index.ts"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",numbers:!0,trim:!0,detab:12},[...this._toNodeList(`
-            import http from 'http';
-            import temple from '@ossph/temple/compiler';
-            import { dev } from '@ossph/temple-dev';
+          `,!1),e.TempleRegistry.createElement("ide-app",{title:"Terminal",class:"py-20"},"{ 'title': `Terminal`, 'class': `py-20` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("ide-code",{lang:"bash"},"{ 'lang': `bash` }",[e.TempleRegistry.createText(`
+              npm install --save-dev @ossph/temple-dev
+            `,!1)]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            Next, import the `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},"{ 'lang': `js`, 'inline': true }",[...this._toNodeList("dev()")]),e.TempleRegistry.createText(` 
+            function from the package and use it in your existing 
+            `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},"{ 'lang': `js`, 'inline': true }",[...this._toNodeList("src/index.ts")]),e.TempleRegistry.createText(` 
+            file to create a development server as shown in the example below.
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("ide-app",{title:"src/index.ts",class:"py-20"},"{ 'title': `src/index.ts`, 'class': `py-20` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",numbers:!0,trim:!0,detab:12},"{ 'lang': `js`, 'numbers': true, 'trim': true, 'detab': 12 }",[...this._toNodeList(`
+              import http from 'http';
+              import temple from '@ossph/temple/compiler';
+              import { dev } from '@ossph/temple-dev';
 
-            //create temple compiler
-            const compiler = temple({ cwd: __dirname });
-            //1. create dev tools
-            const { router, refresh } = dev({ cwd: __dirname });
+              //create temple compiler
+              const compiler = temple({ cwd: __dirname });
+              //1. create dev tools
+              const { router, refresh } = dev({ cwd: __dirname });
 
-            //create http server
-            const server = http.createServer(async (req, res) => {
-              //2. Add dev router
-              if (router(req, res)) return;
-              //if home page
-              if (req.url === '/') {
-                //3. sync builder with refresh server
-                refresh.sync(compiler.fromSource('./page.dtml'));
-                //compile the document
-                const html = await compiler.render('./page.dtml');
-                //... send response ...
-              }
-              //... other routes ...
-            });
-            //listen on port 3000
-            server.listen(3000);
-          `)]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Lastly, update the document file 
-          `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},[...this._toNodeList("'src/page.dtml'")]),e.TempleRegistry.createText(` 
-          to include the development script 
-          `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList('')]),e.TempleRegistry.createText(` 
-          as shown below.
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("ide-app",{title:"src/page.dtml"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("ide-code",{numbers:!0,trim:!0,detab:12},[...this._toNodeList(`
-            
-            
-              
-                
-                
-                
-              
-              
-                
-              
-            
-          `)]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Run the following command in terminal.
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("ide-app",{title:"Terminal"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("ide-code",{lang:"bash"},[e.TempleRegistry.createText(`
-            npx ts-node src/index.ts
+              //create http server
+              const server = http.createServer(async (req, res) => {
+                //2. Add dev router
+                if (router(req, res)) return;
+                //if home page
+                if (req.url === '/') {
+                  //3. sync builder with refresh server
+                  refresh.sync(compiler.fromSource('./page.dtml'));
+                  //compile the document
+                  const html = await compiler.render('./page.dtml');
+                  //... send response ...
+                }
+                //... other routes ...
+              });
+              //listen on port 3000
+              server.listen(3000);
+            `)]),e.TempleRegistry.createText(`
           `,!1)]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Whenever `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},[...this._toNodeList("'src/page.dtml'")]),e.TempleRegistry.createText(` 
-          is updated, the development server will automatically refresh 
-          the page. Components will also be updated in real-time.
-        `,!1)]),e.TempleRegistry.createText(`
-        
-        `,!1),e.TempleRegistry.createElement("nav",{class:"pager"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("a",{class:"prev",href:"/temple/docs/component-publisher.html"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-left"},[]),e.TempleRegistry.createText(`
-            `,!1),...this._toNodeList(x("Component Publisher")),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            Lastly, update the document file 
+            `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},"{ 'lang': `js`, 'inline': true }",[...this._toNodeList("src/page.dtml")]),e.TempleRegistry.createText(` 
+            to include the development script 
+            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[...this._toNodeList('')]),e.TempleRegistry.createText(` 
+            as shown below.
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("ide-app",{title:"src/page.dtml",class:"py-20"},"{ 'title': `src/page.dtml`, 'class': `py-20` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("ide-code",{numbers:!0,trim:!0,detab:12},"{ 'numbers': true, 'trim': true, 'detab': 12 }",[...this._toNodeList(`
+              
+              
+                
+                  
+                  
+                  
+                
+                
+                  
+                
+              
+            `)]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            Run the following command in terminal.
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("ide-app",{title:"Terminal",class:"py-20"},"{ 'title': `Terminal`, 'class': `py-20` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("ide-code",{lang:"bash"},"{ 'lang': `bash` }",[e.TempleRegistry.createText(`
+              npx ts-node src/index.ts
+            `,!1)]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            Whenever `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},"{ 'lang': `js`, 'inline': true }",[...this._toNodeList("src/page.dtml")]),e.TempleRegistry.createText(` 
+            is updated, the development server will automatically refresh 
+            the page. Components will also be updated in real-time.
+          `,!1)]),e.TempleRegistry.createText(`
+          
+          `,!1),e.TempleRegistry.createElement("nav",{class:"flex"},"{ 'class': `flex` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"tx-primary py-40",href:"/temple/docs/component-publisher.html"},"{ 'class': `tx-primary py-40`, 'href': `/temple/docs/component-publisher.html` }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-left tx-t-1"},"{ 'class': `fas fa-fw fa-chevron-left tx-t-1` }",[]),e.TempleRegistry.createText(`
+              `,!1),...this._toNodeList(c("Component Publisher")),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
           `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("footer",{class:"foot"},"{ 'class': `foot` }",[]),e.TempleRegistry.createText(`
         `,!1)]),e.TempleRegistry.createText(`
       `,!1)]),e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("footer",{class:"foot"},[]),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
   `,!1)]),e.TempleRegistry.createText(`
-`,!1)])]}};return ne(We);})();
+`,!1)])]}};return se(Se);})();
diff --git a/docs/build/server/1bf701a55aaad047771e.js b/docs/build/server/1bf701a55aaad047771e.js
index 9b14ebc..7149708 100644
--- a/docs/build/server/1bf701a55aaad047771e.js
+++ b/docs/build/server/1bf701a55aaad047771e.js
@@ -1,137 +1,247 @@
-var TempleAPI=(()=>{var ee=Object.create;var b=Object.defineProperty;var te=Object.getOwnPropertyDescriptor;var ae=Object.getOwnPropertyNames;var re=Object.getPrototypeOf,se=Object.prototype.hasOwnProperty;var c=(a,t)=>()=>(t||a((t={exports:{}}).exports,t),t.exports),le=(a,t)=>{for(var r in t)b(a,r,{get:t[r],enumerable:!0})},F=(a,t,r,s)=>{if(t&&typeof t=="object"||typeof t=="function")for(let n of ae(t))!se.call(a,n)&&n!==r&&b(a,n,{get:()=>t[n],enumerable:!(s=te(t,n))||s.enumerable});return a};var G=(a,t,r)=>(r=a!=null?ee(re(a)):{},F(t||!a||!a.__esModule?b(r,"default",{value:a,enumerable:!0}):r,a)),ne=a=>F(b({},"__esModule",{value:!0}),a);var P=c(D=>{"use strict";Object.defineProperty(D,"__esModule",{value:!0});var j=class extends Error{static for(t,...r){return r.forEach(function(s){t=t.replace("%s",s)}),new this(t)}static forErrorsFound(t){let r=new this("Invalid Parameters");return r.errors=t,r}static require(t,r,...s){if(!t){for(let n of s)r=r.replace("%s",n);throw new this(r)}}constructor(t,r=500){super(),this.errors={},this.start=0,this.end=0,this.message=t,this.name=this.constructor.name,this.code=r}withCode(t){return this.code=t,this}withPosition(t,r){return this.start=t,this.end=r,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};D.default=j});var S=c(M=>{"use strict";Object.defineProperty(M,"__esModule",{value:!0});var O=class{constructor(t=[]){this._elements=new Set,t.forEach(r=>this._elements.add(r))}add(t){this._elements.add(t)}toArray(){return Array.from(this._elements)}toString(){return Array.from(this._elements).filter(Boolean).map(t=>t.toString()).join("")}};M.default=O});var u=c(q=>{"use strict";Object.defineProperty(q,"__esModule",{value:!0});var ce=new Map;q.default=ce});var E=c(m=>{"use strict";var ie=m&&m.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(m,"__esModule",{value:!0});var oe=ie(S()),fe=["area","base","br","col","embed","hr","img","input","link","meta","param","source","track","wbr"],L=class{static render(t){return t.filter(Boolean).map(r=>r.toString()).join("")}get name(){return this._name}get attributes(){return this._attributes}get children(){return this._children}constructor(t,r={},s=[]){this._attributes={},this._name=t,this._attributes=r,this._children=new oe.default(s)}toString(){let t=Object.entries(this._attributes),r=t.length>0?" "+t.map(([n,f])=>{if(typeof f=="string")return`${n}="${f}"`;if(typeof f=="boolean")return f?n:""}).join(" "):"";if(fe.includes(this._name))return`<${this._name}${r} />`;let s=this._children.toString();return`<${this._name}${r}>${s}`}};m.default=L});var I=c(k=>{"use strict";Object.defineProperty(k,"__esModule",{value:!0});var A=class{get value(){return this._escape?this._value.replace(/&/g,"&").replace(//g,">"):this._value}constructor(t,r=!1){this._escape=r,this._value=t}toString(){return this.value}};k.default=A});var N=c(p=>{"use strict";var W=p&&p.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(p,"__esModule",{value:!0});var ue=W(I()),me=W(E()),C=class{static createElement(t,r,s=[]){return new me.default(t,r,s)}static createText(t,r=!0){return new ue.default(t,r)}};p.default=C});var J=c(d=>{"use strict";var y=d&&d.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(d,"__esModule",{value:!0});var pe=y(P()),$=y(u()),de=y(E()),he=y(N()),B=class{render(t={}){$.default.set("props",t||{}),$.default.set("env",Object.assign(Object.assign({},process.env||{}),{BUILD_ID:this.id(),APP_DATA:btoa(JSON.stringify(Object.assign(Object.assign({},Object.fromEntries($.default.entries())),{env:Object.assign(Object.assign({},Object.fromEntries(Object.entries(process.env||{}).filter(n=>n[0].startsWith("PUBLIC_")))),{BUILD_ID:this.id()})})))}));let r=this.template(),s=de.default.render(r).trim();if(!s.toLowerCase().startsWith(" tag.");return`
-${s}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:Array.isArray(t)&&t.every(r=>typeof r=="object"&&typeof r.nodeType=="number")?t:[he.default.createText(String(t))]}};d.default=B});var Y=c(h=>{"use strict";Object.defineProperty(h,"__esModule",{value:!0});h.TempleEmitter=void 0;var v=class{emit(t,r){return this}on(t,r){return this}once(t,r){return this}unbind(t,r){return this}};h.TempleEmitter=v;var Te=new v;h.default=Te});var V=c(T=>{"use strict";var xe=T&&T.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(T,"__esModule",{value:!0});var ge=xe(u());function _e(a){let t=ge.default.get("env")||{};return a?t[a]||null:t}T.default=_e});var U=c(x=>{"use strict";var be=x&&x.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(x,"__esModule",{value:!0});x.default=ye;var Ee=be(u());function ye(){return Ee.default.get("props")||{}}});var z=c(g=>{"use strict";var ve=g&&g.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(g,"__esModule",{value:!0});g.default=je;var we=ve(U());function je(){return(0,we.default)().class}});var K=c(H=>{"use strict";Object.defineProperty(H,"__esModule",{value:!0});H.default=De;function De(a){let t={getter:()=>r.raw,setter:s=>s},r={raw:a,getter(s){return t.getter=s,r},setter(s){return t.setter=s,r}};return Object.defineProperty(r,"value",{get(){return t.getter()},set(s){r.raw=t.setter(s)}}),r}});var X=c(l=>{"use strict";var Pe=l&&l.__createBinding||(Object.create?function(a,t,r,s){s===void 0&&(s=r);var n=Object.getOwnPropertyDescriptor(t,r);(!n||("get"in n?!t.__esModule:n.writable||n.configurable))&&(n={enumerable:!0,get:function(){return t[r]}}),Object.defineProperty(a,s,n)}:function(a,t,r,s){s===void 0&&(s=r),a[s]=t[r]}),Oe=l&&l.__setModuleDefault||(Object.create?function(a,t){Object.defineProperty(a,"default",{enumerable:!0,value:t})}:function(a,t){a.default=t}),Me=l&&l.__importStar||function(a){if(a&&a.__esModule)return a;var t={};if(a!=null)for(var r in a)r!=="default"&&Object.prototype.hasOwnProperty.call(a,r)&&Pe(t,a,r);return Oe(t,a),t},i=l&&l.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(l,"__esModule",{value:!0});l.TempleText=l.TempleException=l.TempleEmitter=l.TempleElement=l.TempleRegistry=l.TempleDocument=l.TempleCollection=l.signal=l.classnames=l.props=l.emitter=l.env=l.data=void 0;var Se=i(P());l.TempleException=Se.default;var qe=i(S());l.TempleCollection=qe.default;var Le=i(J());l.TempleDocument=Le.default;var Ae=i(N());l.TempleRegistry=Ae.default;var ke=i(E());l.TempleElement=ke.default;var Q=Me(Y());l.emitter=Q.default;Object.defineProperty(l,"TempleEmitter",{enumerable:!0,get:function(){return Q.TempleEmitter}});var Ie=i(I());l.TempleText=Ie.default;var Ce=i(u());l.data=Ce.default;var Ne=i(V());l.env=Ne.default;var $e=i(U());l.props=$e.default;var Be=i(z());l.classnames=Be.default;var Ue=i(K());l.signal=Ue.default});var R=c((rt,Z)=>{Z.exports={...X()}});var Re={};le(Re,{default:()=>w});var e=G(R()),_=G(R());var o=function(a,...t){let r=He(a);for(let s=0;s{document.body.classList.toggle("panel-left-open")};return[e.TempleRegistry.createText(`
-`,!1),e.TempleRegistry.createElement("html",{},[e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("head",{},[e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{charset:"utf-8"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"viewport",content:"width=device-width, initial-scale=1"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("title",{},[...this._toNodeList(r)]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"description",content:s}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:title",content:r}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:description",content:s}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:image",content:"https://ossphilippines.github.io/temple/temple-logo.png"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:url",content:`https://ossphilippines.github.io/temple${t}`}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:type",content:"website"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:card",content:"summary"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:site",content:"@OSSPhilippines"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:title",content:r}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:description",content:s}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:image",content:"https://ossphilippines.github.io/temple/temple-logo.png"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"favicon",href:"/temple/favicon.ico"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"shortcut icon",type:"image/png",href:"/temple/favicon.png"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/fontawesome/all.css"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/theme.css"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:`/temple/build/client/${(0,_.env)("BUILD_ID")}.css`}),e.TempleRegistry.createText(`
+var TempleAPI=(()=>{var X=Object.create;var g=Object.defineProperty;var Z=Object.getOwnPropertyDescriptor;var ee=Object.getOwnPropertyNames;var te=Object.getPrototypeOf,ae=Object.prototype.hasOwnProperty;var n=(a,t)=>()=>(t||a((t={exports:{}}).exports,t),t.exports),le=(a,t)=>{for(var l in t)g(a,l,{get:t[l],enumerable:!0})},H=(a,t,l,s)=>{if(t&&typeof t=="object"||typeof t=="function")for(let i of ee(t))!ae.call(a,i)&&i!==l&&g(a,i,{get:()=>t[i],enumerable:!(s=Z(t,i))||s.enumerable});return a};var G=(a,t,l)=>(l=a!=null?X(te(a)):{},H(t||!a||!a.__esModule?g(l,"default",{value:a,enumerable:!0}):l,a)),se=a=>H(g({},"__esModule",{value:!0}),a);var w=n(v=>{"use strict";Object.defineProperty(v,"__esModule",{value:!0});var E=class extends Error{static for(t,...l){return l.forEach(function(s){t=t.replace("%s",s)}),new this(t)}static forErrorsFound(t){let l=new this("Invalid Parameters");return l.errors=t,l}static require(t,l,...s){if(!t){for(let i of s)l=l.replace("%s",i);throw new this(l)}}constructor(t,l=500){super(),this.errors={},this.start=0,this.end=0,this.message=t,this.name=this.constructor.name,this.code=l}withCode(t){return this.code=t,this}withPosition(t,l){return this.start=t,this.end=l,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};v.default=E});var L=n(j=>{"use strict";Object.defineProperty(j,"__esModule",{value:!0});var k=class{get length(){return this._elements.size}constructor(t=[]){this._elements=new Set,t.forEach(l=>this._elements.add(l))}add(t){this._elements.add(t)}toArray(){return Array.from(this._elements)}toString(){return Array.from(this._elements).filter(Boolean).map(t=>t.toString()).join("")}};j.default=k});var p=n(D=>{"use strict";Object.defineProperty(D,"__esModule",{value:!0});var re=new Map;D.default=re});var N=n(S=>{"use strict";Object.defineProperty(S,"__esModule",{value:!0});var P=class{get value(){return this._escape?this._value.replace(/&/g,"&").replace(//g,">"):this._value}constructor(t,l=!1){this._escape=l,this._value=t}toString(){return this.value}};S.default=P});var M=n(f=>{"use strict";var ce=f&&f.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(f,"__esModule",{value:!0});var ie=ce(L()),ne=["area","base","br","col","embed","hr","img","input","link","meta","param","source","track","wbr"],O=class{get attributes(){return this._attributes}get children(){return this._children}get name(){return this._name}get props(){return this._props}constructor(t,l={},s="",i=[]){this._attributes={},this._name=t,this._attributes=l,this._props=s,this._children=new ie.default(i)}toString(){let t=Object.entries(this._attributes),l=t.length>0?" "+t.map(([i,T])=>{if(typeof T=="string")return`${i}="${T}"`;if(typeof T=="boolean")return T?i:""}).join(" "):"";if(ne.includes(this._name))return`<${this._name}${l} />`;let s=this._children.toString();return`<${this._name}${l}>${s}`}};f.default=O});var q=n(m=>{"use strict";var F=m&&m.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(m,"__esModule",{value:!0});var oe=F(N()),R=F(M()),A=class{static render(t){return t.filter(Boolean).map(l=>l.toString()).join("")}static registry(t,l=new Set){return t.forEach(s=>{s instanceof R.default&&(["html","head","body"].includes(s.name)||l.add(s),s.name!=="head"&&s.children.length>0&&this.registry(s.children.toArray(),l))}),l}static createElement(t,l,s,i=[]){return new R.default(t,l,s,i)}static createText(t,l=!0){return new oe.default(t,l)}};m.default=A});var W=n(x=>{"use strict";var B=x&&x.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(x,"__esModule",{value:!0});var pe=B(w()),I=B(p()),$=B(q()),C=class{bindings(){let t=$.default.registry(this.template());return`{ ${Array.from(t.values()).map((s,i)=>s.props!=="{ }"?`'${i}': ${s.props}`:"").filter(s=>s!=="").join(", ")} }`}render(t={}){I.default.set("props",t||{}),I.default.set("env",Object.assign(Object.assign({},process.env||{}),{BUILD_ID:this.id(),APP_DATA:btoa(JSON.stringify(Object.assign(Object.assign({},Object.fromEntries(I.default.entries())),{env:Object.assign(Object.assign({},Object.fromEntries(Object.entries(process.env||{}).filter(i=>i[0].startsWith("PUBLIC_")))),{BUILD_ID:this.id()})})))}));let l=this.template(),s=$.default.render(l).trim();if(!s.toLowerCase().startsWith(" tag.");return`
+${s}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:Array.isArray(t)&&t.every(l=>typeof l=="object"&&typeof l.nodeType=="number")?t:[$.default.createText(String(t))]}};x.default=C});var J=n(d=>{"use strict";Object.defineProperty(d,"__esModule",{value:!0});d.TempleEmitter=void 0;var y=class{emit(t,l){return this}on(t,l){return this}once(t,l){return this}unbind(t,l){return this}};d.TempleEmitter=y;var fe=new y;d.default=fe});var Y=n(u=>{"use strict";var me=u&&u.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(u,"__esModule",{value:!0});var xe=me(p());function de(a){let t=xe.default.get("env")||{};return a?t[a]||null:t}u.default=de});var z=n(h=>{"use strict";var ue=h&&h.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(h,"__esModule",{value:!0});h.default=be;var he=ue(p());function be(){return he.default.get("props")||{}}});var K=n(c=>{"use strict";var Te=c&&c.__createBinding||(Object.create?function(a,t,l,s){s===void 0&&(s=l);var i=Object.getOwnPropertyDescriptor(t,l);(!i||("get"in i?!t.__esModule:i.writable||i.configurable))&&(i={enumerable:!0,get:function(){return t[l]}}),Object.defineProperty(a,s,i)}:function(a,t,l,s){s===void 0&&(s=l),a[s]=t[l]}),ge=c&&c.__setModuleDefault||(Object.create?function(a,t){Object.defineProperty(a,"default",{enumerable:!0,value:t})}:function(a,t){a.default=t}),ye=c&&c.__importStar||function(a){if(a&&a.__esModule)return a;var t={};if(a!=null)for(var l in a)l!=="default"&&Object.prototype.hasOwnProperty.call(a,l)&&Te(t,a,l);return ge(t,a),t},o=c&&c.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(c,"__esModule",{value:!0});c.TempleText=c.TempleException=c.TempleEmitter=c.TempleElement=c.TempleRegistry=c.TempleDocument=c.TempleCollection=c.props=c.emitter=c.env=c.data=void 0;var _e=o(w());c.TempleException=_e.default;var Ee=o(L());c.TempleCollection=Ee.default;var ve=o(W());c.TempleDocument=ve.default;var we=o(q());c.TempleRegistry=we.default;var ke=o(M());c.TempleElement=ke.default;var V=ye(J());c.emitter=V.default;Object.defineProperty(c,"TempleEmitter",{enumerable:!0,get:function(){return V.TempleEmitter}});var je=o(N());c.TempleText=je.default;var Le=o(p());c.data=Le.default;var De=o(Y());c.env=De.default;var Pe=o(z());c.props=Pe.default});var U=n((Fe,Q)=>{Q.exports={...K()}});var Ne={};le(Ne,{default:()=>_});var e=G(U()),b=G(U());var r=function(a,...t){let l=Se(a);for(let s=0;s{document.getElementsByTagName("panel-layout")[0].toggle("left")};return[e.TempleRegistry.createText(`
+`,!1),e.TempleRegistry.createElement("html",{},"{ }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("head",{},"{ }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{charset:"utf-8"},"{ 'charset': `utf-8` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"viewport",content:"width=device-width, initial-scale=1"},"{ 'name': `viewport`, 'content': `width=device-width, initial-scale=1` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("title",{},"{ }",[...this._toNodeList(l)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"description",content:s},"{ 'name': `description`, 'content': description }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:title",content:l},"{ 'property': `og:title`, 'content': title }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:description",content:s},"{ 'property': `og:description`, 'content': description }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:image",content:"https://ossphilippines.github.io/temple/temple-logo.png"},"{ 'property': `og:image`, 'content': `https://ossphilippines.github.io/temple/temple-logo.png` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:url",content:`https://ossphilippines.github.io/temple${t}`},"{ 'property': `og:url`, 'content': `https://ossphilippines.github.io/temple${url}` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:type",content:"website"},"{ 'property': `og:type`, 'content': `website` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:card",content:"summary"},"{ 'name': `twitter:card`, 'content': `summary` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:site",content:"@OSSPhilippines"},"{ 'name': `twitter:site`, 'content': `@OSSPhilippines` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:title",content:l},"{ 'name': `twitter:title`, 'content': title }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:description",content:s},"{ 'name': `twitter:description`, 'content': description }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:image",content:"https://ossphilippines.github.io/temple/temple-logo.png"},"{ 'name': `twitter:image`, 'content': `https://ossphilippines.github.io/temple/temple-logo.png` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"favicon",href:"/temple/favicon.ico"},"{ 'rel': `favicon`, 'href': `/temple/favicon.ico` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"shortcut icon",type:"image/png",href:"/temple/favicon.png"},"{ 'rel': `shortcut icon`, 'type': `image/png`, 'href': `/temple/favicon.png` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/fontawesome/all.css"},"{ 'rel': `stylesheet`, 'type': `text/css`, 'href': `/temple/styles/fontawesome/all.css` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/global.css"},"{ 'rel': `stylesheet`, 'type': `text/css`, 'href': `/temple/styles/global.css` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:`/temple/build/client/${(0,b.env)("BUILD_ID")}.css`},"{ 'rel': `stylesheet`, 'type': `text/css`, 'href': `/temple/build/client/${env('BUILD_ID')}.css` }"),e.TempleRegistry.createText(`
   
-  `,!1),e.TempleRegistry.createElement("script",{"data-app":(0,_.env)("APP_DATA"),src:`/temple/build/client/${(0,_.env)("BUILD_ID")}.js`}),e.TempleRegistry.createText(`
-  `,!1),...(0,_.env)("NODE_ENV")==="development"?[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("script",{src:"/dev.js"}),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("script",{"data-app":(0,b.env)("APP_DATA"),src:`/temple/build/client/${(0,b.env)("BUILD_ID")}.js`},"{ 'data-app': env('APP_DATA'), 'src': `/temple/build/client/${env('BUILD_ID')}.js` }"),e.TempleRegistry.createText(`
+  `,!1),...(0,b.env)("NODE_ENV")==="development"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("script",{src:"/dev.js"},"{ 'src': `/dev.js` }"),e.TempleRegistry.createText(`
   `,!1)]:[],e.TempleRegistry.createText(`
 `,!1)]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("body",{class:"dark panel with-head with-left"},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("header",{class:"head panel-head"},[e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("i",{class:"menu fas fa-fw fa-bars",click:n},[]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("a",{href:"/temple"},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("img",{src:"/temple/temple-icon.png",alt:"Temple Logo"}),e.TempleRegistry.createText(`
-  `,!1)]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("h3",{},[e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple"},[e.TempleRegistry.createText("Temple",!1)])]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("nav",{},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple/docs/index.html"},[e.TempleRegistry.createText("Docs",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{class:"github",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-github"},[]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("body",{class:"dark bg-t-0 tx-t1 arial"},"{ 'class': `dark bg-t-0 tx-t1 arial` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("panel-layout",{},"{ }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("panel-head",{},"{ }",[e.TempleRegistry.createElement("menu",{class:"flex flex-center-y px-20 py-15 m-0 bg-t-1"},"{ 'class': `flex flex-center-y px-20 py-15 m-0 bg-t-1` }",[e.TempleRegistry.createText(`
+  `,!1),...t!=="/temple/index.html"&&t!=="/temple/500.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-bars cursor-pointer py-5 pr-10 none md-inline-block tx-t-1",click:i},"{ 'class': `fas fa-fw fa-bars cursor-pointer py-5 pr-10 none md-inline-block tx-t-1`, 'click': toggle }",[]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("div",{class:"flex-grow"},"{ 'class': `flex-grow` }",[]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{href:"/temple"},"{ 'href': `/temple` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("img",{alt:"Temple Logo",class:"h-26 mr-10",src:"/temple/temple-icon.png"},"{ 'alt': `Temple Logo`, 'class': `h-26 mr-10`, 'src': `/temple/temple-icon.png` }"),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("h3",{class:"flex-grow tx-uppercase"},"{ 'class': `flex-grow tx-uppercase` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple"},"{ 'class': `tx-white`, 'href': `/temple` }",[e.TempleRegistry.createText("Temple",!1)]),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{class:"npm",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-npm text-white"},[]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("nav",{class:"flex flex-center-y"},"{ 'class': `flex flex-center-y` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple/docs/index.html"},"{ 'class': `tx-white`, 'href': `/temple/docs/index.html` }",[e.TempleRegistry.createText("Docs",!1)]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"tx-t-1 tx-5xl ml-10",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},"{ 'class': `tx-t-1 tx-5xl ml-10`, 'href': `https://github.com/OSSPhilippines/temple`, 'target': `_blank` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-github"},"{ 'class': `fab fa-github` }",[]),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{class:"discord",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-discord text-white"},[]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"bg-h-cb3837 pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},"{ 'class': `bg-h-cb3837 pill tx-t-1 tx-lg ml-5 p-5 tx-center`, 'href': `https://www.npmjs.com/package/@ossph/temple`, 'target': `_blank` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-npm text-white"},"{ 'class': `fab fa-npm text-white` }",[]),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"bg-h-7289da pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},"{ 'class': `bg-h-7289da pill tx-t-1 tx-lg ml-5 p-5 tx-center`, 'href': `https://discord.gg/open-source-software-ph-905496362982981723`, 'target': `_blank` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-discord text-white"},"{ 'class': `fab fa-discord text-white` }",[]),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]),e.TempleRegistry.createText(`
+`,!1)])]),e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("panel-left",{},"{ }",[e.TempleRegistry.createElement("header",{class:"flex flex-center-y bg-t-2 py-15 pr-5 pl-10"},"{ 'class': `flex flex-center-y bg-t-2 py-15 pr-5 pl-10` }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("a",{href:"/temple"},"{ 'href': `/temple` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("img",{class:"h-26 mr-10",src:"/temple/temple-icon.png",alt:"Temple Logo"},"{ 'class': `h-26 mr-10`, 'src': `/temple/temple-icon.png`, 'alt': `Temple Logo` }"),e.TempleRegistry.createText(`
   `,!1)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("h3",{class:"flex-grow m-0 tx-uppercase"},"{ 'class': `flex-grow m-0 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple"},"{ 'class': `tx-white`, 'href': `/temple` }",[e.TempleRegistry.createText("Temple",!1)]),e.TempleRegistry.createText(`
+  `,!1)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-left cursor-pointer none md-inline-block",click:i},"{ 'class': `fas fa-fw fa-chevron-left cursor-pointer none md-inline-block`, 'click': toggle }",[]),e.TempleRegistry.createText(`
 `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("aside",{class:"left panel-left"},[e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("header",{},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("img",{src:"/temple/temple-icon.png",alt:"Temple Logo"}),e.TempleRegistry.createText(`
-    `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("h3",{},[e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple"},[e.TempleRegistry.createText("Temple",!1)])]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("i",{class:"toggle fas fa-fw fa-chevron-left",click:n},[]),e.TempleRegistry.createText(`
+`,!1),e.TempleRegistry.createElement("nav",{class:"bg-t-1 scroll-auto h-calc-full-60"},"{ 'class': `bg-t-1 scroll-auto h-calc-full-60` }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("h6",{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-0 pt-20 pb-10 pl-10 tx-uppercase"},"{ 'class': `bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-0 pt-20 pb-10 pl-10 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),...this._toNodeList(r("Introduction")),e.TempleRegistry.createText(`
   `,!1)]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("nav",{},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("h6",{},[e.TempleRegistry.createText("Introduction",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/index.html"},[e.TempleRegistry.createText("Documentation",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/getting-started.html"},[e.TempleRegistry.createText("Getting Started",!1)]),e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/index.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/index.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/index.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Documentation")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/index.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/index.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Documentation")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/getting-started.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/getting-started.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/getting-started.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Getting Started")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/getting-started.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/getting-started.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Getting Started")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
 
-    `,!1),e.TempleRegistry.createElement("h6",{},[e.TempleRegistry.createText("Features",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/markup-syntax.html"},[e.TempleRegistry.createText("Markup Syntax",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/state-management.html"},[e.TempleRegistry.createText("State Management",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/component-strategy.html"},[e.TempleRegistry.createText("Component Strategy",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/compiler-api.html"},[e.TempleRegistry.createText("Compiler API",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/client-api.html"},[e.TempleRegistry.createText("Client API",!1)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("h6",{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},"{ 'class': `bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),...this._toNodeList(r("Features")),e.TempleRegistry.createText(`
+  `,!1)]),e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/markup-syntax.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/markup-syntax.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/markup-syntax.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Markup Syntax")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/markup-syntax.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/markup-syntax.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Markup Syntax")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/state-management.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/state-management.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/state-management.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("State Management")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/state-management.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/state-management.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("State Management")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/component-strategy.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/component-strategy.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/component-strategy.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Component Strategy")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-strategy.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/component-strategy.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Component Strategy")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/compiler-api.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/compiler-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/compiler-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Compiler API")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/compiler-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/compiler-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Compiler API")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/client-api.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/client-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/client-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Client API")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/client-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/client-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Client API")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
 
-    `,!1),e.TempleRegistry.createElement("h6",{},[e.TempleRegistry.createText("Usage",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/template-engine.html"},[e.TempleRegistry.createText("Template Engine",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/single-page.html"},[e.TempleRegistry.createText("Single Page App",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/static-site.html"},[e.TempleRegistry.createText("Static Site Generator",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/component-publisher.html"},[e.TempleRegistry.createText("Component Publisher",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/developer-tools.html"},[e.TempleRegistry.createText("Developer Tools",!1)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("h6",{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},"{ 'class': `bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),...this._toNodeList(r("Usage")),e.TempleRegistry.createText(`
   `,!1)]),e.TempleRegistry.createText(`
-`,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("panel-main",{class:"panel-main"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("div",{class:"docs container"},[e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("h1",{},[...this._toNodeList(o("Static Site Generator"))]),e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/template-engine.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/template-engine.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/template-engine.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Template Engine")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/template-engine.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/template-engine.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Template Engine")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/single-page.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/single-page.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/single-page.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Single Page App")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/single-page.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/single-page.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Single Page App")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/static-site.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/static-site.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/static-site.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Static Site Generator")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/static-site.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/static-site.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Static Site Generator")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/component-publisher.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/component-publisher.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/component-publisher.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Component Publisher")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-publisher.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/component-publisher.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Component Publisher")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/developer-tools.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold mb-100",href:"/temple/docs/developer-tools.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold mb-100`, 'href': `/temple/docs/developer-tools.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Developer Tools")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 mb-100",href:"/temple/docs/developer-tools.html"},"{ 'class': `block tx-t-1 py-10 pl-10 mb-100`, 'href': `/temple/docs/developer-tools.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Developer Tools")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+`,!1)])]),e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("panel-main",{},"{ }",[e.TempleRegistry.createText(`
+        `,!1),e.TempleRegistry.createElement("api-docs",{},"{ }",[e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("h1",{class:"tx-primary tx-uppercase tx-30 py-20"},"{ 'class': `tx-primary tx-uppercase tx-30 py-20` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(r("Static Site Generator")),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          A static site generator is a tool that generates a full static 
-          HTML website based on raw data and a set of templates. 
-          Essentially, a static site generator automates the task of 
-          coding individual HTML pages and gets those pages ready to 
-          serve to users ahead of time. Because these HTML pages are 
-          pre-built, they can load very quickly in browsers. You can use 
-          Temple, TypeScript and the native Node.js HTTP server to 
-          generate HTML documents in order to be served statically.
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            A static site generator is a tool that generates a full static 
+            HTML website based on raw data and a set of templates. 
+            Essentially, a static site generator automates the task of 
+            coding individual HTML pages and gets those pages ready to 
+            serve to users ahead of time. Because these HTML pages are 
+            pre-built, they can load very quickly in browsers. You can use 
+            Temple, TypeScript and the native Node.js HTTP server to 
+            generate HTML documents in order to be served statically.
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          First, create a project with the following structure and files.
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("ide-app",{panel:410,title:"My Project"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("div",{class:"panel-head"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("div",{class:"tabs"},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("tui-tab",{class:"tab active",group:"project",selector:"#index-ts"},[e.TempleRegistry.createText(`
-                src/index.ts
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            First, create a project with the following structure and files.
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("ide-app",{height:410,title:"My Project"},"{ 'height': 410, 'title': `My Project` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("app-head",{},"{ }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("div",{class:"flex scroll-x-auto pt-5 pl-5"},"{ 'class': `flex scroll-x-auto pt-5 pl-5` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("tui-tab",{on:!0,class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"static",selector:"#index-ts"},"{ 'on': true, 'class': `relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0`, 'active': `bg-black tx-white`, 'inactive': `bg-t-1 tx-muted`, 'group': `static`, 'selector': `#index-ts` }",[e.TempleRegistry.createText(`
+                  src/index.ts
+                `,!1)]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("tui-tab",{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"static",selector:"#page-dtml"},"{ 'class': `relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0`, 'active': `bg-black tx-white`, 'inactive': `bg-t-1 tx-muted`, 'group': `static`, 'selector': `#page-dtml` }",[e.TempleRegistry.createText(`
+                  src/page.dtml
+                `,!1)]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("tui-tab",{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"static",selector:"#package-json"},"{ 'class': `relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0`, 'active': `bg-black tx-white`, 'inactive': `bg-t-1 tx-muted`, 'group': `static`, 'selector': `#package-json` }",[e.TempleRegistry.createText(`
+                  package.json
+                `,!1)]),e.TempleRegistry.createText(`
+              `,!1)]),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("app-left",{},"{ }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("h5",{class:"p-5"},"{ 'class': `p-5` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-down"},"{ 'class': `fas fa-fw fa-chevron-down` }",[]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("span",{},"{ }",[e.TempleRegistry.createText("src",!1)]),e.TempleRegistry.createText(`
               `,!1)]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("tui-tab",{class:"tab",group:"project",selector:"#index-dtml"},[e.TempleRegistry.createText(`
-                src/pages/index.dtml
+              `,!1),e.TempleRegistry.createElement("tui-tab",{on:!0,class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"static",selector:"#index-ts"},"{ 'on': true, 'class': `pl-15 pt-10 block`, 'active': `tx-white`, 'inactive': `tx-muted`, 'group': `static`, 'selector': `#index-ts` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},"{ 'class': `fas fa-fw fa-file` }",[]),e.TempleRegistry.createText(`
+                index.ts
               `,!1)]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("tui-tab",{class:"tab",group:"project",selector:"#package-json"},[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("tui-tab",{class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"static",selector:"#page-dtml"},"{ 'class': `pl-15 pt-10 block`, 'active': `tx-white`, 'inactive': `tx-muted`, 'group': `static`, 'selector': `#page-dtml` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},"{ 'class': `fas fa-fw fa-file` }",[]),e.TempleRegistry.createText(`
+                page.dtml
+              `,!1)]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("tui-tab",{class:"pt-10 block",active:"tx-white",inactive:"tx-muted",group:"static",selector:"#package-json"},"{ 'class': `pt-10 block`, 'active': `tx-white`, 'inactive': `tx-muted`, 'group': `static`, 'selector': `#package-json` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},"{ 'class': `fas fa-fw fa-file` }",[]),e.TempleRegistry.createText(`
                 package.json
               `,!1)]),e.TempleRegistry.createText(`
             `,!1)]),e.TempleRegistry.createText(`
-          `,!1)]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("div",{class:"panel-left"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("h5",{class:"folder"},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-down"},[]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("span",{},[e.TempleRegistry.createText("src",!1)]),e.TempleRegistry.createText(`
-            `,!1)]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("tui-tab",{class:"shift-1 block active",group:"project",selector:"#index-ts"},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},[]),e.TempleRegistry.createText(`
-              index.ts
-            `,!1)]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("h5",{class:"folder shift-1"},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-down",style:"margin-left:4px"},[]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("span",{},[e.TempleRegistry.createText("pages",!1)]),e.TempleRegistry.createText(`
-            `,!1)]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("tui-tab",{class:"shift-2 block",group:"project",selector:"#index-dtml"},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},[]),e.TempleRegistry.createText(`
-              index.dtml
-            `,!1)]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("tui-tab",{class:"block",group:"project",selector:"#package-json"},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},[]),e.TempleRegistry.createText(`
-              package.json
-            `,!1)]),e.TempleRegistry.createText(`
-          `,!1)]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("div",{class:"panel-main"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("main",{},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("ide-code",{id:"index-ts",lang:"js",numbers:!0,trim:!0,detab:16},[...this._toNodeList(`
+            `,!1),e.TempleRegistry.createElement("app-main",{},"{ }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("ide-code",{id:"index-ts",lang:"js",numbers:!0,trim:!0,detab:16},"{ 'id': `index-ts`, 'lang': `js`, 'numbers': true, 'trim': true, 'detab': 16 }",[...this._toNodeList(`
                 import http from 'http';
                 import temple, { cache } from '@ossph/temple/compiler';
 
@@ -184,7 +294,7 @@ ${s}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:
                 //listen on port 3000
                 server.listen(3000);
               `)]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("ide-code",{id:"index-dtml",style:"display:none",numbers:!0,trim:!0,detab:16},[...this._toNodeList(`
+              `,!1),e.TempleRegistry.createElement("ide-code",{id:"index-dtml",style:"display:none",numbers:!0,trim:!0,detab:16},"{ 'id': `index-dtml`, 'style': `display:none`, 'numbers': true, 'trim': true, 'detab': 16 }",[...this._toNodeList(`
                 
@@ -204,7 +314,7 @@ ${s}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:
                   
                 
               `)]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("ide-code",{id:"package-json",style:"display:none",lang:"js",numbers:!0,trim:!0,detab:16},[...this._toNodeList(`
+              `,!1),e.TempleRegistry.createElement("ide-code",{id:"package-json",style:"display:none",lang:"js",numbers:!0,trim:!0,detab:16},"{ 'id': `package-json`, 'style': `display:none`, 'lang': `js`, 'numbers': true, 'trim': true, 'detab': 16 }",[...this._toNodeList(`
                 {
                   "name": "my-project",
                   "version": "1.0.0",
@@ -213,10 +323,10 @@ ${s}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:
                     "dev": "ts-node ./src/index.ts"
                   },
                   "dependencies": {
-                    "@ossph/temple": "0.1.4"
+                    "@ossph/temple": "0.1.6"
                   },
                   "devDependencies": {
-                    "@ossph/temple-dev": "0.1.4",
+                    "@ossph/temple-dev": "0.1.6",
                     "@types/node": "22.1.0",
                     "ts-node": "10.9.2",
                     "typescript": "5.5.4"
@@ -225,34 +335,34 @@ ${s}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:
               `)]),e.TempleRegistry.createText(`
             `,!1)]),e.TempleRegistry.createText(`
           `,!1)]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          To test the script and see the results, run the following 
-          command in terminal.
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("ide-code",{lang:"bash"},[e.TempleRegistry.createText(`
-          npm run dev
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Load 
-          `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},[e.TempleRegistry.createText("'http://localhost:3000/'",!1)]),e.TempleRegistry.createText(` 
-          in your browser. After loading you should see files that were 
-          generated in a new build folder found in your project root. 
-        `,!1)]),e.TempleRegistry.createText(`
-        
-        `,!1),e.TempleRegistry.createElement("nav",{class:"pager"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("a",{class:"prev",href:"/temple/docs/single-page.html"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-left"},[]),e.TempleRegistry.createText(`
-            `,!1),...this._toNodeList(o("Single Page App")),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            To test the script and see the results, run the following 
+            command in terminal.
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("ide-code",{lang:"bash"},"{ 'lang': `bash` }",[e.TempleRegistry.createText(`
+            npm run dev
           `,!1)]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("a",{class:"next",href:"/temple/docs/component-publisher.html"},[e.TempleRegistry.createText(`
-            `,!1),...this._toNodeList(o("Component Publisher")),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-right"},[]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            Load 
+            `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},"{ 'lang': `js`, 'inline': true }",[e.TempleRegistry.createText("http://localhost:3000/",!1)]),e.TempleRegistry.createText(` 
+            in your browser. After loading you should see files that were 
+            generated in a new build folder found in your project root. 
+          `,!1)]),e.TempleRegistry.createText(`
+          
+          `,!1),e.TempleRegistry.createElement("nav",{class:"flex"},"{ 'class': `flex` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"tx-primary py-40",href:"/temple/docs/single-page.html"},"{ 'class': `tx-primary py-40`, 'href': `/temple/docs/single-page.html` }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-left tx-t-1"},"{ 'class': `fas fa-fw fa-chevron-left tx-t-1` }",[]),e.TempleRegistry.createText(`
+              `,!1),...this._toNodeList(r("Single Page App")),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"flex-grow tx-right tx-primary py-40",href:"/temple/docs/component-publisher.html"},"{ 'class': `flex-grow tx-right tx-primary py-40`, 'href': `/temple/docs/component-publisher.html` }",[e.TempleRegistry.createText(`
+              `,!1),...this._toNodeList(r("Component Publisher")),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-right tx-t-1"},"{ 'class': `fas fa-fw fa-chevron-right tx-t-1` }",[]),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
           `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("footer",{class:"foot"},"{ 'class': `foot` }",[]),e.TempleRegistry.createText(`
         `,!1)]),e.TempleRegistry.createText(`
       `,!1)]),e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("footer",{class:"foot"},[]),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
   `,!1)]),e.TempleRegistry.createText(`
-`,!1)])]}};return ne(Re);})();
+`,!1)])]}};return se(Ne);})();
diff --git a/docs/build/server/269f8b60f20cebb43be6.js b/docs/build/server/269f8b60f20cebb43be6.js
index 18da985..e91df49 100644
--- a/docs/build/server/269f8b60f20cebb43be6.js
+++ b/docs/build/server/269f8b60f20cebb43be6.js
@@ -1,367 +1,528 @@
-var TempleAPI=(()=>{var ee=Object.create;var _=Object.defineProperty;var te=Object.getOwnPropertyDescriptor;var ae=Object.getOwnPropertyNames;var re=Object.getPrototypeOf,le=Object.prototype.hasOwnProperty;var i=(a,t)=>()=>(t||a((t={exports:{}}).exports,t),t.exports),ne=(a,t)=>{for(var r in t)_(a,r,{get:t[r],enumerable:!0})},W=(a,t,r,l)=>{if(t&&typeof t=="object"||typeof t=="function")for(let c of ae(t))!le.call(a,c)&&c!==r&&_(a,c,{get:()=>t[c],enumerable:!(l=te(t,c))||l.enumerable});return a};var F=(a,t,r)=>(r=a!=null?ee(re(a)):{},W(t||!a||!a.__esModule?_(r,"default",{value:a,enumerable:!0}):r,a)),se=a=>W(_({},"__esModule",{value:!0}),a);var j=i(N=>{"use strict";Object.defineProperty(N,"__esModule",{value:!0});var L=class extends Error{static for(t,...r){return r.forEach(function(l){t=t.replace("%s",l)}),new this(t)}static forErrorsFound(t){let r=new this("Invalid Parameters");return r.errors=t,r}static require(t,r,...l){if(!t){for(let c of l)r=r.replace("%s",c);throw new this(r)}}constructor(t,r=500){super(),this.errors={},this.start=0,this.end=0,this.message=t,this.name=this.constructor.name,this.code=r}withCode(t){return this.code=t,this}withPosition(t,r){return this.start=t,this.end=r,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};N.default=L});var M=i(O=>{"use strict";Object.defineProperty(O,"__esModule",{value:!0});var D=class{constructor(t=[]){this._elements=new Set,t.forEach(r=>this._elements.add(r))}add(t){this._elements.add(t)}toArray(){return Array.from(this._elements)}toString(){return Array.from(this._elements).filter(Boolean).map(t=>t.toString()).join("")}};O.default=D});var m=i(S=>{"use strict";Object.defineProperty(S,"__esModule",{value:!0});var ce=new Map;S.default=ce});var b=i(u=>{"use strict";var ie=u&&u.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(u,"__esModule",{value:!0});var oe=ie(M()),fe=["area","base","br","col","embed","hr","img","input","link","meta","param","source","track","wbr"],P=class{static render(t){return t.filter(Boolean).map(r=>r.toString()).join("")}get name(){return this._name}get attributes(){return this._attributes}get children(){return this._children}constructor(t,r={},l=[]){this._attributes={},this._name=t,this._attributes=r,this._children=new oe.default(l)}toString(){let t=Object.entries(this._attributes),r=t.length>0?" "+t.map(([c,f])=>{if(typeof f=="string")return`${c}="${f}"`;if(typeof f=="boolean")return f?c:""}).join(" "):"";if(fe.includes(this._name))return`<${this._name}${r} />`;let l=this._children.toString();return`<${this._name}${r}>${l}`}};u.default=P});var C=i(q=>{"use strict";Object.defineProperty(q,"__esModule",{value:!0});var k=class{get value(){return this._escape?this._value.replace(/&/g,"&").replace(//g,">"):this._value}constructor(t,r=!1){this._escape=r,this._value=t}toString(){return this.value}};q.default=k});var A=i(d=>{"use strict";var R=d&&d.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(d,"__esModule",{value:!0});var me=R(C()),ue=R(b()),I=class{static createElement(t,r,l=[]){return new ue.default(t,r,l)}static createText(t,r=!0){return new me.default(t,r)}};d.default=I});var Y=i(T=>{"use strict";var v=T&&T.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(T,"__esModule",{value:!0});var de=v(j()),$=v(m()),Te=v(b()),pe=v(A()),B=class{render(t={}){$.default.set("props",t||{}),$.default.set("env",Object.assign(Object.assign({},process.env||{}),{BUILD_ID:this.id(),APP_DATA:btoa(JSON.stringify(Object.assign(Object.assign({},Object.fromEntries($.default.entries())),{env:Object.assign(Object.assign({},Object.fromEntries(Object.entries(process.env||{}).filter(c=>c[0].startsWith("PUBLIC_")))),{BUILD_ID:this.id()})})))}));let r=this.template(),l=Te.default.render(r).trim();if(!l.toLowerCase().startsWith(" tag.");return`
-${l}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:Array.isArray(t)&&t.every(r=>typeof r=="object"&&typeof r.nodeType=="number")?t:[pe.default.createText(String(t))]}};T.default=B});var G=i(p=>{"use strict";Object.defineProperty(p,"__esModule",{value:!0});p.TempleEmitter=void 0;var y=class{emit(t,r){return this}on(t,r){return this}once(t,r){return this}unbind(t,r){return this}};p.TempleEmitter=y;var xe=new y;p.default=xe});var J=i(x=>{"use strict";var he=x&&x.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(x,"__esModule",{value:!0});var Ee=he(m());function ge(a){let t=Ee.default.get("env")||{};return a?t[a]||null:t}x.default=ge});var U=i(h=>{"use strict";var _e=h&&h.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(h,"__esModule",{value:!0});h.default=ve;var be=_e(m());function ve(){return be.default.get("props")||{}}});var z=i(E=>{"use strict";var ye=E&&E.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(E,"__esModule",{value:!0});E.default=Le;var we=ye(U());function Le(){return(0,we.default)().class}});var K=i(H=>{"use strict";Object.defineProperty(H,"__esModule",{value:!0});H.default=Ne;function Ne(a){let t={getter:()=>r.raw,setter:l=>l},r={raw:a,getter(l){return t.getter=l,r},setter(l){return t.setter=l,r}};return Object.defineProperty(r,"value",{get(){return t.getter()},set(l){r.raw=t.setter(l)}}),r}});var X=i(n=>{"use strict";var je=n&&n.__createBinding||(Object.create?function(a,t,r,l){l===void 0&&(l=r);var c=Object.getOwnPropertyDescriptor(t,r);(!c||("get"in c?!t.__esModule:c.writable||c.configurable))&&(c={enumerable:!0,get:function(){return t[r]}}),Object.defineProperty(a,l,c)}:function(a,t,r,l){l===void 0&&(l=r),a[l]=t[r]}),De=n&&n.__setModuleDefault||(Object.create?function(a,t){Object.defineProperty(a,"default",{enumerable:!0,value:t})}:function(a,t){a.default=t}),Oe=n&&n.__importStar||function(a){if(a&&a.__esModule)return a;var t={};if(a!=null)for(var r in a)r!=="default"&&Object.prototype.hasOwnProperty.call(a,r)&&je(t,a,r);return De(t,a),t},o=n&&n.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(n,"__esModule",{value:!0});n.TempleText=n.TempleException=n.TempleEmitter=n.TempleElement=n.TempleRegistry=n.TempleDocument=n.TempleCollection=n.signal=n.classnames=n.props=n.emitter=n.env=n.data=void 0;var Me=o(j());n.TempleException=Me.default;var Se=o(M());n.TempleCollection=Se.default;var Pe=o(Y());n.TempleDocument=Pe.default;var ke=o(A());n.TempleRegistry=ke.default;var qe=o(b());n.TempleElement=qe.default;var Q=Oe(G());n.emitter=Q.default;Object.defineProperty(n,"TempleEmitter",{enumerable:!0,get:function(){return Q.TempleEmitter}});var Ce=o(C());n.TempleText=Ce.default;var Ie=o(m());n.data=Ie.default;var Ae=o(J());n.env=Ae.default;var $e=o(U());n.props=$e.default;var Be=o(z());n.classnames=Be.default;var Ue=o(K());n.signal=Ue.default});var V=i((rt,Z)=>{Z.exports={...X()}});var Ve={};ne(Ve,{default:()=>w});var e=F(V()),g=F(V());var s=function(a,...t){let r=He(a);for(let l=0;l{var X=Object.create;var E=Object.defineProperty;var Z=Object.getOwnPropertyDescriptor;var ee=Object.getOwnPropertyNames;var te=Object.getPrototypeOf,ae=Object.prototype.hasOwnProperty;var i=(a,t)=>()=>(t||a((t={exports:{}}).exports,t),t.exports),le=(a,t)=>{for(var l in t)E(a,l,{get:t[l],enumerable:!0})},H=(a,t,l,s)=>{if(t&&typeof t=="object"||typeof t=="function")for(let n of ee(t))!ae.call(a,n)&&n!==l&&E(a,n,{get:()=>t[n],enumerable:!(s=Z(t,n))||s.enumerable});return a};var W=(a,t,l)=>(l=a!=null?X(te(a)):{},H(t||!a||!a.__esModule?E(l,"default",{value:a,enumerable:!0}):l,a)),re=a=>H(E({},"__esModule",{value:!0}),a);var k=i(v=>{"use strict";Object.defineProperty(v,"__esModule",{value:!0});var _=class extends Error{static for(t,...l){return l.forEach(function(s){t=t.replace("%s",s)}),new this(t)}static forErrorsFound(t){let l=new this("Invalid Parameters");return l.errors=t,l}static require(t,l,...s){if(!t){for(let n of s)l=l.replace("%s",n);throw new this(l)}}constructor(t,l=500){super(),this.errors={},this.start=0,this.end=0,this.message=t,this.name=this.constructor.name,this.code=l}withCode(t){return this.code=t,this}withPosition(t,l){return this.start=t,this.end=l,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};v.default=_});var N=i(L=>{"use strict";Object.defineProperty(L,"__esModule",{value:!0});var w=class{get length(){return this._elements.size}constructor(t=[]){this._elements=new Set,t.forEach(l=>this._elements.add(l))}add(t){this._elements.add(t)}toArray(){return Array.from(this._elements)}toString(){return Array.from(this._elements).filter(Boolean).map(t=>t.toString()).join("")}};L.default=w});var m=i(j=>{"use strict";Object.defineProperty(j,"__esModule",{value:!0});var se=new Map;j.default=se});var P=i(D=>{"use strict";Object.defineProperty(D,"__esModule",{value:!0});var S=class{get value(){return this._escape?this._value.replace(/&/g,"&").replace(//g,">"):this._value}constructor(t,l=!1){this._escape=l,this._value=t}toString(){return this.value}};D.default=S});var M=i(p=>{"use strict";var ce=p&&p.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(p,"__esModule",{value:!0});var ne=ce(N()),ie=["area","base","br","col","embed","hr","img","input","link","meta","param","source","track","wbr"],O=class{get attributes(){return this._attributes}get children(){return this._children}get name(){return this._name}get props(){return this._props}constructor(t,l={},s="",n=[]){this._attributes={},this._name=t,this._attributes=l,this._props=s,this._children=new ne.default(n)}toString(){let t=Object.entries(this._attributes),l=t.length>0?" "+t.map(([n,b])=>{if(typeof b=="string")return`${n}="${b}"`;if(typeof b=="boolean")return b?n:""}).join(" "):"";if(ie.includes(this._name))return`<${this._name}${l} />`;let s=this._children.toString();return`<${this._name}${l}>${s}`}};p.default=O});var A=i(f=>{"use strict";var V=f&&f.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(f,"__esModule",{value:!0});var oe=V(P()),F=V(M()),C=class{static render(t){return t.filter(Boolean).map(l=>l.toString()).join("")}static registry(t,l=new Set){return t.forEach(s=>{s instanceof F.default&&(["html","head","body"].includes(s.name)||l.add(s),s.name!=="head"&&s.children.length>0&&this.registry(s.children.toArray(),l))}),l}static createElement(t,l,s,n=[]){return new F.default(t,l,s,n)}static createText(t,l=!0){return new oe.default(t,l)}};f.default=C});var G=i(x=>{"use strict";var B=x&&x.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(x,"__esModule",{value:!0});var me=B(k()),I=B(m()),q=B(A()),$=class{bindings(){let t=q.default.registry(this.template());return`{ ${Array.from(t.values()).map((s,n)=>s.props!=="{ }"?`'${n}': ${s.props}`:"").filter(s=>s!=="").join(", ")} }`}render(t={}){I.default.set("props",t||{}),I.default.set("env",Object.assign(Object.assign({},process.env||{}),{BUILD_ID:this.id(),APP_DATA:btoa(JSON.stringify(Object.assign(Object.assign({},Object.fromEntries(I.default.entries())),{env:Object.assign(Object.assign({},Object.fromEntries(Object.entries(process.env||{}).filter(n=>n[0].startsWith("PUBLIC_")))),{BUILD_ID:this.id()})})))}));let l=this.template(),s=q.default.render(l).trim();if(!s.toLowerCase().startsWith(" tag.");return`
+${s}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:Array.isArray(t)&&t.every(l=>typeof l=="object"&&typeof l.nodeType=="number")?t:[q.default.createText(String(t))]}};x.default=$});var R=i(d=>{"use strict";Object.defineProperty(d,"__esModule",{value:!0});d.TempleEmitter=void 0;var g=class{emit(t,l){return this}on(t,l){return this}once(t,l){return this}unbind(t,l){return this}};d.TempleEmitter=g;var pe=new g;d.default=pe});var z=i(u=>{"use strict";var fe=u&&u.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(u,"__esModule",{value:!0});var xe=fe(m());function de(a){let t=xe.default.get("env")||{};return a?t[a]||null:t}u.default=de});var Y=i(h=>{"use strict";var ue=h&&h.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(h,"__esModule",{value:!0});h.default=Te;var he=ue(m());function Te(){return he.default.get("props")||{}}});var K=i(c=>{"use strict";var be=c&&c.__createBinding||(Object.create?function(a,t,l,s){s===void 0&&(s=l);var n=Object.getOwnPropertyDescriptor(t,l);(!n||("get"in n?!t.__esModule:n.writable||n.configurable))&&(n={enumerable:!0,get:function(){return t[l]}}),Object.defineProperty(a,s,n)}:function(a,t,l,s){s===void 0&&(s=l),a[s]=t[l]}),Ee=c&&c.__setModuleDefault||(Object.create?function(a,t){Object.defineProperty(a,"default",{enumerable:!0,value:t})}:function(a,t){a.default=t}),ge=c&&c.__importStar||function(a){if(a&&a.__esModule)return a;var t={};if(a!=null)for(var l in a)l!=="default"&&Object.prototype.hasOwnProperty.call(a,l)&&be(t,a,l);return Ee(t,a),t},o=c&&c.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(c,"__esModule",{value:!0});c.TempleText=c.TempleException=c.TempleEmitter=c.TempleElement=c.TempleRegistry=c.TempleDocument=c.TempleCollection=c.props=c.emitter=c.env=c.data=void 0;var ye=o(k());c.TempleException=ye.default;var _e=o(N());c.TempleCollection=_e.default;var ve=o(G());c.TempleDocument=ve.default;var ke=o(A());c.TempleRegistry=ke.default;var we=o(M());c.TempleElement=we.default;var J=ge(R());c.emitter=J.default;Object.defineProperty(c,"TempleEmitter",{enumerable:!0,get:function(){return J.TempleEmitter}});var Le=o(P());c.TempleText=Le.default;var Ne=o(m());c.data=Ne.default;var je=o(z());c.env=je.default;var Se=o(Y());c.props=Se.default});var U=i((Ve,Q)=>{Q.exports={...K()}});var Pe={};le(Pe,{default:()=>y});var e=W(U()),T=W(U());var r=function(a,...t){let l=De(a);for(let s=0;s{document.body.classList.toggle("panel-left-open")};return[e.TempleRegistry.createText(`
-`,!1),e.TempleRegistry.createElement("html",{},[e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("head",{},[e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{charset:"utf-8"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"viewport",content:"width=device-width, initial-scale=1"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("title",{},[...this._toNodeList(r)]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"description",content:l}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:title",content:r}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:description",content:l}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:image",content:"https://ossphilippines.github.io/temple/temple-logo.png"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:url",content:`https://ossphilippines.github.io/temple${t}`}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:type",content:"website"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:card",content:"summary"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:site",content:"@OSSPhilippines"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:title",content:r}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:description",content:l}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:image",content:"https://ossphilippines.github.io/temple/temple-logo.png"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"favicon",href:"/temple/favicon.ico"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"shortcut icon",type:"image/png",href:"/temple/favicon.png"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/fontawesome/all.css"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/theme.css"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:`/temple/build/client/${(0,g.env)("BUILD_ID")}.css`}),e.TempleRegistry.createText(`
+  }`}template(){let t="/docs/state-management.html",l=r("State Management - Temple reactive web component template engine."),s=r("Learn how to manage states in Temple."),n=()=>{document.getElementsByTagName("panel-layout")[0].toggle("left")};return[e.TempleRegistry.createText(`
+`,!1),e.TempleRegistry.createElement("html",{},"{ }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("head",{},"{ }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{charset:"utf-8"},"{ 'charset': `utf-8` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"viewport",content:"width=device-width, initial-scale=1"},"{ 'name': `viewport`, 'content': `width=device-width, initial-scale=1` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("title",{},"{ }",[...this._toNodeList(l)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"description",content:s},"{ 'name': `description`, 'content': description }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:title",content:l},"{ 'property': `og:title`, 'content': title }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:description",content:s},"{ 'property': `og:description`, 'content': description }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:image",content:"https://ossphilippines.github.io/temple/temple-logo.png"},"{ 'property': `og:image`, 'content': `https://ossphilippines.github.io/temple/temple-logo.png` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:url",content:`https://ossphilippines.github.io/temple${t}`},"{ 'property': `og:url`, 'content': `https://ossphilippines.github.io/temple${url}` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:type",content:"website"},"{ 'property': `og:type`, 'content': `website` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:card",content:"summary"},"{ 'name': `twitter:card`, 'content': `summary` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:site",content:"@OSSPhilippines"},"{ 'name': `twitter:site`, 'content': `@OSSPhilippines` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:title",content:l},"{ 'name': `twitter:title`, 'content': title }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:description",content:s},"{ 'name': `twitter:description`, 'content': description }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:image",content:"https://ossphilippines.github.io/temple/temple-logo.png"},"{ 'name': `twitter:image`, 'content': `https://ossphilippines.github.io/temple/temple-logo.png` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"favicon",href:"/temple/favicon.ico"},"{ 'rel': `favicon`, 'href': `/temple/favicon.ico` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"shortcut icon",type:"image/png",href:"/temple/favicon.png"},"{ 'rel': `shortcut icon`, 'type': `image/png`, 'href': `/temple/favicon.png` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/fontawesome/all.css"},"{ 'rel': `stylesheet`, 'type': `text/css`, 'href': `/temple/styles/fontawesome/all.css` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/global.css"},"{ 'rel': `stylesheet`, 'type': `text/css`, 'href': `/temple/styles/global.css` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:`/temple/build/client/${(0,T.env)("BUILD_ID")}.css`},"{ 'rel': `stylesheet`, 'type': `text/css`, 'href': `/temple/build/client/${env('BUILD_ID')}.css` }"),e.TempleRegistry.createText(`
   
-  `,!1),e.TempleRegistry.createElement("script",{"data-app":(0,g.env)("APP_DATA"),src:`/temple/build/client/${(0,g.env)("BUILD_ID")}.js`}),e.TempleRegistry.createText(`
-  `,!1),...(0,g.env)("NODE_ENV")==="development"?[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("script",{src:"/dev.js"}),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("script",{"data-app":(0,T.env)("APP_DATA"),src:`/temple/build/client/${(0,T.env)("BUILD_ID")}.js`},"{ 'data-app': env('APP_DATA'), 'src': `/temple/build/client/${env('BUILD_ID')}.js` }"),e.TempleRegistry.createText(`
+  `,!1),...(0,T.env)("NODE_ENV")==="development"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("script",{src:"/dev.js"},"{ 'src': `/dev.js` }"),e.TempleRegistry.createText(`
   `,!1)]:[],e.TempleRegistry.createText(`
 `,!1)]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("body",{class:"dark panel with-head with-left with-right"},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("header",{class:"head panel-head"},[e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("i",{class:"menu fas fa-fw fa-bars",click:c},[]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("a",{href:"/temple"},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("img",{src:"/temple/temple-icon.png",alt:"Temple Logo"}),e.TempleRegistry.createText(`
-  `,!1)]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("h3",{},[e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple"},[e.TempleRegistry.createText("Temple",!1)])]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("nav",{},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple/docs/index.html"},[e.TempleRegistry.createText("Docs",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{class:"github",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-github"},[]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("body",{class:"dark bg-t-0 tx-t1 arial"},"{ 'class': `dark bg-t-0 tx-t1 arial` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("panel-layout",{},"{ }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("panel-head",{},"{ }",[e.TempleRegistry.createElement("menu",{class:"flex flex-center-y px-20 py-15 m-0 bg-t-1"},"{ 'class': `flex flex-center-y px-20 py-15 m-0 bg-t-1` }",[e.TempleRegistry.createText(`
+  `,!1),...t!=="/temple/index.html"&&t!=="/temple/500.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-bars cursor-pointer py-5 pr-10 none md-inline-block tx-t-1",click:n},"{ 'class': `fas fa-fw fa-bars cursor-pointer py-5 pr-10 none md-inline-block tx-t-1`, 'click': toggle }",[]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("div",{class:"flex-grow"},"{ 'class': `flex-grow` }",[]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{href:"/temple"},"{ 'href': `/temple` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("img",{alt:"Temple Logo",class:"h-26 mr-10",src:"/temple/temple-icon.png"},"{ 'alt': `Temple Logo`, 'class': `h-26 mr-10`, 'src': `/temple/temple-icon.png` }"),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("h3",{class:"flex-grow tx-uppercase"},"{ 'class': `flex-grow tx-uppercase` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple"},"{ 'class': `tx-white`, 'href': `/temple` }",[e.TempleRegistry.createText("Temple",!1)]),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("nav",{class:"flex flex-center-y"},"{ 'class': `flex flex-center-y` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple/docs/index.html"},"{ 'class': `tx-white`, 'href': `/temple/docs/index.html` }",[e.TempleRegistry.createText("Docs",!1)]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"tx-t-1 tx-5xl ml-10",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},"{ 'class': `tx-t-1 tx-5xl ml-10`, 'href': `https://github.com/OSSPhilippines/temple`, 'target': `_blank` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-github"},"{ 'class': `fab fa-github` }",[]),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{class:"npm",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-npm text-white"},[]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"bg-h-cb3837 pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},"{ 'class': `bg-h-cb3837 pill tx-t-1 tx-lg ml-5 p-5 tx-center`, 'href': `https://www.npmjs.com/package/@ossph/temple`, 'target': `_blank` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-npm text-white"},"{ 'class': `fab fa-npm text-white` }",[]),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{class:"discord",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-discord text-white"},[]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"bg-h-7289da pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},"{ 'class': `bg-h-7289da pill tx-t-1 tx-lg ml-5 p-5 tx-center`, 'href': `https://discord.gg/open-source-software-ph-905496362982981723`, 'target': `_blank` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-discord text-white"},"{ 'class': `fab fa-discord text-white` }",[]),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
   `,!1)]),e.TempleRegistry.createText(`
+`,!1)])]),e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("panel-left",{},"{ }",[e.TempleRegistry.createElement("header",{class:"flex flex-center-y bg-t-2 py-15 pr-5 pl-10"},"{ 'class': `flex flex-center-y bg-t-2 py-15 pr-5 pl-10` }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("a",{href:"/temple"},"{ 'href': `/temple` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("img",{class:"h-26 mr-10",src:"/temple/temple-icon.png",alt:"Temple Logo"},"{ 'class': `h-26 mr-10`, 'src': `/temple/temple-icon.png`, 'alt': `Temple Logo` }"),e.TempleRegistry.createText(`
+  `,!1)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("h3",{class:"flex-grow m-0 tx-uppercase"},"{ 'class': `flex-grow m-0 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple"},"{ 'class': `tx-white`, 'href': `/temple` }",[e.TempleRegistry.createText("Temple",!1)]),e.TempleRegistry.createText(`
+  `,!1)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-left cursor-pointer none md-inline-block",click:n},"{ 'class': `fas fa-fw fa-chevron-left cursor-pointer none md-inline-block`, 'click': toggle }",[]),e.TempleRegistry.createText(`
 `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("aside",{class:"left panel-left"},[e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("header",{},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("img",{src:"/temple/temple-icon.png",alt:"Temple Logo"}),e.TempleRegistry.createText(`
-    `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("h3",{},[e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple"},[e.TempleRegistry.createText("Temple",!1)])]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("i",{class:"toggle fas fa-fw fa-chevron-left",click:c},[]),e.TempleRegistry.createText(`
+`,!1),e.TempleRegistry.createElement("nav",{class:"bg-t-1 scroll-auto h-calc-full-60"},"{ 'class': `bg-t-1 scroll-auto h-calc-full-60` }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("h6",{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-0 pt-20 pb-10 pl-10 tx-uppercase"},"{ 'class': `bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-0 pt-20 pb-10 pl-10 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),...this._toNodeList(r("Introduction")),e.TempleRegistry.createText(`
   `,!1)]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("nav",{},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("h6",{},[e.TempleRegistry.createText("Introduction",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/index.html"},[e.TempleRegistry.createText("Documentation",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/getting-started.html"},[e.TempleRegistry.createText("Getting Started",!1)]),e.TempleRegistry.createText(`
-
-    `,!1),e.TempleRegistry.createElement("h6",{},[e.TempleRegistry.createText("Features",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/markup-syntax.html"},[e.TempleRegistry.createText("Markup Syntax",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/state-management.html"},[e.TempleRegistry.createText("State Management",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/component-strategy.html"},[e.TempleRegistry.createText("Component Strategy",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/compiler-api.html"},[e.TempleRegistry.createText("Compiler API",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/client-api.html"},[e.TempleRegistry.createText("Client API",!1)]),e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/index.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/index.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/index.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Documentation")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/index.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/index.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Documentation")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/getting-started.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/getting-started.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/getting-started.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Getting Started")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/getting-started.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/getting-started.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Getting Started")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
 
-    `,!1),e.TempleRegistry.createElement("h6",{},[e.TempleRegistry.createText("Usage",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/template-engine.html"},[e.TempleRegistry.createText("Template Engine",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/single-page.html"},[e.TempleRegistry.createText("Single Page App",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/static-site.html"},[e.TempleRegistry.createText("Static Site Generator",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/component-publisher.html"},[e.TempleRegistry.createText("Component Publisher",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/developer-tools.html"},[e.TempleRegistry.createText("Developer Tools",!1)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("h6",{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},"{ 'class': `bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),...this._toNodeList(r("Features")),e.TempleRegistry.createText(`
   `,!1)]),e.TempleRegistry.createText(`
-`,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("aside",{class:"panel-right right"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("h6",{},[...this._toNodeList(s("On this page"))]),e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("nav",{},[e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("a",{href:"#props"},[...this._toNodeList(s("Props"))]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("a",{href:"#signals"},[...this._toNodeList(s("Signals"))]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("a",{href:"#events"},[...this._toNodeList(s("Events"))]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("a",{href:"#classnames"},[...this._toNodeList(s("Class Names"))]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("a",{href:"#children"},[...this._toNodeList(s("Children"))]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("a",{href:"#env"},[...this._toNodeList(s("Env Variables"))]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("a",{href:"#this"},[...this._toNodeList(s("this"))]),e.TempleRegistry.createText(`
-      `,!1)]),e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/markup-syntax.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/markup-syntax.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/markup-syntax.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Markup Syntax")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/markup-syntax.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/markup-syntax.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Markup Syntax")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/state-management.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/state-management.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/state-management.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("State Management")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/state-management.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/state-management.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("State Management")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/component-strategy.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/component-strategy.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/component-strategy.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Component Strategy")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-strategy.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/component-strategy.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Component Strategy")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/compiler-api.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/compiler-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/compiler-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Compiler API")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/compiler-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/compiler-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Compiler API")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/client-api.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/client-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/client-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Client API")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/client-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/client-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Client API")),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("panel-main",{class:"panel-main"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("div",{class:"docs container"},[e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("h1",{},[...this._toNodeList(s("State Management"))]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Temple provides several ways to manage properties and states 
-          in your components.
+  `,!1),e.TempleRegistry.createElement("h6",{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},"{ 'class': `bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),...this._toNodeList(r("Usage")),e.TempleRegistry.createText(`
+  `,!1)]),e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/template-engine.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/template-engine.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/template-engine.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Template Engine")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/template-engine.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/template-engine.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Template Engine")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/single-page.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/single-page.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/single-page.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Single Page App")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/single-page.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/single-page.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Single Page App")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/static-site.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/static-site.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/static-site.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Static Site Generator")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/static-site.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/static-site.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Static Site Generator")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/component-publisher.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/component-publisher.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/component-publisher.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Component Publisher")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-publisher.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/component-publisher.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Component Publisher")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/developer-tools.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold mb-100",href:"/temple/docs/developer-tools.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold mb-100`, 'href': `/temple/docs/developer-tools.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Developer Tools")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 mb-100",href:"/temple/docs/developer-tools.html"},"{ 'class': `block tx-t-1 py-10 pl-10 mb-100`, 'href': `/temple/docs/developer-tools.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Developer Tools")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+`,!1)])]),e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("panel-right",{},"{ }",[e.TempleRegistry.createText(`
+        `,!1),e.TempleRegistry.createElement("menu",{class:"m-0 px-10 py-20 h-calc-full-40 bg-t-2 scroll-auto"},"{ 'class': `m-0 px-10 py-20 h-calc-full-40 bg-t-2 scroll-auto` }",[e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("h6",{class:"tx-muted tx-14 mb-0 mt-0 pb-10 tx-uppercase"},"{ 'class': `tx-muted tx-14 mb-0 mt-0 pb-10 tx-uppercase` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(r("On this page")),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("nav",{class:"tx-14 tx-lh-32"},"{ 'class': `tx-14 tx-lh-32` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-0",href:"#props"},"{ 'class': `block tx-t-0`, 'href': `#props` }",[...this._toNodeList(r("Props"))]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-0",href:"#signals"},"{ 'class': `block tx-t-0`, 'href': `#signals` }",[...this._toNodeList(r("Signals"))]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-0",href:"#events"},"{ 'class': `block tx-t-0`, 'href': `#events` }",[...this._toNodeList(r("Events"))]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-0",href:"#classnames"},"{ 'class': `block tx-t-0`, 'href': `#classnames` }",[...this._toNodeList(r("Class Names"))]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-0",href:"#children"},"{ 'class': `block tx-t-0`, 'href': `#children` }",[...this._toNodeList(r("Children"))]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-0",href:"#component"},"{ 'class': `block tx-t-0`, 'href': `#component` }",[...this._toNodeList(r("Component"))]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-0",href:"#env"},"{ 'class': `block tx-t-0`, 'href': `#env` }",[...this._toNodeList(r("Env Variables"))]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-0",href:"#this"},"{ 'class': `block tx-t-0`, 'href': `#this` }",[...this._toNodeList(r("this"))]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
         `,!1)]),e.TempleRegistry.createText(`
+      `,!1)]),e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("panel-main",{},"{ }",[e.TempleRegistry.createText(`
+        `,!1),e.TempleRegistry.createElement("api-docs",{},"{ }",[e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("h1",{class:"tx-primary tx-uppercase tx-30 py-20"},"{ 'class': `tx-primary tx-uppercase tx-30 py-20` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(r("State Management")),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            Temple provides several ways to manage properties and states 
+            in your components.
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("a",{name:"props"},[]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("h2",{},[...this._toNodeList(s("Props"))]),e.TempleRegistry.createText(`
-
-        `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",trim:!0,detab:10},[...this._toNodeList(`
-          import { props } from '@ossph/temple';
-          const { title, description } = props();
-        `)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("a",{name:"props"},"{ 'name': `props` }",[]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("h2",{class:"tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0"},"{ 'class': `tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(r("Props")),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          The `,!1),e.TempleRegistry.createElement("code",{},[e.TempleRegistry.createText("props",!1)]),e.TempleRegistry.createText(` function can be used to access the 
-          properties of a component.
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",trim:!0,detab:12},"{ 'lang': `js`, 'trim': true, 'detab': 12 }",[...this._toNodeList(`
+            import { props } from '@ossph/temple';
+            const { title, description } = props();
+          `)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("a",{name:"signals"},[]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("h2",{},[...this._toNodeList(s("Signals"))]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            The `,!1),e.TempleRegistry.createElement("code",{},"{ }",[e.TempleRegistry.createText("props",!1)]),e.TempleRegistry.createText(` function can be used to access the 
+            properties of a component.
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("p",{},[e.TempleRegistry.createText(`
-          Temple provides a reactive state management system that allows 
-          you to manage states in your components. The system is based 
-          on signals, which are reactive variables that can be used to 
-          store and update data. Signals can be used to store any type 
-          of data, including numbers, strings, objects, arrays, and even 
-          functions.
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("a",{name:"signals"},"{ 'name': `signals` }",[]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("h2",{class:"tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0"},"{ 'class': `tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(r("Signals")),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("ide-code",{trim:!0,detab:10},[...this._toNodeList(`
-          
-          Count #{count.value}
-        `)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            Temple provides a reactive state management system that allows 
+            you to manage states in your components. The system is based 
+            on signals, which are reactive variables that can be used to 
+            store and update data. Signals can be used to store any type 
+            of data, including numbers, strings, objects, arrays, and even 
+            functions.
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          To create a signal, you can use the 
-          `,!1),e.TempleRegistry.createElement("ide-code",{type:"javascript",inline:!0},[...this._toNodeList("signal()")]),e.TempleRegistry.createText(` 
-          function, which takes an initial value as an argument. Signals 
-          can be read and updated using the `,!1),e.TempleRegistry.createElement("code",{},[e.TempleRegistry.createText("value",!1)]),e.TempleRegistry.createText(` property. 
-          Setting the value will trigger a re-render of the component.
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("div",{class:"scroll-auto bg-black"},"{ 'class': `scroll-auto bg-black` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("ide-code",{trim:!0,detab:14},"{ 'trim': true, 'detab': 14 }",[...this._toNodeList(`
+              
+              Count #{count.value}
+            `)]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Signals can be used in your components to manage states and 
-          trigger updates when the state changes. You can use signals to 
-          store data that needs to be shared between components, or to 
-          trigger side effects when the state changes. Signals can also 
-          be used to store data that needs to be persisted across page 
-          reloads, such as form data or user preferences.
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            To create a signal, you can use the 
+            `,!1),e.TempleRegistry.createElement("ide-code",{type:"javascript",inline:!0},"{ 'type': `javascript`, 'inline': true }",[...this._toNodeList("signal()")]),e.TempleRegistry.createText(` 
+            function, which takes an initial value as an argument. Signals 
+            can be read and updated using the `,!1),e.TempleRegistry.createElement("code",{},"{ }",[e.TempleRegistry.createText("value",!1)]),e.TempleRegistry.createText(` property. 
+            Setting the value will trigger a re-render of the component.
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("a",{name:"events"},[]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("h2",{},[...this._toNodeList(s("Events"))]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            Signals can be used in your components to manage states and 
+            trigger updates when the state changes. You can use signals to 
+            store data that needs to be shared between components, or to 
+            trigger side effects when the state changes. Signals can also 
+            be used to store data that needs to be persisted across page 
+            reloads, such as form data or user preferences.
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("ide-code",{trim:!0,number:!0,detab:10},[...this._toNodeList(`
-          
+          `,!1),e.TempleRegistry.createElement("a",{name:"events"},"{ 'name': `events` }",[]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("h2",{class:"tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0"},"{ 'class': `tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(r("Events")),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
 
-          
+          `,!1),e.TempleRegistry.createElement("div",{class:"scroll-auto bg-black"},"{ 'class': `scroll-auto bg-black` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("ide-code",{trim:!0,number:!0,detab:14},"{ 'trim': true, 'number': true, 'detab': 14 }",[...this._toNodeList(`
+              
 
-          
-          
-          
-          
-          
-          
-          
-          
-          
-          
-        `)]),e.TempleRegistry.createText(`
+              
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          For example, you can use the `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("click",!1)]),e.TempleRegistry.createText(` 
-          attribute assigned to a function to trigger a function when 
-          the element is clicked. In combination with updating a signal, 
-          can trigger a re-render of the component. The following event 
-          attributes are supported.
-        `,!1)]),e.TempleRegistry.createText(`
+              
+              
+              
+              
+              
+              
+              
+              
+              
+              
+            `)]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("div",{class:"col-2"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("div",{},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("h3",{},[...this._toNodeList(s("Mouse Events"))]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("ul",{},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("click",!1)])]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("dblclick",!1)])]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("mousedown",!1)])]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("mouseup",!1)])]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("mousemove",!1)])]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("mouseover",!1)])]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("mouseout",!1)])]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("wheel",!1)])]),e.TempleRegistry.createText(`
-            `,!1)]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("h3",{},[...this._toNodeList(s("Keyboard Events"))]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("ul",{},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("keydown",!1)])]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("keypress",!1)])]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("keyup",!1)])]),e.TempleRegistry.createText(`
-            `,!1)]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("h3",{},[...this._toNodeList(s("Form Events"))]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("ul",{},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("blur",!1)])]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("change",!1)])]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("contextmenu",!1)])]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("focus",!1)])]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("input",!1)])]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("submit",!1)])]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("invalid",!1)])]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("reset",!1)])]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("search",!1)])]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("select",!1)])]),e.TempleRegistry.createText(`
-            `,!1)]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("h3",{},[...this._toNodeList(s("Clipboard Events"))]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("ul",{},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("copy",!1)])]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("cut",!1)])]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("paste",!1)])]),e.TempleRegistry.createText(`
-            `,!1)]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("h3",{},[...this._toNodeList(s("Transition Events"))]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("ul",{},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("transitionend",!1)])]),e.TempleRegistry.createText(`
-            `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            For example, you can use the `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("click",!1)]),e.TempleRegistry.createText(` 
+            attribute assigned to a function to trigger a function when 
+            the element is clicked. In combination with updating a signal, 
+            can trigger a re-render of the component. The following event 
+            attributes are supported.
           `,!1)]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("div",{},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("h3",{},[...this._toNodeList(s("Drag Events"))]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("ul",{},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("drag",!1)])]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("dragstart",!1)])]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("dragend",!1)])]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("dragover",!1)])]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("dragenter",!1)])]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("dragleave",!1)])]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("drop",!1)])]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("scroll",!1)])]),e.TempleRegistry.createText(`
-            `,!1)]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("h3",{},[...this._toNodeList(s("Media Events"))]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("ul",{},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("durationchange",!1)])]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("ended",!1)])]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("error",!1)])]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("loadeddata",!1)])]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("loadedmetadata",!1)])]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("loadstart",!1)])]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("pause",!1)])]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("play",!1)])]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("playing",!1)])]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("progress",!1)])]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("ratechange",!1)])]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("seeked",!1)])]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("seeking",!1)])]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("stalled",!1)])]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("suspend",!1)])]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("timeupdate",!1)])]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("volumechange",!1)])]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("waiting",!1)])]),e.TempleRegistry.createText(`
+
+          `,!1),e.TempleRegistry.createElement("div",{class:"col-2"},"{ 'class': `col-2` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("div",{},"{ }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("h3",{},"{ }",[...this._toNodeList(r("Mouse Events"))]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("ul",{class:"tx-lh-36"},"{ 'class': `tx-lh-36` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("click",!1)])]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("dblclick",!1)])]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("mousedown",!1)])]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("mouseup",!1)])]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("mousemove",!1)])]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("mouseover",!1)])]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("mouseout",!1)])]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("wheel",!1)])]),e.TempleRegistry.createText(`
+              `,!1)]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("h3",{},"{ }",[...this._toNodeList(r("Keyboard Events"))]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("ul",{class:"tx-lh-36"},"{ 'class': `tx-lh-36` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("keydown",!1)])]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("keypress",!1)])]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("keyup",!1)])]),e.TempleRegistry.createText(`
+              `,!1)]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("h3",{},"{ }",[...this._toNodeList(r("Form Events"))]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("ul",{class:"tx-lh-36"},"{ 'class': `tx-lh-36` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("blur",!1)])]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("change",!1)])]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("contextmenu",!1)])]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("focus",!1)])]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("input",!1)])]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("submit",!1)])]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("invalid",!1)])]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("reset",!1)])]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("search",!1)])]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("select",!1)])]),e.TempleRegistry.createText(`
+              `,!1)]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("h3",{},"{ }",[...this._toNodeList(r("Clipboard Events"))]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("ul",{class:"tx-lh-36"},"{ 'class': `tx-lh-36` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("copy",!1)])]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("cut",!1)])]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("paste",!1)])]),e.TempleRegistry.createText(`
+              `,!1)]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("h3",{},"{ }",[...this._toNodeList(r("Transition Events"))]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("ul",{class:"tx-lh-36"},"{ 'class': `tx-lh-36` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("transitionend",!1)])]),e.TempleRegistry.createText(`
+              `,!1)]),e.TempleRegistry.createText(`
             `,!1)]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("h3",{},[...this._toNodeList(s("Animation Events"))]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("ul",{},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("animationstart",!1)])]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("animationend",!1)])]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("animationiteration",!1)])]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("div",{},"{ }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("h3",{},"{ }",[...this._toNodeList(r("Drag Events"))]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("ul",{class:"tx-lh-36"},"{ 'class': `tx-lh-36` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("drag",!1)])]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("dragstart",!1)])]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("dragend",!1)])]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("dragover",!1)])]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("dragenter",!1)])]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("dragleave",!1)])]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("drop",!1)])]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("scroll",!1)])]),e.TempleRegistry.createText(`
+              `,!1)]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("h3",{},"{ }",[...this._toNodeList(r("Media Events"))]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("ul",{class:"tx-lh-36"},"{ 'class': `tx-lh-36` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("durationchange",!1)])]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("ended",!1)])]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("error",!1)])]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("loadeddata",!1)])]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("loadedmetadata",!1)])]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("loadstart",!1)])]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("pause",!1)])]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("play",!1)])]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("playing",!1)])]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("progress",!1)])]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("ratechange",!1)])]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("seeked",!1)])]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("seeking",!1)])]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("stalled",!1)])]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("suspend",!1)])]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("timeupdate",!1)])]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("volumechange",!1)])]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("waiting",!1)])]),e.TempleRegistry.createText(`
+              `,!1)]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("h3",{},"{ }",[...this._toNodeList(r("Animation Events"))]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("ul",{class:"tx-lh-36"},"{ 'class': `tx-lh-36` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("animationstart",!1)])]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("animationend",!1)])]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("li",{},"{ }",[e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("animationiteration",!1)])]),e.TempleRegistry.createText(`
+              `,!1)]),e.TempleRegistry.createText(`
             `,!1)]),e.TempleRegistry.createText(`
           `,!1)]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("a",{name:"classnames"},[]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("h2",{},[...this._toNodeList(s("Class Names"))]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("a",{name:"classnames"},"{ 'name': `classnames` }",[]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("h2",{class:"tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0"},"{ 'class': `tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(r("Class Names")),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",trim:!0,detab:10},[...this._toNodeList(`
-          import { classnames } from '@ossph/temple';
-          const classlist = classnames(); //--> 'class1 class2 class3'
-        `)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("div",{class:"scroll-auto bg-black"},"{ 'class': `scroll-auto bg-black` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",trim:!0,detab:14},"{ 'lang': `js`, 'trim': true, 'detab': 14 }",[...this._toNodeList(`
+              import { classnames } from '@ossph/temple';
+              const classlist = classnames(); //--> 'class1 class2 class3'
+            `)]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          The `,!1),e.TempleRegistry.createElement("code",{},[e.TempleRegistry.createText("classnames",!1)]),e.TempleRegistry.createText(` function can be used to generate 
-          a list of class names based on the properties of an object.
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            The `,!1),e.TempleRegistry.createElement("code",{},"{ }",[e.TempleRegistry.createText("classnames",!1)]),e.TempleRegistry.createText(` function can be used to generate 
+            a list of class names based on the properties of an object.
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("a",{name:"children"},[]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("h2",{},[...this._toNodeList(s("Children"))]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("a",{name:"children"},"{ 'name': `children` }",[]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("h2",{class:"tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0"},"{ 'class': `tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(r("Children")),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",trim:!0,detab:10},[...this._toNodeList(`
-          import { children } from '@ossph/temple';
-          const childlist = children(); //--> Node[]
-        `)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          The `,!1),e.TempleRegistry.createElement("code",{},[e.TempleRegistry.createText("children",!1)]),e.TempleRegistry.createText(` function can be used to render 
-          child components in a parent component.
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("div",{class:"scroll-auto bg-black"},"{ 'class': `scroll-auto bg-black` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",trim:!0,detab:14},"{ 'lang': `js`, 'trim': true, 'detab': 14 }",[...this._toNodeList(`
+              import { children } from '@ossph/temple';
+              const childlist = children(); //--> Node[]
+            `)]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            The `,!1),e.TempleRegistry.createElement("code",{},"{ }",[e.TempleRegistry.createText("children",!1)]),e.TempleRegistry.createText(` function can be used to render 
+            child components in a parent component.
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("a",{name:"env"},[]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("h2",{},[...this._toNodeList(s("Environment Variables"))]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("a",{name:"component"},"{ 'name': `component` }",[]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("h2",{class:"tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0"},"{ 'class': `tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(r("Component")),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("ide-code",{trim:!0,detab:10},[...this._toNodeList(`
-          
-          
-            
    Development mode
    
-              
-        `)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          The `,!1),e.TempleRegistry.createElement("code",{},[e.TempleRegistry.createText("env",!1)]),e.TempleRegistry.createText(` function can be used to access environment 
-          variables in a component.
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("div",{class:"scroll-auto bg-black"},"{ 'class': `scroll-auto bg-black` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",trim:!0,detab:14},"{ 'lang': `js`, 'trim': true, 'detab': 14 }",[...this._toNodeList(`
+              import { component } from '@ossph/temple';
+              const button = component(); //--> HTMLElement
+              console.log(button.querySelector('span'));
+            `)]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            For other edge cases, the `,!1),e.TempleRegistry.createElement("code",{},"{ }",[e.TempleRegistry.createText("component",!1)]),e.TempleRegistry.createText(` function 
+            can be used to get raw access to the component's 
+            functionality.
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("a",{name:"this"},[]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("h2",{},[...this._toNodeList(s("this"))]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("a",{name:"env"},"{ 'name': `env` }",[]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("h2",{class:"tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0"},"{ 'class': `tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(r("Environment Variables")),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("ide-app",{title:"What's this"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("ide-code",{numbers:!0,detab:12},[...this._toNodeList(`
+          `,!1),e.TempleRegistry.createElement("ide-code",{trim:!0,detab:12},"{ 'trim': true, 'detab': 12 }",[...this._toNodeList(`
             
+            
+              
    Development mode
    
+                
           `)]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            The `,!1),e.TempleRegistry.createElement("code",{},"{ }",[e.TempleRegistry.createText("env",!1)]),e.TempleRegistry.createText(` function can be used to access environment 
+            variables in a component.
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("this",!1)]),e.TempleRegistry.createText(` refers to the 
-          `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("TempleComponent",!1)]),e.TempleRegistry.createText(` that extends 
-          `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("HTMLElement",!1)]),e.TempleRegistry.createText(`. This means all
-          components in Temple are in fact are HTML elements and has
-          access to the common functionality like 
-          `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("innerHTML",!1)]),e.TempleRegistry.createText(` and
-          `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList("querySelector()")]),e.TempleRegistry.createText(` to name a 
-          few. `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("TempleComponent",!1)]),e.TempleRegistry.createText(` has the
-          additional following properties and methods that you can access
-          using `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("this",!1)]),e.TempleRegistry.createText(`.
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("a",{name:"this"},"{ 'name': `this` }",[]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("h2",{class:"tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0"},"{ 'class': `tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(r("this")),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("api-ui",{start:"TempleComponent"}),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("ide-app",{title:"What's this",class:"py-20"},"{ 'title': `What's this`, 'class': `py-20` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("ide-code",{numbers:!0,detab:14},"{ 'numbers': true, 'detab': 14 }",[...this._toNodeList(`
+              
+            `)]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("tui-alert",{curved:!0,info:!0},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-info-circle"},[]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("strong",{},[e.TempleRegistry.createText("Info:",!1)]),e.TempleRegistry.createText(` You can discover more methods and properties
-          of the `,!1),e.TempleRegistry.createElement("code",{},[e.TempleRegistry.createText("HTMLElement",!1)]),e.TempleRegistry.createText(` class on the
-          `,!1),e.TempleRegistry.createElement("a",{target:"_blank",href:"https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement"},[e.TempleRegistry.createText(`
-            MDN Web Docs
-          `,!1)]),e.TempleRegistry.createText(`.
-        `,!1)]),e.TempleRegistry.createText(`
-        
-        `,!1),e.TempleRegistry.createElement("nav",{class:"pager"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("a",{class:"prev",href:"/temple/docs/markup-syntax.html"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-left"},[]),e.TempleRegistry.createText(`
-            `,!1),...this._toNodeList(s("Markup Syntax")),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("this",!1)]),e.TempleRegistry.createText(` refers to the 
+            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("TempleComponent",!1)]),e.TempleRegistry.createText(` that extends 
+            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("HTMLElement",!1)]),e.TempleRegistry.createText(`. This means all
+            components in Temple are in fact are HTML elements and has
+            access to the common functionality like 
+            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("innerHTML",!1)]),e.TempleRegistry.createText(` and
+            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[...this._toNodeList("querySelector()")]),e.TempleRegistry.createText(` to name a 
+            few. `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("TempleComponent",!1)]),e.TempleRegistry.createText(` has the
+            additional following properties and methods that you can access
+            using `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("this",!1)]),e.TempleRegistry.createText(`.
+          `,!1)]),e.TempleRegistry.createText(`
+
+          `,!1),e.TempleRegistry.createElement("api-ui",{start:"TempleComponent"},"{ 'start': `TempleComponent` }"),e.TempleRegistry.createText(`
+
+          `,!1),e.TempleRegistry.createElement("tui-alert",{curved:!0,info:!0,class:"py-20 tx-lh-24"},"{ 'curved': true, 'info': true, 'class': `py-20 tx-lh-24` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-info-circle"},"{ 'class': `fas fa-fw fa-info-circle` }",[]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("strong",{},"{ }",[e.TempleRegistry.createText("Info:",!1)]),e.TempleRegistry.createText(` You can discover more methods and properties
+            of the `,!1),e.TempleRegistry.createElement("code",{},"{ }",[e.TempleRegistry.createText("HTMLElement",!1)]),e.TempleRegistry.createText(` class on the
+            `,!1),e.TempleRegistry.createElement("a",{target:"_blank",class:"tx-white tx-underline",href:"https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement"},"{ 'target': `_blank`, 'class': `tx-white tx-underline`, 'href': `https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement` }",[e.TempleRegistry.createText(`
+              MDN Web Docs
+            `,!1)]),e.TempleRegistry.createText(`.
           `,!1)]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("a",{class:"next",href:"/temple/docs/component-strategy.html"},[e.TempleRegistry.createText(`
-            `,!1),...this._toNodeList(s("Component Strategy")),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-right"},[]),e.TempleRegistry.createText(`
+
+          `,!1),e.TempleRegistry.createElement("nav",{class:"flex"},"{ 'class': `flex` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"tx-primary py-40",href:"/temple/docs/markup-syntax.html"},"{ 'class': `tx-primary py-40`, 'href': `/temple/docs/markup-syntax.html` }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-left tx-t-1"},"{ 'class': `fas fa-fw fa-chevron-left tx-t-1` }",[]),e.TempleRegistry.createText(`
+              `,!1),...this._toNodeList(r("Markup Syntax")),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"flex-grow tx-right tx-primary py-40",href:"/temple/docs/component-strategy.html"},"{ 'class': `flex-grow tx-right tx-primary py-40`, 'href': `/temple/docs/component-strategy.html` }",[e.TempleRegistry.createText(`
+              `,!1),...this._toNodeList(r("Component Strategy")),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-right tx-t-1"},"{ 'class': `fas fa-fw fa-chevron-right tx-t-1` }",[]),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
           `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("footer",{class:"foot"},"{ 'class': `foot` }",[]),e.TempleRegistry.createText(`
         `,!1)]),e.TempleRegistry.createText(`
       `,!1)]),e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("footer",{class:"foot"},[]),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
   `,!1)]),e.TempleRegistry.createText(`
-`,!1)])]}};return se(Ve);})();
+`,!1)])]}};return re(Pe);})();
diff --git a/docs/build/server/2d721d6aed73f41f4e72.js b/docs/build/server/2d721d6aed73f41f4e72.js
index a8ccaaa..89f81fc 100644
--- a/docs/build/server/2d721d6aed73f41f4e72.js
+++ b/docs/build/server/2d721d6aed73f41f4e72.js
@@ -1,131 +1,245 @@
-var TempleAPI=(()=>{var ee=Object.create;var E=Object.defineProperty;var te=Object.getOwnPropertyDescriptor;var ae=Object.getOwnPropertyNames;var re=Object.getPrototypeOf,se=Object.prototype.hasOwnProperty;var c=(a,t)=>()=>(t||a((t={exports:{}}).exports,t),t.exports),le=(a,t)=>{for(var r in t)E(a,r,{get:t[r],enumerable:!0})},W=(a,t,r,s)=>{if(t&&typeof t=="object"||typeof t=="function")for(let n of ae(t))!se.call(a,n)&&n!==r&&E(a,n,{get:()=>t[n],enumerable:!(s=te(t,n))||s.enumerable});return a};var F=(a,t,r)=>(r=a!=null?ee(re(a)):{},W(t||!a||!a.__esModule?E(r,"default",{value:a,enumerable:!0}):r,a)),ne=a=>W(E({},"__esModule",{value:!0}),a);var P=c(D=>{"use strict";Object.defineProperty(D,"__esModule",{value:!0});var j=class extends Error{static for(t,...r){return r.forEach(function(s){t=t.replace("%s",s)}),new this(t)}static forErrorsFound(t){let r=new this("Invalid Parameters");return r.errors=t,r}static require(t,r,...s){if(!t){for(let n of s)r=r.replace("%s",n);throw new this(r)}}constructor(t,r=500){super(),this.errors={},this.start=0,this.end=0,this.message=t,this.name=this.constructor.name,this.code=r}withCode(t){return this.code=t,this}withPosition(t,r){return this.start=t,this.end=r,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};D.default=j});var q=c(M=>{"use strict";Object.defineProperty(M,"__esModule",{value:!0});var O=class{constructor(t=[]){this._elements=new Set,t.forEach(r=>this._elements.add(r))}add(t){this._elements.add(t)}toArray(){return Array.from(this._elements)}toString(){return Array.from(this._elements).filter(Boolean).map(t=>t.toString()).join("")}};M.default=O});var m=c(S=>{"use strict";Object.defineProperty(S,"__esModule",{value:!0});var ce=new Map;S.default=ce});var b=c(u=>{"use strict";var ie=u&&u.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(u,"__esModule",{value:!0});var oe=ie(q()),fe=["area","base","br","col","embed","hr","img","input","link","meta","param","source","track","wbr"],A=class{static render(t){return t.filter(Boolean).map(r=>r.toString()).join("")}get name(){return this._name}get attributes(){return this._attributes}get children(){return this._children}constructor(t,r={},s=[]){this._attributes={},this._name=t,this._attributes=r,this._children=new oe.default(s)}toString(){let t=Object.entries(this._attributes),r=t.length>0?" "+t.map(([n,f])=>{if(typeof f=="string")return`${n}="${f}"`;if(typeof f=="boolean")return f?n:""}).join(" "):"";if(fe.includes(this._name))return`<${this._name}${r} />`;let s=this._children.toString();return`<${this._name}${r}>${s}`}};u.default=A});var k=c(I=>{"use strict";Object.defineProperty(I,"__esModule",{value:!0});var L=class{get value(){return this._escape?this._value.replace(/&/g,"&").replace(//g,">"):this._value}constructor(t,r=!1){this._escape=r,this._value=t}toString(){return this.value}};I.default=L});var $=c(p=>{"use strict";var G=p&&p.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(p,"__esModule",{value:!0});var me=G(k()),ue=G(b()),C=class{static createElement(t,r,s=[]){return new ue.default(t,r,s)}static createText(t,r=!0){return new me.default(t,r)}};p.default=C});var J=c(d=>{"use strict";var y=d&&d.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(d,"__esModule",{value:!0});var pe=y(P()),N=y(m()),de=y(b()),he=y($()),B=class{render(t={}){N.default.set("props",t||{}),N.default.set("env",Object.assign(Object.assign({},process.env||{}),{BUILD_ID:this.id(),APP_DATA:btoa(JSON.stringify(Object.assign(Object.assign({},Object.fromEntries(N.default.entries())),{env:Object.assign(Object.assign({},Object.fromEntries(Object.entries(process.env||{}).filter(n=>n[0].startsWith("PUBLIC_")))),{BUILD_ID:this.id()})})))}));let r=this.template(),s=de.default.render(r).trim();if(!s.toLowerCase().startsWith(" tag.");return`
-${s}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:Array.isArray(t)&&t.every(r=>typeof r=="object"&&typeof r.nodeType=="number")?t:[he.default.createText(String(t))]}};d.default=B});var Y=c(h=>{"use strict";Object.defineProperty(h,"__esModule",{value:!0});h.TempleEmitter=void 0;var v=class{emit(t,r){return this}on(t,r){return this}once(t,r){return this}unbind(t,r){return this}};h.TempleEmitter=v;var Te=new v;h.default=Te});var z=c(T=>{"use strict";var xe=T&&T.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(T,"__esModule",{value:!0});var _e=xe(m());function ge(a){let t=_e.default.get("env")||{};return a?t[a]||null:t}T.default=ge});var U=c(x=>{"use strict";var Ee=x&&x.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(x,"__esModule",{value:!0});x.default=ye;var be=Ee(m());function ye(){return be.default.get("props")||{}}});var V=c(_=>{"use strict";var ve=_&&_.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(_,"__esModule",{value:!0});_.default=je;var we=ve(U());function je(){return(0,we.default)().class}});var K=c(H=>{"use strict";Object.defineProperty(H,"__esModule",{value:!0});H.default=De;function De(a){let t={getter:()=>r.raw,setter:s=>s},r={raw:a,getter(s){return t.getter=s,r},setter(s){return t.setter=s,r}};return Object.defineProperty(r,"value",{get(){return t.getter()},set(s){r.raw=t.setter(s)}}),r}});var X=c(l=>{"use strict";var Pe=l&&l.__createBinding||(Object.create?function(a,t,r,s){s===void 0&&(s=r);var n=Object.getOwnPropertyDescriptor(t,r);(!n||("get"in n?!t.__esModule:n.writable||n.configurable))&&(n={enumerable:!0,get:function(){return t[r]}}),Object.defineProperty(a,s,n)}:function(a,t,r,s){s===void 0&&(s=r),a[s]=t[r]}),Oe=l&&l.__setModuleDefault||(Object.create?function(a,t){Object.defineProperty(a,"default",{enumerable:!0,value:t})}:function(a,t){a.default=t}),Me=l&&l.__importStar||function(a){if(a&&a.__esModule)return a;var t={};if(a!=null)for(var r in a)r!=="default"&&Object.prototype.hasOwnProperty.call(a,r)&&Pe(t,a,r);return Oe(t,a),t},i=l&&l.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(l,"__esModule",{value:!0});l.TempleText=l.TempleException=l.TempleEmitter=l.TempleElement=l.TempleRegistry=l.TempleDocument=l.TempleCollection=l.signal=l.classnames=l.props=l.emitter=l.env=l.data=void 0;var qe=i(P());l.TempleException=qe.default;var Se=i(q());l.TempleCollection=Se.default;var Ae=i(J());l.TempleDocument=Ae.default;var Le=i($());l.TempleRegistry=Le.default;var Ie=i(b());l.TempleElement=Ie.default;var Q=Me(Y());l.emitter=Q.default;Object.defineProperty(l,"TempleEmitter",{enumerable:!0,get:function(){return Q.TempleEmitter}});var ke=i(k());l.TempleText=ke.default;var Ce=i(m());l.data=Ce.default;var $e=i(z());l.env=$e.default;var Ne=i(U());l.props=Ne.default;var Be=i(V());l.classnames=Be.default;var Ue=i(K());l.signal=Ue.default});var R=c((rt,Z)=>{Z.exports={...X()}});var Re={};le(Re,{default:()=>w});var e=F(R()),g=F(R());var o=function(a,...t){let r=He(a);for(let s=0;s{document.body.classList.toggle("panel-left-open")};return[e.TempleRegistry.createText(`
-`,!1),e.TempleRegistry.createElement("html",{},[e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("head",{},[e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{charset:"utf-8"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"viewport",content:"width=device-width, initial-scale=1"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("title",{},[...this._toNodeList(r)]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"description",content:s}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:title",content:r}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:description",content:s}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:image",content:"https://ossphilippines.github.io/temple/temple-logo.png"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:url",content:`https://ossphilippines.github.io/temple${t}`}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:type",content:"website"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:card",content:"summary"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:site",content:"@OSSPhilippines"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:title",content:r}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:description",content:s}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:image",content:"https://ossphilippines.github.io/temple/temple-logo.png"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"favicon",href:"/temple/favicon.ico"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"shortcut icon",type:"image/png",href:"/temple/favicon.png"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/fontawesome/all.css"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/theme.css"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:`/temple/build/client/${(0,g.env)("BUILD_ID")}.css`}),e.TempleRegistry.createText(`
+var TempleAPI=(()=>{var X=Object.create;var g=Object.defineProperty;var Z=Object.getOwnPropertyDescriptor;var ee=Object.getOwnPropertyNames;var te=Object.getPrototypeOf,ae=Object.prototype.hasOwnProperty;var n=(a,t)=>()=>(t||a((t={exports:{}}).exports,t),t.exports),le=(a,t)=>{for(var l in t)g(a,l,{get:t[l],enumerable:!0})},H=(a,t,l,s)=>{if(t&&typeof t=="object"||typeof t=="function")for(let i of ee(t))!ae.call(a,i)&&i!==l&&g(a,i,{get:()=>t[i],enumerable:!(s=Z(t,i))||s.enumerable});return a};var G=(a,t,l)=>(l=a!=null?X(te(a)):{},H(t||!a||!a.__esModule?g(l,"default",{value:a,enumerable:!0}):l,a)),se=a=>H(g({},"__esModule",{value:!0}),a);var w=n(v=>{"use strict";Object.defineProperty(v,"__esModule",{value:!0});var E=class extends Error{static for(t,...l){return l.forEach(function(s){t=t.replace("%s",s)}),new this(t)}static forErrorsFound(t){let l=new this("Invalid Parameters");return l.errors=t,l}static require(t,l,...s){if(!t){for(let i of s)l=l.replace("%s",i);throw new this(l)}}constructor(t,l=500){super(),this.errors={},this.start=0,this.end=0,this.message=t,this.name=this.constructor.name,this.code=l}withCode(t){return this.code=t,this}withPosition(t,l){return this.start=t,this.end=l,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};v.default=E});var L=n(j=>{"use strict";Object.defineProperty(j,"__esModule",{value:!0});var k=class{get length(){return this._elements.size}constructor(t=[]){this._elements=new Set,t.forEach(l=>this._elements.add(l))}add(t){this._elements.add(t)}toArray(){return Array.from(this._elements)}toString(){return Array.from(this._elements).filter(Boolean).map(t=>t.toString()).join("")}};j.default=k});var p=n(D=>{"use strict";Object.defineProperty(D,"__esModule",{value:!0});var re=new Map;D.default=re});var S=n(N=>{"use strict";Object.defineProperty(N,"__esModule",{value:!0});var P=class{get value(){return this._escape?this._value.replace(/&/g,"&").replace(//g,">"):this._value}constructor(t,l=!1){this._escape=l,this._value=t}toString(){return this.value}};N.default=P});var A=n(f=>{"use strict";var ce=f&&f.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(f,"__esModule",{value:!0});var ie=ce(L()),ne=["area","base","br","col","embed","hr","img","input","link","meta","param","source","track","wbr"],O=class{get attributes(){return this._attributes}get children(){return this._children}get name(){return this._name}get props(){return this._props}constructor(t,l={},s="",i=[]){this._attributes={},this._name=t,this._attributes=l,this._props=s,this._children=new ie.default(i)}toString(){let t=Object.entries(this._attributes),l=t.length>0?" "+t.map(([i,b])=>{if(typeof b=="string")return`${i}="${b}"`;if(typeof b=="boolean")return b?i:""}).join(" "):"";if(ne.includes(this._name))return`<${this._name}${l} />`;let s=this._children.toString();return`<${this._name}${l}>${s}`}};f.default=O});var I=n(m=>{"use strict";var W=m&&m.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(m,"__esModule",{value:!0});var oe=W(S()),R=W(A()),M=class{static render(t){return t.filter(Boolean).map(l=>l.toString()).join("")}static registry(t,l=new Set){return t.forEach(s=>{s instanceof R.default&&(["html","head","body"].includes(s.name)||l.add(s),s.name!=="head"&&s.children.length>0&&this.registry(s.children.toArray(),l))}),l}static createElement(t,l,s,i=[]){return new R.default(t,l,s,i)}static createText(t,l=!0){return new oe.default(t,l)}};m.default=M});var F=n(x=>{"use strict";var B=x&&x.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(x,"__esModule",{value:!0});var pe=B(w()),q=B(p()),$=B(I()),C=class{bindings(){let t=$.default.registry(this.template());return`{ ${Array.from(t.values()).map((s,i)=>s.props!=="{ }"?`'${i}': ${s.props}`:"").filter(s=>s!=="").join(", ")} }`}render(t={}){q.default.set("props",t||{}),q.default.set("env",Object.assign(Object.assign({},process.env||{}),{BUILD_ID:this.id(),APP_DATA:btoa(JSON.stringify(Object.assign(Object.assign({},Object.fromEntries(q.default.entries())),{env:Object.assign(Object.assign({},Object.fromEntries(Object.entries(process.env||{}).filter(i=>i[0].startsWith("PUBLIC_")))),{BUILD_ID:this.id()})})))}));let l=this.template(),s=$.default.render(l).trim();if(!s.toLowerCase().startsWith(" tag.");return`
+${s}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:Array.isArray(t)&&t.every(l=>typeof l=="object"&&typeof l.nodeType=="number")?t:[$.default.createText(String(t))]}};x.default=C});var z=n(d=>{"use strict";Object.defineProperty(d,"__esModule",{value:!0});d.TempleEmitter=void 0;var y=class{emit(t,l){return this}on(t,l){return this}once(t,l){return this}unbind(t,l){return this}};d.TempleEmitter=y;var fe=new y;d.default=fe});var J=n(u=>{"use strict";var me=u&&u.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(u,"__esModule",{value:!0});var xe=me(p());function de(a){let t=xe.default.get("env")||{};return a?t[a]||null:t}u.default=de});var Y=n(h=>{"use strict";var ue=h&&h.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(h,"__esModule",{value:!0});h.default=Te;var he=ue(p());function Te(){return he.default.get("props")||{}}});var K=n(c=>{"use strict";var be=c&&c.__createBinding||(Object.create?function(a,t,l,s){s===void 0&&(s=l);var i=Object.getOwnPropertyDescriptor(t,l);(!i||("get"in i?!t.__esModule:i.writable||i.configurable))&&(i={enumerable:!0,get:function(){return t[l]}}),Object.defineProperty(a,s,i)}:function(a,t,l,s){s===void 0&&(s=l),a[s]=t[l]}),ge=c&&c.__setModuleDefault||(Object.create?function(a,t){Object.defineProperty(a,"default",{enumerable:!0,value:t})}:function(a,t){a.default=t}),ye=c&&c.__importStar||function(a){if(a&&a.__esModule)return a;var t={};if(a!=null)for(var l in a)l!=="default"&&Object.prototype.hasOwnProperty.call(a,l)&&be(t,a,l);return ge(t,a),t},o=c&&c.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(c,"__esModule",{value:!0});c.TempleText=c.TempleException=c.TempleEmitter=c.TempleElement=c.TempleRegistry=c.TempleDocument=c.TempleCollection=c.props=c.emitter=c.env=c.data=void 0;var _e=o(w());c.TempleException=_e.default;var Ee=o(L());c.TempleCollection=Ee.default;var ve=o(F());c.TempleDocument=ve.default;var we=o(I());c.TempleRegistry=we.default;var ke=o(A());c.TempleElement=ke.default;var V=ye(z());c.emitter=V.default;Object.defineProperty(c,"TempleEmitter",{enumerable:!0,get:function(){return V.TempleEmitter}});var je=o(S());c.TempleText=je.default;var Le=o(p());c.data=Le.default;var De=o(J());c.env=De.default;var Pe=o(Y());c.props=Pe.default});var U=n((We,Q)=>{Q.exports={...K()}});var Se={};le(Se,{default:()=>_});var e=G(U()),T=G(U());var r=function(a,...t){let l=Ne(a);for(let s=0;s{document.getElementsByTagName("panel-layout")[0].toggle("left")};return[e.TempleRegistry.createText(`
+`,!1),e.TempleRegistry.createElement("html",{},"{ }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("head",{},"{ }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{charset:"utf-8"},"{ 'charset': `utf-8` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"viewport",content:"width=device-width, initial-scale=1"},"{ 'name': `viewport`, 'content': `width=device-width, initial-scale=1` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("title",{},"{ }",[...this._toNodeList(l)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"description",content:s},"{ 'name': `description`, 'content': description }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:title",content:l},"{ 'property': `og:title`, 'content': title }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:description",content:s},"{ 'property': `og:description`, 'content': description }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:image",content:"https://ossphilippines.github.io/temple/temple-logo.png"},"{ 'property': `og:image`, 'content': `https://ossphilippines.github.io/temple/temple-logo.png` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:url",content:`https://ossphilippines.github.io/temple${t}`},"{ 'property': `og:url`, 'content': `https://ossphilippines.github.io/temple${url}` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:type",content:"website"},"{ 'property': `og:type`, 'content': `website` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:card",content:"summary"},"{ 'name': `twitter:card`, 'content': `summary` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:site",content:"@OSSPhilippines"},"{ 'name': `twitter:site`, 'content': `@OSSPhilippines` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:title",content:l},"{ 'name': `twitter:title`, 'content': title }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:description",content:s},"{ 'name': `twitter:description`, 'content': description }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:image",content:"https://ossphilippines.github.io/temple/temple-logo.png"},"{ 'name': `twitter:image`, 'content': `https://ossphilippines.github.io/temple/temple-logo.png` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"favicon",href:"/temple/favicon.ico"},"{ 'rel': `favicon`, 'href': `/temple/favicon.ico` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"shortcut icon",type:"image/png",href:"/temple/favicon.png"},"{ 'rel': `shortcut icon`, 'type': `image/png`, 'href': `/temple/favicon.png` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/fontawesome/all.css"},"{ 'rel': `stylesheet`, 'type': `text/css`, 'href': `/temple/styles/fontawesome/all.css` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/global.css"},"{ 'rel': `stylesheet`, 'type': `text/css`, 'href': `/temple/styles/global.css` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:`/temple/build/client/${(0,T.env)("BUILD_ID")}.css`},"{ 'rel': `stylesheet`, 'type': `text/css`, 'href': `/temple/build/client/${env('BUILD_ID')}.css` }"),e.TempleRegistry.createText(`
   
-  `,!1),e.TempleRegistry.createElement("script",{"data-app":(0,g.env)("APP_DATA"),src:`/temple/build/client/${(0,g.env)("BUILD_ID")}.js`}),e.TempleRegistry.createText(`
-  `,!1),...(0,g.env)("NODE_ENV")==="development"?[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("script",{src:"/dev.js"}),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("script",{"data-app":(0,T.env)("APP_DATA"),src:`/temple/build/client/${(0,T.env)("BUILD_ID")}.js`},"{ 'data-app': env('APP_DATA'), 'src': `/temple/build/client/${env('BUILD_ID')}.js` }"),e.TempleRegistry.createText(`
+  `,!1),...(0,T.env)("NODE_ENV")==="development"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("script",{src:"/dev.js"},"{ 'src': `/dev.js` }"),e.TempleRegistry.createText(`
   `,!1)]:[],e.TempleRegistry.createText(`
 `,!1)]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("body",{class:"dark panel with-head with-left"},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("header",{class:"head panel-head"},[e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("i",{class:"menu fas fa-fw fa-bars",click:n},[]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("a",{href:"/temple"},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("img",{src:"/temple/temple-icon.png",alt:"Temple Logo"}),e.TempleRegistry.createText(`
-  `,!1)]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("h3",{},[e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple"},[e.TempleRegistry.createText("Temple",!1)])]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("nav",{},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple/docs/index.html"},[e.TempleRegistry.createText("Docs",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{class:"github",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-github"},[]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("body",{class:"dark bg-t-0 tx-t1 arial"},"{ 'class': `dark bg-t-0 tx-t1 arial` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("panel-layout",{},"{ }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("panel-head",{},"{ }",[e.TempleRegistry.createElement("menu",{class:"flex flex-center-y px-20 py-15 m-0 bg-t-1"},"{ 'class': `flex flex-center-y px-20 py-15 m-0 bg-t-1` }",[e.TempleRegistry.createText(`
+  `,!1),...t!=="/temple/index.html"&&t!=="/temple/500.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-bars cursor-pointer py-5 pr-10 none md-inline-block tx-t-1",click:i},"{ 'class': `fas fa-fw fa-bars cursor-pointer py-5 pr-10 none md-inline-block tx-t-1`, 'click': toggle }",[]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("div",{class:"flex-grow"},"{ 'class': `flex-grow` }",[]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{href:"/temple"},"{ 'href': `/temple` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("img",{alt:"Temple Logo",class:"h-26 mr-10",src:"/temple/temple-icon.png"},"{ 'alt': `Temple Logo`, 'class': `h-26 mr-10`, 'src': `/temple/temple-icon.png` }"),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("h3",{class:"flex-grow tx-uppercase"},"{ 'class': `flex-grow tx-uppercase` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple"},"{ 'class': `tx-white`, 'href': `/temple` }",[e.TempleRegistry.createText("Temple",!1)]),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{class:"npm",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-npm text-white"},[]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("nav",{class:"flex flex-center-y"},"{ 'class': `flex flex-center-y` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple/docs/index.html"},"{ 'class': `tx-white`, 'href': `/temple/docs/index.html` }",[e.TempleRegistry.createText("Docs",!1)]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"tx-t-1 tx-5xl ml-10",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},"{ 'class': `tx-t-1 tx-5xl ml-10`, 'href': `https://github.com/OSSPhilippines/temple`, 'target': `_blank` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-github"},"{ 'class': `fab fa-github` }",[]),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{class:"discord",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-discord text-white"},[]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"bg-h-cb3837 pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},"{ 'class': `bg-h-cb3837 pill tx-t-1 tx-lg ml-5 p-5 tx-center`, 'href': `https://www.npmjs.com/package/@ossph/temple`, 'target': `_blank` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-npm text-white"},"{ 'class': `fab fa-npm text-white` }",[]),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"bg-h-7289da pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},"{ 'class': `bg-h-7289da pill tx-t-1 tx-lg ml-5 p-5 tx-center`, 'href': `https://discord.gg/open-source-software-ph-905496362982981723`, 'target': `_blank` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-discord text-white"},"{ 'class': `fab fa-discord text-white` }",[]),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]),e.TempleRegistry.createText(`
+`,!1)])]),e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("panel-left",{},"{ }",[e.TempleRegistry.createElement("header",{class:"flex flex-center-y bg-t-2 py-15 pr-5 pl-10"},"{ 'class': `flex flex-center-y bg-t-2 py-15 pr-5 pl-10` }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("a",{href:"/temple"},"{ 'href': `/temple` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("img",{class:"h-26 mr-10",src:"/temple/temple-icon.png",alt:"Temple Logo"},"{ 'class': `h-26 mr-10`, 'src': `/temple/temple-icon.png`, 'alt': `Temple Logo` }"),e.TempleRegistry.createText(`
   `,!1)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("h3",{class:"flex-grow m-0 tx-uppercase"},"{ 'class': `flex-grow m-0 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple"},"{ 'class': `tx-white`, 'href': `/temple` }",[e.TempleRegistry.createText("Temple",!1)]),e.TempleRegistry.createText(`
+  `,!1)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-left cursor-pointer none md-inline-block",click:i},"{ 'class': `fas fa-fw fa-chevron-left cursor-pointer none md-inline-block`, 'click': toggle }",[]),e.TempleRegistry.createText(`
 `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("aside",{class:"left panel-left"},[e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("header",{},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("img",{src:"/temple/temple-icon.png",alt:"Temple Logo"}),e.TempleRegistry.createText(`
-    `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("h3",{},[e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple"},[e.TempleRegistry.createText("Temple",!1)])]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("i",{class:"toggle fas fa-fw fa-chevron-left",click:n},[]),e.TempleRegistry.createText(`
+`,!1),e.TempleRegistry.createElement("nav",{class:"bg-t-1 scroll-auto h-calc-full-60"},"{ 'class': `bg-t-1 scroll-auto h-calc-full-60` }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("h6",{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-0 pt-20 pb-10 pl-10 tx-uppercase"},"{ 'class': `bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-0 pt-20 pb-10 pl-10 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),...this._toNodeList(r("Introduction")),e.TempleRegistry.createText(`
   `,!1)]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("nav",{},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("h6",{},[e.TempleRegistry.createText("Introduction",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/index.html"},[e.TempleRegistry.createText("Documentation",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/getting-started.html"},[e.TempleRegistry.createText("Getting Started",!1)]),e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/index.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/index.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/index.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Documentation")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/index.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/index.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Documentation")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/getting-started.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/getting-started.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/getting-started.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Getting Started")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/getting-started.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/getting-started.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Getting Started")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
 
-    `,!1),e.TempleRegistry.createElement("h6",{},[e.TempleRegistry.createText("Features",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/markup-syntax.html"},[e.TempleRegistry.createText("Markup Syntax",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/state-management.html"},[e.TempleRegistry.createText("State Management",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/component-strategy.html"},[e.TempleRegistry.createText("Component Strategy",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/compiler-api.html"},[e.TempleRegistry.createText("Compiler API",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/client-api.html"},[e.TempleRegistry.createText("Client API",!1)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("h6",{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},"{ 'class': `bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),...this._toNodeList(r("Features")),e.TempleRegistry.createText(`
+  `,!1)]),e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/markup-syntax.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/markup-syntax.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/markup-syntax.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Markup Syntax")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/markup-syntax.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/markup-syntax.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Markup Syntax")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/state-management.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/state-management.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/state-management.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("State Management")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/state-management.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/state-management.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("State Management")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/component-strategy.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/component-strategy.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/component-strategy.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Component Strategy")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-strategy.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/component-strategy.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Component Strategy")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/compiler-api.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/compiler-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/compiler-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Compiler API")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/compiler-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/compiler-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Compiler API")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/client-api.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/client-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/client-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Client API")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/client-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/client-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Client API")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
 
-    `,!1),e.TempleRegistry.createElement("h6",{},[e.TempleRegistry.createText("Usage",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/template-engine.html"},[e.TempleRegistry.createText("Template Engine",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/single-page.html"},[e.TempleRegistry.createText("Single Page App",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/static-site.html"},[e.TempleRegistry.createText("Static Site Generator",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/component-publisher.html"},[e.TempleRegistry.createText("Component Publisher",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/developer-tools.html"},[e.TempleRegistry.createText("Developer Tools",!1)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("h6",{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},"{ 'class': `bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),...this._toNodeList(r("Usage")),e.TempleRegistry.createText(`
   `,!1)]),e.TempleRegistry.createText(`
-`,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("panel-main",{class:"panel-main"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("div",{class:"docs container"},[e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("h1",{},[...this._toNodeList(o("Template Engine"))]),e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/template-engine.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/template-engine.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/template-engine.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Template Engine")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/template-engine.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/template-engine.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Template Engine")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/single-page.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/single-page.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/single-page.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Single Page App")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/single-page.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/single-page.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Single Page App")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/static-site.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/static-site.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/static-site.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Static Site Generator")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/static-site.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/static-site.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Static Site Generator")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/component-publisher.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/component-publisher.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/component-publisher.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Component Publisher")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-publisher.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/component-publisher.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Component Publisher")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/developer-tools.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold mb-100",href:"/temple/docs/developer-tools.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold mb-100`, 'href': `/temple/docs/developer-tools.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Developer Tools")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 mb-100",href:"/temple/docs/developer-tools.html"},"{ 'class': `block tx-t-1 py-10 pl-10 mb-100`, 'href': `/temple/docs/developer-tools.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Developer Tools")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+`,!1)])]),e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("panel-main",{},"{ }",[e.TempleRegistry.createText(`
+        `,!1),e.TempleRegistry.createElement("api-docs",{},"{ }",[e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("h1",{class:"tx-primary tx-uppercase tx-30 py-20"},"{ 'class': `tx-primary tx-uppercase tx-30 py-20` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(r("Template Engine")),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Template engines are used when you want to rapidly build web 
-          applications that are split into different pages. Templates 
-          also enable fast rendering of the server-side data that needs
-          to be passed to the application. You can use Temple, TypeScript 
-          and the native Node.js HTTP server to serve up HTML documents
-          from the server-side.
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            Template engines are used when you want to rapidly build web 
+            applications that are split into different pages. Templates 
+            also enable fast rendering of the server-side data that needs
+            to be passed to the application. You can use Temple, TypeScript 
+            and the native Node.js HTTP server to serve up HTML documents
+            from the server-side.
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          First, create a project with the following structure and files.
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("ide-app",{panel:410,title:"My Project"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("div",{class:"panel-head"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("div",{class:"tabs"},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("tui-tab",{class:"tab active",group:"project",selector:"#index-ts"},[e.TempleRegistry.createText(`
-                src/index.ts
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            First, create a project with the following structure and files.
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("ide-app",{height:410,title:"My Project"},"{ 'height': 410, 'title': `My Project` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("app-head",{},"{ }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("div",{class:"flex scroll-x-auto pt-5 pl-5"},"{ 'class': `flex scroll-x-auto pt-5 pl-5` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("tui-tab",{on:!0,class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"engine",selector:"#index-ts"},"{ 'on': true, 'class': `relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0`, 'active': `bg-black tx-white`, 'inactive': `bg-t-1 tx-muted`, 'group': `engine`, 'selector': `#index-ts` }",[e.TempleRegistry.createText(`
+                  src/index.ts
+                `,!1)]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("tui-tab",{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"engine",selector:"#page-dtml"},"{ 'class': `relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0`, 'active': `bg-black tx-white`, 'inactive': `bg-t-1 tx-muted`, 'group': `engine`, 'selector': `#page-dtml` }",[e.TempleRegistry.createText(`
+                  src/page.dtml
+                `,!1)]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("tui-tab",{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"engine",selector:"#package-json"},"{ 'class': `relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0`, 'active': `bg-black tx-white`, 'inactive': `bg-t-1 tx-muted`, 'group': `engine`, 'selector': `#package-json` }",[e.TempleRegistry.createText(`
+                  package.json
+                `,!1)]),e.TempleRegistry.createText(`
               `,!1)]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("tui-tab",{class:"tab",group:"project",selector:"#page-dtml"},[e.TempleRegistry.createText(`
-                src/page.dtml
+            `,!1)]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("app-left",{},"{ }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("h5",{class:"p-5"},"{ 'class': `p-5` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-down"},"{ 'class': `fas fa-fw fa-chevron-down` }",[]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("span",{},"{ }",[e.TempleRegistry.createText("src",!1)]),e.TempleRegistry.createText(`
               `,!1)]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("tui-tab",{class:"tab",group:"project",selector:"#package-json"},[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("tui-tab",{on:!0,class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"engine",selector:"#index-ts"},"{ 'on': true, 'class': `pl-15 pt-10 block`, 'active': `tx-white`, 'inactive': `tx-muted`, 'group': `engine`, 'selector': `#index-ts` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},"{ 'class': `fas fa-fw fa-file` }",[]),e.TempleRegistry.createText(`
+                index.ts
+              `,!1)]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("tui-tab",{class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"engine",selector:"#page-dtml"},"{ 'class': `pl-15 pt-10 block`, 'active': `tx-white`, 'inactive': `tx-muted`, 'group': `engine`, 'selector': `#page-dtml` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},"{ 'class': `fas fa-fw fa-file` }",[]),e.TempleRegistry.createText(`
+                page.dtml
+              `,!1)]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("tui-tab",{class:"pt-10 block",active:"tx-white",inactive:"tx-muted",group:"engine",selector:"#package-json"},"{ 'class': `pt-10 block`, 'active': `tx-white`, 'inactive': `tx-muted`, 'group': `engine`, 'selector': `#package-json` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},"{ 'class': `fas fa-fw fa-file` }",[]),e.TempleRegistry.createText(`
                 package.json
               `,!1)]),e.TempleRegistry.createText(`
             `,!1)]),e.TempleRegistry.createText(`
-          `,!1)]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("div",{class:"panel-left"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("h5",{class:"folder"},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-down"},[]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("span",{},[e.TempleRegistry.createText("src",!1)]),e.TempleRegistry.createText(`
-            `,!1)]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("tui-tab",{class:"shift-1 block active",group:"project",selector:"#index-ts"},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},[]),e.TempleRegistry.createText(`
-              index.ts
-            `,!1)]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("tui-tab",{class:"shift-1 block",group:"project",selector:"#page-dtml"},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},[]),e.TempleRegistry.createText(`
-              page.dtml
-            `,!1)]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("tui-tab",{class:"block",group:"project",selector:"#package-json"},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},[]),e.TempleRegistry.createText(`
-              package.json
-            `,!1)]),e.TempleRegistry.createText(`
-          `,!1)]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("div",{class:"panel-main"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("main",{},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("ide-code",{id:"index-ts",lang:"js",numbers:!0,trim:!0,detab:16},[...this._toNodeList(`
+            `,!1),e.TempleRegistry.createElement("app-main",{},"{ }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("ide-code",{id:"index-ts",lang:"js",numbers:!0,trim:!0,detab:16},"{ 'id': `index-ts`, 'lang': `js`, 'numbers': true, 'trim': true, 'detab': 16 }",[...this._toNodeList(`
                 import http from 'http';
                 import temple from '@ossph/temple/compiler';
 
@@ -153,7 +267,7 @@ ${s}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:
                 //listen on port 3000
                 server.listen(3000);
               `)]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("ide-code",{id:"page-dtml",style:"display:none",numbers:!0,trim:!0,detab:16},[...this._toNodeList(`
+              `,!1),e.TempleRegistry.createElement("ide-code",{id:"page-dtml",style:"display:none",numbers:!0,trim:!0,detab:16},"{ 'id': `page-dtml`, 'style': `display:none`, 'numbers': true, 'trim': true, 'detab': 16 }",[...this._toNodeList(`
                 
@@ -173,7 +287,7 @@ ${s}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:
                   
                 
               `)]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("ide-code",{id:"package-json",style:"display:none",lang:"js",numbers:!0,trim:!0,detab:16},[...this._toNodeList(`
+              `,!1),e.TempleRegistry.createElement("ide-code",{id:"package-json",style:"display:none",lang:"js",numbers:!0,trim:!0,detab:16},"{ 'id': `package-json`, 'style': `display:none`, 'lang': `js`, 'numbers': true, 'trim': true, 'detab': 16 }",[...this._toNodeList(`
                 {
                   "name": "my-project",
                   "version": "1.0.0",
@@ -182,10 +296,10 @@ ${s}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:
                     "dev": "ts-node ./src/index.ts"
                   },
                   "dependencies": {
-                    "@ossph/temple": "0.1.4"
+                    "@ossph/temple": "0.1.6"
                   },
                   "devDependencies": {
-                    "@ossph/temple-dev": "0.1.4",
+                    "@ossph/temple-dev": "0.1.6",
                     "@types/node": "22.1.0",
                     "ts-node": "10.9.2",
                     "typescript": "5.5.4"
@@ -194,37 +308,37 @@ ${s}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:
               `)]),e.TempleRegistry.createText(`
             `,!1)]),e.TempleRegistry.createText(`
           `,!1)]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          The server file 
-          `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("src/index.ts",!1)]),e.TempleRegistry.createText(` 
-          implements a simple server utilizing the Temple compiler in 
-          its most simplistic form. The document file
-          `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("src/page.dtml",!1)]),e.TempleRegistry.createText(` 
-          is using the most basic Temple syntax. To test the script and 
-          see the results, run the following command in terminal.
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("ide-code",{lang:"bash"},[e.TempleRegistry.createText(`
-          npm run dev
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Load 
-          `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},[e.TempleRegistry.createText("'http://localhost:3000/'",!1)]),e.TempleRegistry.createText(` 
-          in your browser to see your application.
-        `,!1)]),e.TempleRegistry.createText(`
-        
-        `,!1),e.TempleRegistry.createElement("nav",{class:"pager"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("a",{class:"prev",href:"/temple/docs/client-api.html"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-left"},[]),e.TempleRegistry.createText(`
-            `,!1),...this._toNodeList(o("Client API")),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            The server file 
+            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("src/index.ts",!1)]),e.TempleRegistry.createText(` 
+            implements a simple server utilizing the Temple compiler in 
+            its most simplistic form. The document file
+            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("src/page.dtml",!1)]),e.TempleRegistry.createText(` 
+            is using the most basic Temple syntax. To test the script and 
+            see the results, run the following command in terminal.
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("ide-code",{trim:!0,lang:"bash"},"{ 'trim': true, 'lang': `bash` }",[e.TempleRegistry.createText(`
+            npm run dev
           `,!1)]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("a",{class:"next",href:"/temple/docs/single-page.html"},[e.TempleRegistry.createText(`
-            `,!1),...this._toNodeList(o("Single Page App")),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-right"},[]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            Load 
+            `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},"{ 'lang': `js`, 'inline': true }",[e.TempleRegistry.createText("http://localhost:3000/",!1)]),e.TempleRegistry.createText(` 
+            in your browser to see your application.
+          `,!1)]),e.TempleRegistry.createText(`
+          
+          `,!1),e.TempleRegistry.createElement("nav",{class:"flex"},"{ 'class': `flex` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"tx-primary py-40",href:"/temple/docs/client-api.html"},"{ 'class': `tx-primary py-40`, 'href': `/temple/docs/client-api.html` }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-left tx-t-1"},"{ 'class': `fas fa-fw fa-chevron-left tx-t-1` }",[]),e.TempleRegistry.createText(`
+              `,!1),...this._toNodeList(r("Client API")),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"flex-grow tx-right tx-primary py-40",href:"/temple/docs/single-page.html"},"{ 'class': `flex-grow tx-right tx-primary py-40`, 'href': `/temple/docs/single-page.html` }",[e.TempleRegistry.createText(`
+              `,!1),...this._toNodeList(r("Single Page App")),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-right tx-t-1"},"{ 'class': `fas fa-fw fa-chevron-right tx-t-1` }",[]),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
           `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("footer",{class:"foot"},"{ 'class': `foot` }",[]),e.TempleRegistry.createText(`
         `,!1)]),e.TempleRegistry.createText(`
       `,!1)]),e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("footer",{class:"foot"},[]),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
   `,!1)]),e.TempleRegistry.createText(`
-`,!1)])]}};return ne(Re);})();
+`,!1)])]}};return se(Se);})();
diff --git a/docs/build/server/3550a936d66e61695120.js b/docs/build/server/3550a936d66e61695120.js
index 59eead1..34d7654 100644
--- a/docs/build/server/3550a936d66e61695120.js
+++ b/docs/build/server/3550a936d66e61695120.js
@@ -1,184 +1,298 @@
-var TempleAPI=(()=>{var ee=Object.create;var b=Object.defineProperty;var te=Object.getOwnPropertyDescriptor;var ae=Object.getOwnPropertyNames;var re=Object.getPrototypeOf,se=Object.prototype.hasOwnProperty;var n=(a,t)=>()=>(t||a((t={exports:{}}).exports,t),t.exports),le=(a,t)=>{for(var r in t)b(a,r,{get:t[r],enumerable:!0})},R=(a,t,r,s)=>{if(t&&typeof t=="object"||typeof t=="function")for(let c of ae(t))!se.call(a,c)&&c!==r&&b(a,c,{get:()=>t[c],enumerable:!(s=te(t,c))||s.enumerable});return a};var F=(a,t,r)=>(r=a!=null?ee(re(a)):{},R(t||!a||!a.__esModule?b(r,"default",{value:a,enumerable:!0}):r,a)),ce=a=>R(b({},"__esModule",{value:!0}),a);var P=n(k=>{"use strict";Object.defineProperty(k,"__esModule",{value:!0});var j=class extends Error{static for(t,...r){return r.forEach(function(s){t=t.replace("%s",s)}),new this(t)}static forErrorsFound(t){let r=new this("Invalid Parameters");return r.errors=t,r}static require(t,r,...s){if(!t){for(let c of s)r=r.replace("%s",c);throw new this(r)}}constructor(t,r=500){super(),this.errors={},this.start=0,this.end=0,this.message=t,this.name=this.constructor.name,this.code=r}withCode(t){return this.code=t,this}withPosition(t,r){return this.start=t,this.end=r,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};k.default=j});var S=n(D=>{"use strict";Object.defineProperty(D,"__esModule",{value:!0});var O=class{constructor(t=[]){this._elements=new Set,t.forEach(r=>this._elements.add(r))}add(t){this._elements.add(t)}toArray(){return Array.from(this._elements)}toString(){return Array.from(this._elements).filter(Boolean).map(t=>t.toString()).join("")}};D.default=O});var p=n(M=>{"use strict";Object.defineProperty(M,"__esModule",{value:!0});var ne=new Map;M.default=ne});var E=n(m=>{"use strict";var ie=m&&m.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(m,"__esModule",{value:!0});var oe=ie(S()),fe=["area","base","br","col","embed","hr","img","input","link","meta","param","source","track","wbr"],q=class{static render(t){return t.filter(Boolean).map(r=>r.toString()).join("")}get name(){return this._name}get attributes(){return this._attributes}get children(){return this._children}constructor(t,r={},s=[]){this._attributes={},this._name=t,this._attributes=r,this._children=new oe.default(s)}toString(){let t=Object.entries(this._attributes),r=t.length>0?" "+t.map(([c,f])=>{if(typeof f=="string")return`${c}="${f}"`;if(typeof f=="boolean")return f?c:""}).join(" "):"";if(fe.includes(this._name))return`<${this._name}${r} />`;let s=this._children.toString();return`<${this._name}${r}>${s}`}};m.default=q});var C=n(L=>{"use strict";Object.defineProperty(L,"__esModule",{value:!0});var A=class{get value(){return this._escape?this._value.replace(/&/g,"&").replace(//g,">"):this._value}constructor(t,r=!1){this._escape=r,this._value=t}toString(){return this.value}};L.default=A});var I=n(u=>{"use strict";var G=u&&u.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(u,"__esModule",{value:!0});var pe=G(C()),me=G(E()),N=class{static createElement(t,r,s=[]){return new me.default(t,r,s)}static createText(t,r=!0){return new pe.default(t,r)}};u.default=N});var J=n(d=>{"use strict";var v=d&&d.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(d,"__esModule",{value:!0});var ue=v(P()),$=v(p()),de=v(E()),he=v(I()),B=class{render(t={}){$.default.set("props",t||{}),$.default.set("env",Object.assign(Object.assign({},process.env||{}),{BUILD_ID:this.id(),APP_DATA:btoa(JSON.stringify(Object.assign(Object.assign({},Object.fromEntries($.default.entries())),{env:Object.assign(Object.assign({},Object.fromEntries(Object.entries(process.env||{}).filter(c=>c[0].startsWith("PUBLIC_")))),{BUILD_ID:this.id()})})))}));let r=this.template(),s=de.default.render(r).trim();if(!s.toLowerCase().startsWith(" tag.");return`
-${s}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:Array.isArray(t)&&t.every(r=>typeof r=="object"&&typeof r.nodeType=="number")?t:[he.default.createText(String(t))]}};d.default=B});var Y=n(h=>{"use strict";Object.defineProperty(h,"__esModule",{value:!0});h.TempleEmitter=void 0;var w=class{emit(t,r){return this}on(t,r){return this}once(t,r){return this}unbind(t,r){return this}};h.TempleEmitter=w;var Te=new w;h.default=Te});var V=n(T=>{"use strict";var xe=T&&T.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(T,"__esModule",{value:!0});var ge=xe(p());function _e(a){let t=ge.default.get("env")||{};return a?t[a]||null:t}T.default=_e});var U=n(x=>{"use strict";var be=x&&x.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(x,"__esModule",{value:!0});x.default=ve;var Ee=be(p());function ve(){return Ee.default.get("props")||{}}});var z=n(g=>{"use strict";var we=g&&g.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(g,"__esModule",{value:!0});g.default=je;var ye=we(U());function je(){return(0,ye.default)().class}});var K=n(W=>{"use strict";Object.defineProperty(W,"__esModule",{value:!0});W.default=ke;function ke(a){let t={getter:()=>r.raw,setter:s=>s},r={raw:a,getter(s){return t.getter=s,r},setter(s){return t.setter=s,r}};return Object.defineProperty(r,"value",{get(){return t.getter()},set(s){r.raw=t.setter(s)}}),r}});var X=n(l=>{"use strict";var Pe=l&&l.__createBinding||(Object.create?function(a,t,r,s){s===void 0&&(s=r);var c=Object.getOwnPropertyDescriptor(t,r);(!c||("get"in c?!t.__esModule:c.writable||c.configurable))&&(c={enumerable:!0,get:function(){return t[r]}}),Object.defineProperty(a,s,c)}:function(a,t,r,s){s===void 0&&(s=r),a[s]=t[r]}),Oe=l&&l.__setModuleDefault||(Object.create?function(a,t){Object.defineProperty(a,"default",{enumerable:!0,value:t})}:function(a,t){a.default=t}),De=l&&l.__importStar||function(a){if(a&&a.__esModule)return a;var t={};if(a!=null)for(var r in a)r!=="default"&&Object.prototype.hasOwnProperty.call(a,r)&&Pe(t,a,r);return Oe(t,a),t},i=l&&l.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(l,"__esModule",{value:!0});l.TempleText=l.TempleException=l.TempleEmitter=l.TempleElement=l.TempleRegistry=l.TempleDocument=l.TempleCollection=l.signal=l.classnames=l.props=l.emitter=l.env=l.data=void 0;var Se=i(P());l.TempleException=Se.default;var Me=i(S());l.TempleCollection=Me.default;var qe=i(J());l.TempleDocument=qe.default;var Ae=i(I());l.TempleRegistry=Ae.default;var Le=i(E());l.TempleElement=Le.default;var Q=De(Y());l.emitter=Q.default;Object.defineProperty(l,"TempleEmitter",{enumerable:!0,get:function(){return Q.TempleEmitter}});var Ce=i(C());l.TempleText=Ce.default;var Ne=i(p());l.data=Ne.default;var Ie=i(V());l.env=Ie.default;var $e=i(U());l.props=$e.default;var Be=i(z());l.classnames=Be.default;var Ue=i(K());l.signal=Ue.default});var H=n((rt,Z)=>{Z.exports={...X()}});var He={};le(He,{default:()=>y});var e=F(H()),_=F(H());var o=function(a,...t){let r=We(a);for(let s=0;s{document.body.classList.toggle("panel-left-open")};return[e.TempleRegistry.createText(`
-`,!1),e.TempleRegistry.createElement("html",{},[e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("head",{},[e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{charset:"utf-8"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"viewport",content:"width=device-width, initial-scale=1"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("title",{},[...this._toNodeList(r)]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"description",content:s}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:title",content:r}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:description",content:s}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:image",content:"https://ossphilippines.github.io/temple/temple-logo.png"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:url",content:`https://ossphilippines.github.io/temple${t}`}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:type",content:"website"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:card",content:"summary"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:site",content:"@OSSPhilippines"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:title",content:r}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:description",content:s}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:image",content:"https://ossphilippines.github.io/temple/temple-logo.png"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"favicon",href:"/temple/favicon.ico"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"shortcut icon",type:"image/png",href:"/temple/favicon.png"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/fontawesome/all.css"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/theme.css"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:`/temple/build/client/${(0,_.env)("BUILD_ID")}.css`}),e.TempleRegistry.createText(`
+var TempleAPI=(()=>{var X=Object.create;var g=Object.defineProperty;var Z=Object.getOwnPropertyDescriptor;var ee=Object.getOwnPropertyNames;var te=Object.getPrototypeOf,ae=Object.prototype.hasOwnProperty;var n=(a,t)=>()=>(t||a((t={exports:{}}).exports,t),t.exports),le=(a,t)=>{for(var l in t)g(a,l,{get:t[l],enumerable:!0})},W=(a,t,l,s)=>{if(t&&typeof t=="object"||typeof t=="function")for(let i of ee(t))!ae.call(a,i)&&i!==l&&g(a,i,{get:()=>t[i],enumerable:!(s=Z(t,i))||s.enumerable});return a};var G=(a,t,l)=>(l=a!=null?X(te(a)):{},W(t||!a||!a.__esModule?g(l,"default",{value:a,enumerable:!0}):l,a)),se=a=>W(g({},"__esModule",{value:!0}),a);var w=n(E=>{"use strict";Object.defineProperty(E,"__esModule",{value:!0});var _=class extends Error{static for(t,...l){return l.forEach(function(s){t=t.replace("%s",s)}),new this(t)}static forErrorsFound(t){let l=new this("Invalid Parameters");return l.errors=t,l}static require(t,l,...s){if(!t){for(let i of s)l=l.replace("%s",i);throw new this(l)}}constructor(t,l=500){super(),this.errors={},this.start=0,this.end=0,this.message=t,this.name=this.constructor.name,this.code=l}withCode(t){return this.code=t,this}withPosition(t,l){return this.start=t,this.end=l,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};E.default=_});var L=n(j=>{"use strict";Object.defineProperty(j,"__esModule",{value:!0});var k=class{get length(){return this._elements.size}constructor(t=[]){this._elements=new Set,t.forEach(l=>this._elements.add(l))}add(t){this._elements.add(t)}toArray(){return Array.from(this._elements)}toString(){return Array.from(this._elements).filter(Boolean).map(t=>t.toString()).join("")}};j.default=k});var p=n(P=>{"use strict";Object.defineProperty(P,"__esModule",{value:!0});var re=new Map;P.default=re});var N=n(D=>{"use strict";Object.defineProperty(D,"__esModule",{value:!0});var S=class{get value(){return this._escape?this._value.replace(/&/g,"&").replace(//g,">"):this._value}constructor(t,l=!1){this._escape=l,this._value=t}toString(){return this.value}};D.default=S});var M=n(m=>{"use strict";var ce=m&&m.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(m,"__esModule",{value:!0});var ie=ce(L()),ne=["area","base","br","col","embed","hr","img","input","link","meta","param","source","track","wbr"],O=class{get attributes(){return this._attributes}get children(){return this._children}get name(){return this._name}get props(){return this._props}constructor(t,l={},s="",i=[]){this._attributes={},this._name=t,this._attributes=l,this._props=s,this._children=new ie.default(i)}toString(){let t=Object.entries(this._attributes),l=t.length>0?" "+t.map(([i,T])=>{if(typeof T=="string")return`${i}="${T}"`;if(typeof T=="boolean")return T?i:""}).join(" "):"";if(ne.includes(this._name))return`<${this._name}${l} />`;let s=this._children.toString();return`<${this._name}${l}>${s}`}};m.default=O});var q=n(f=>{"use strict";var R=f&&f.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(f,"__esModule",{value:!0});var oe=R(N()),H=R(M()),A=class{static render(t){return t.filter(Boolean).map(l=>l.toString()).join("")}static registry(t,l=new Set){return t.forEach(s=>{s instanceof H.default&&(["html","head","body"].includes(s.name)||l.add(s),s.name!=="head"&&s.children.length>0&&this.registry(s.children.toArray(),l))}),l}static createElement(t,l,s,i=[]){return new H.default(t,l,s,i)}static createText(t,l=!0){return new oe.default(t,l)}};f.default=A});var F=n(x=>{"use strict";var B=x&&x.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(x,"__esModule",{value:!0});var pe=B(w()),C=B(p()),I=B(q()),$=class{bindings(){let t=I.default.registry(this.template());return`{ ${Array.from(t.values()).map((s,i)=>s.props!=="{ }"?`'${i}': ${s.props}`:"").filter(s=>s!=="").join(", ")} }`}render(t={}){C.default.set("props",t||{}),C.default.set("env",Object.assign(Object.assign({},process.env||{}),{BUILD_ID:this.id(),APP_DATA:btoa(JSON.stringify(Object.assign(Object.assign({},Object.fromEntries(C.default.entries())),{env:Object.assign(Object.assign({},Object.fromEntries(Object.entries(process.env||{}).filter(i=>i[0].startsWith("PUBLIC_")))),{BUILD_ID:this.id()})})))}));let l=this.template(),s=I.default.render(l).trim();if(!s.toLowerCase().startsWith(" tag.");return`
+${s}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:Array.isArray(t)&&t.every(l=>typeof l=="object"&&typeof l.nodeType=="number")?t:[I.default.createText(String(t))]}};x.default=$});var J=n(d=>{"use strict";Object.defineProperty(d,"__esModule",{value:!0});d.TempleEmitter=void 0;var y=class{emit(t,l){return this}on(t,l){return this}once(t,l){return this}unbind(t,l){return this}};d.TempleEmitter=y;var me=new y;d.default=me});var Y=n(u=>{"use strict";var fe=u&&u.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(u,"__esModule",{value:!0});var xe=fe(p());function de(a){let t=xe.default.get("env")||{};return a?t[a]||null:t}u.default=de});var z=n(h=>{"use strict";var ue=h&&h.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(h,"__esModule",{value:!0});h.default=be;var he=ue(p());function be(){return he.default.get("props")||{}}});var K=n(c=>{"use strict";var Te=c&&c.__createBinding||(Object.create?function(a,t,l,s){s===void 0&&(s=l);var i=Object.getOwnPropertyDescriptor(t,l);(!i||("get"in i?!t.__esModule:i.writable||i.configurable))&&(i={enumerable:!0,get:function(){return t[l]}}),Object.defineProperty(a,s,i)}:function(a,t,l,s){s===void 0&&(s=l),a[s]=t[l]}),ge=c&&c.__setModuleDefault||(Object.create?function(a,t){Object.defineProperty(a,"default",{enumerable:!0,value:t})}:function(a,t){a.default=t}),ye=c&&c.__importStar||function(a){if(a&&a.__esModule)return a;var t={};if(a!=null)for(var l in a)l!=="default"&&Object.prototype.hasOwnProperty.call(a,l)&&Te(t,a,l);return ge(t,a),t},o=c&&c.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(c,"__esModule",{value:!0});c.TempleText=c.TempleException=c.TempleEmitter=c.TempleElement=c.TempleRegistry=c.TempleDocument=c.TempleCollection=c.props=c.emitter=c.env=c.data=void 0;var ve=o(w());c.TempleException=ve.default;var _e=o(L());c.TempleCollection=_e.default;var Ee=o(F());c.TempleDocument=Ee.default;var we=o(q());c.TempleRegistry=we.default;var ke=o(M());c.TempleElement=ke.default;var V=ye(J());c.emitter=V.default;Object.defineProperty(c,"TempleEmitter",{enumerable:!0,get:function(){return V.TempleEmitter}});var je=o(N());c.TempleText=je.default;var Le=o(p());c.data=Le.default;var Pe=o(Y());c.env=Pe.default;var Se=o(z());c.props=Se.default});var U=n((Re,Q)=>{Q.exports={...K()}});var Ne={};le(Ne,{default:()=>v});var e=G(U()),b=G(U());var r=function(a,...t){let l=De(a);for(let s=0;s{document.getElementsByTagName("panel-layout")[0].toggle("left")};return[e.TempleRegistry.createText(`
+`,!1),e.TempleRegistry.createElement("html",{},"{ }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("head",{},"{ }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{charset:"utf-8"},"{ 'charset': `utf-8` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"viewport",content:"width=device-width, initial-scale=1"},"{ 'name': `viewport`, 'content': `width=device-width, initial-scale=1` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("title",{},"{ }",[...this._toNodeList(l)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"description",content:s},"{ 'name': `description`, 'content': description }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:title",content:l},"{ 'property': `og:title`, 'content': title }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:description",content:s},"{ 'property': `og:description`, 'content': description }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:image",content:"https://ossphilippines.github.io/temple/temple-logo.png"},"{ 'property': `og:image`, 'content': `https://ossphilippines.github.io/temple/temple-logo.png` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:url",content:`https://ossphilippines.github.io/temple${t}`},"{ 'property': `og:url`, 'content': `https://ossphilippines.github.io/temple${url}` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:type",content:"website"},"{ 'property': `og:type`, 'content': `website` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:card",content:"summary"},"{ 'name': `twitter:card`, 'content': `summary` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:site",content:"@OSSPhilippines"},"{ 'name': `twitter:site`, 'content': `@OSSPhilippines` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:title",content:l},"{ 'name': `twitter:title`, 'content': title }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:description",content:s},"{ 'name': `twitter:description`, 'content': description }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:image",content:"https://ossphilippines.github.io/temple/temple-logo.png"},"{ 'name': `twitter:image`, 'content': `https://ossphilippines.github.io/temple/temple-logo.png` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"favicon",href:"/temple/favicon.ico"},"{ 'rel': `favicon`, 'href': `/temple/favicon.ico` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"shortcut icon",type:"image/png",href:"/temple/favicon.png"},"{ 'rel': `shortcut icon`, 'type': `image/png`, 'href': `/temple/favicon.png` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/fontawesome/all.css"},"{ 'rel': `stylesheet`, 'type': `text/css`, 'href': `/temple/styles/fontawesome/all.css` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/global.css"},"{ 'rel': `stylesheet`, 'type': `text/css`, 'href': `/temple/styles/global.css` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:`/temple/build/client/${(0,b.env)("BUILD_ID")}.css`},"{ 'rel': `stylesheet`, 'type': `text/css`, 'href': `/temple/build/client/${env('BUILD_ID')}.css` }"),e.TempleRegistry.createText(`
   
-  `,!1),e.TempleRegistry.createElement("script",{"data-app":(0,_.env)("APP_DATA"),src:`/temple/build/client/${(0,_.env)("BUILD_ID")}.js`}),e.TempleRegistry.createText(`
-  `,!1),...(0,_.env)("NODE_ENV")==="development"?[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("script",{src:"/dev.js"}),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("script",{"data-app":(0,b.env)("APP_DATA"),src:`/temple/build/client/${(0,b.env)("BUILD_ID")}.js`},"{ 'data-app': env('APP_DATA'), 'src': `/temple/build/client/${env('BUILD_ID')}.js` }"),e.TempleRegistry.createText(`
+  `,!1),...(0,b.env)("NODE_ENV")==="development"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("script",{src:"/dev.js"},"{ 'src': `/dev.js` }"),e.TempleRegistry.createText(`
   `,!1)]:[],e.TempleRegistry.createText(`
 `,!1)]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("body",{class:"dark panel with-head with-left"},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("header",{class:"head panel-head"},[e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("i",{class:"menu fas fa-fw fa-bars",click:c},[]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("a",{href:"/temple"},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("img",{src:"/temple/temple-icon.png",alt:"Temple Logo"}),e.TempleRegistry.createText(`
-  `,!1)]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("h3",{},[e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple"},[e.TempleRegistry.createText("Temple",!1)])]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("nav",{},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple/docs/index.html"},[e.TempleRegistry.createText("Docs",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{class:"github",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-github"},[]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("body",{class:"dark bg-t-0 tx-t1 arial"},"{ 'class': `dark bg-t-0 tx-t1 arial` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("panel-layout",{},"{ }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("panel-head",{},"{ }",[e.TempleRegistry.createElement("menu",{class:"flex flex-center-y px-20 py-15 m-0 bg-t-1"},"{ 'class': `flex flex-center-y px-20 py-15 m-0 bg-t-1` }",[e.TempleRegistry.createText(`
+  `,!1),...t!=="/temple/index.html"&&t!=="/temple/500.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-bars cursor-pointer py-5 pr-10 none md-inline-block tx-t-1",click:i},"{ 'class': `fas fa-fw fa-bars cursor-pointer py-5 pr-10 none md-inline-block tx-t-1`, 'click': toggle }",[]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("div",{class:"flex-grow"},"{ 'class': `flex-grow` }",[]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{href:"/temple"},"{ 'href': `/temple` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("img",{alt:"Temple Logo",class:"h-26 mr-10",src:"/temple/temple-icon.png"},"{ 'alt': `Temple Logo`, 'class': `h-26 mr-10`, 'src': `/temple/temple-icon.png` }"),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("h3",{class:"flex-grow tx-uppercase"},"{ 'class': `flex-grow tx-uppercase` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple"},"{ 'class': `tx-white`, 'href': `/temple` }",[e.TempleRegistry.createText("Temple",!1)]),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("nav",{class:"flex flex-center-y"},"{ 'class': `flex flex-center-y` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple/docs/index.html"},"{ 'class': `tx-white`, 'href': `/temple/docs/index.html` }",[e.TempleRegistry.createText("Docs",!1)]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"tx-t-1 tx-5xl ml-10",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},"{ 'class': `tx-t-1 tx-5xl ml-10`, 'href': `https://github.com/OSSPhilippines/temple`, 'target': `_blank` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-github"},"{ 'class': `fab fa-github` }",[]),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{class:"npm",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-npm text-white"},[]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"bg-h-cb3837 pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},"{ 'class': `bg-h-cb3837 pill tx-t-1 tx-lg ml-5 p-5 tx-center`, 'href': `https://www.npmjs.com/package/@ossph/temple`, 'target': `_blank` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-npm text-white"},"{ 'class': `fab fa-npm text-white` }",[]),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{class:"discord",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-discord text-white"},[]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"bg-h-7289da pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},"{ 'class': `bg-h-7289da pill tx-t-1 tx-lg ml-5 p-5 tx-center`, 'href': `https://discord.gg/open-source-software-ph-905496362982981723`, 'target': `_blank` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-discord text-white"},"{ 'class': `fab fa-discord text-white` }",[]),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
   `,!1)]),e.TempleRegistry.createText(`
+`,!1)])]),e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("panel-left",{},"{ }",[e.TempleRegistry.createElement("header",{class:"flex flex-center-y bg-t-2 py-15 pr-5 pl-10"},"{ 'class': `flex flex-center-y bg-t-2 py-15 pr-5 pl-10` }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("a",{href:"/temple"},"{ 'href': `/temple` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("img",{class:"h-26 mr-10",src:"/temple/temple-icon.png",alt:"Temple Logo"},"{ 'class': `h-26 mr-10`, 'src': `/temple/temple-icon.png`, 'alt': `Temple Logo` }"),e.TempleRegistry.createText(`
+  `,!1)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("h3",{class:"flex-grow m-0 tx-uppercase"},"{ 'class': `flex-grow m-0 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple"},"{ 'class': `tx-white`, 'href': `/temple` }",[e.TempleRegistry.createText("Temple",!1)]),e.TempleRegistry.createText(`
+  `,!1)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-left cursor-pointer none md-inline-block",click:i},"{ 'class': `fas fa-fw fa-chevron-left cursor-pointer none md-inline-block`, 'click': toggle }",[]),e.TempleRegistry.createText(`
 `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("aside",{class:"left panel-left"},[e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("header",{},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("img",{src:"/temple/temple-icon.png",alt:"Temple Logo"}),e.TempleRegistry.createText(`
-    `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("h3",{},[e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple"},[e.TempleRegistry.createText("Temple",!1)])]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("i",{class:"toggle fas fa-fw fa-chevron-left",click:c},[]),e.TempleRegistry.createText(`
+`,!1),e.TempleRegistry.createElement("nav",{class:"bg-t-1 scroll-auto h-calc-full-60"},"{ 'class': `bg-t-1 scroll-auto h-calc-full-60` }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("h6",{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-0 pt-20 pb-10 pl-10 tx-uppercase"},"{ 'class': `bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-0 pt-20 pb-10 pl-10 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),...this._toNodeList(r("Introduction")),e.TempleRegistry.createText(`
   `,!1)]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("nav",{},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("h6",{},[e.TempleRegistry.createText("Introduction",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/index.html"},[e.TempleRegistry.createText("Documentation",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/getting-started.html"},[e.TempleRegistry.createText("Getting Started",!1)]),e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/index.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/index.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/index.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Documentation")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/index.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/index.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Documentation")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/getting-started.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/getting-started.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/getting-started.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Getting Started")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/getting-started.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/getting-started.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Getting Started")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
 
-    `,!1),e.TempleRegistry.createElement("h6",{},[e.TempleRegistry.createText("Features",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/markup-syntax.html"},[e.TempleRegistry.createText("Markup Syntax",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/state-management.html"},[e.TempleRegistry.createText("State Management",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/component-strategy.html"},[e.TempleRegistry.createText("Component Strategy",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/compiler-api.html"},[e.TempleRegistry.createText("Compiler API",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/client-api.html"},[e.TempleRegistry.createText("Client API",!1)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("h6",{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},"{ 'class': `bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),...this._toNodeList(r("Features")),e.TempleRegistry.createText(`
+  `,!1)]),e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/markup-syntax.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/markup-syntax.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/markup-syntax.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Markup Syntax")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/markup-syntax.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/markup-syntax.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Markup Syntax")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/state-management.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/state-management.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/state-management.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("State Management")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/state-management.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/state-management.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("State Management")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/component-strategy.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/component-strategy.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/component-strategy.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Component Strategy")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-strategy.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/component-strategy.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Component Strategy")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/compiler-api.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/compiler-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/compiler-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Compiler API")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/compiler-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/compiler-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Compiler API")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/client-api.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/client-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/client-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Client API")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/client-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/client-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Client API")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
 
-    `,!1),e.TempleRegistry.createElement("h6",{},[e.TempleRegistry.createText("Usage",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/template-engine.html"},[e.TempleRegistry.createText("Template Engine",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/single-page.html"},[e.TempleRegistry.createText("Single Page App",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/static-site.html"},[e.TempleRegistry.createText("Static Site Generator",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/component-publisher.html"},[e.TempleRegistry.createText("Component Publisher",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/developer-tools.html"},[e.TempleRegistry.createText("Developer Tools",!1)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("h6",{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},"{ 'class': `bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),...this._toNodeList(r("Usage")),e.TempleRegistry.createText(`
   `,!1)]),e.TempleRegistry.createText(`
-`,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("panel-main",{class:"panel-main"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("div",{class:"docs container"},[e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("h1",{},[...this._toNodeList(o("Single Page App"))]),e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/template-engine.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/template-engine.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/template-engine.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Template Engine")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/template-engine.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/template-engine.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Template Engine")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/single-page.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/single-page.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/single-page.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Single Page App")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/single-page.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/single-page.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Single Page App")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/static-site.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/static-site.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/static-site.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Static Site Generator")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/static-site.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/static-site.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Static Site Generator")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/component-publisher.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/component-publisher.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/component-publisher.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Component Publisher")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-publisher.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/component-publisher.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Component Publisher")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/developer-tools.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold mb-100",href:"/temple/docs/developer-tools.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold mb-100`, 'href': `/temple/docs/developer-tools.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Developer Tools")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 mb-100",href:"/temple/docs/developer-tools.html"},"{ 'class': `block tx-t-1 py-10 pl-10 mb-100`, 'href': `/temple/docs/developer-tools.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Developer Tools")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+`,!1)])]),e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("panel-main",{},"{ }",[e.TempleRegistry.createText(`
+        `,!1),e.TempleRegistry.createElement("api-docs",{},"{ }",[e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("h1",{class:"tx-primary tx-uppercase tx-30 py-20"},"{ 'class': `tx-primary tx-uppercase tx-30 py-20` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(r("Single Page App")),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          A single page application (SPA) is a website or web 
-          application that dynamically rewrites a current web page with 
-          new data from a web server, instead of the default method of 
-          a web browser loading entire new pages. Temple is capable of 
-          creating reactive SPAs using Webpack and TypeScript.
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            A single page application (SPA) is a website or web 
+            application that dynamically rewrites a current web page with 
+            new data from a web server, instead of the default method of 
+            a web browser loading entire new pages. Temple is capable of 
+            creating reactive SPAs using Webpack and TypeScript.
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          First install the following Temple packages.
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("ide-code",{lang:"bash"},[e.TempleRegistry.createText(`
-          npm install --save-dev @ossph/temple @ossph/temple-loader
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            First install the following Temple packages.
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("ide-code",{lang:"bash"},"{ 'lang': `bash` }",[e.TempleRegistry.createText(`
+            npm install --save-dev @ossph/temple @ossph/temple-loader
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Then, install the following TypeScript packages.
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("ide-code",{lang:"bash"},[e.TempleRegistry.createText(`
-          npm install --save-dev @types/node ts-loader ts-node typescript
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            Then, install the following TypeScript packages.
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("ide-code",{lang:"bash"},"{ 'lang': `bash` }",[e.TempleRegistry.createText(`
+            npm install --save-dev @types/node ts-loader ts-node typescript
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Then, install the following Webpack packages.
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("ide-code",{lang:"bash"},[e.TempleRegistry.createText(`
-          npm install --save-dev html-webpack-plugin webpack-dev-server webpack webpack-cli
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            Then, install the following Webpack packages.
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("ide-code",{lang:"bash"},"{ 'lang': `bash` }",[e.TempleRegistry.createText(`
+            npm install --save-dev html-webpack-plugin webpack-dev-server webpack webpack-cli
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Next create the following files and directories.
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            Next create the following files and directories.
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("ide-app",{panel:400,title:"My Project"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("div",{class:"panel-head"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("div",{class:"tabs"},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("tui-tab",{class:"tab",group:"project",selector:"#client-ts"},[e.TempleRegistry.createText(`
-                src/client.ts
+          `,!1),e.TempleRegistry.createElement("ide-app",{height:400,title:"My Project"},"{ 'height': 400, 'title': `My Project` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("app-head",{},"{ }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("div",{class:"flex scroll-x-auto pt-5 pl-5"},"{ 'class': `flex scroll-x-auto pt-5 pl-5` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("tui-tab",{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"project",selector:"#client-ts"},"{ 'class': `relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0`, 'active': `bg-black tx-white`, 'inactive': `bg-t-1 tx-muted`, 'group': `project`, 'selector': `#client-ts` }",[e.TempleRegistry.createText(`
+                  src/client.ts
+                `,!1)]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("tui-tab",{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"project",selector:"#app-tml"},"{ 'class': `relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0`, 'active': `bg-black tx-white`, 'inactive': `bg-t-1 tx-muted`, 'group': `project`, 'selector': `#app-tml` }",[e.TempleRegistry.createText(`
+                  src/app.tml
+                `,!1)]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("tui-tab",{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"project",selector:"#index-html"},"{ 'class': `relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0`, 'active': `bg-black tx-white`, 'inactive': `bg-t-1 tx-muted`, 'group': `project`, 'selector': `#index-html` }",[e.TempleRegistry.createText(`
+                  index.html
+                `,!1)]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("tui-tab",{on:!0,class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"project",selector:"#webpack-js"},"{ 'on': true, 'class': `relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0`, 'active': `bg-black tx-white`, 'inactive': `bg-t-1 tx-muted`, 'group': `project`, 'selector': `#webpack-js` }",[e.TempleRegistry.createText(`
+                  webpack.config.js
+                `,!1)]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("tui-tab",{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"project",selector:"#tsconfig-json"},"{ 'class': `relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0`, 'active': `bg-black tx-white`, 'inactive': `bg-t-1 tx-muted`, 'group': `project`, 'selector': `#tsconfig-json` }",[e.TempleRegistry.createText(`
+                  tsconfig.json
+                `,!1)]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("tui-tab",{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"project",selector:"#package-json"},"{ 'class': `relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0`, 'active': `bg-black tx-white`, 'inactive': `bg-t-1 tx-muted`, 'group': `project`, 'selector': `#package-json` }",[e.TempleRegistry.createText(`
+                  package.json
+                `,!1)]),e.TempleRegistry.createText(`
               `,!1)]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("tui-tab",{class:"tab",group:"project",selector:"#app-tml"},[e.TempleRegistry.createText(`
-                src/app.tml
+            `,!1)]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("app-left",{},"{ }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("h5",{class:"folder"},"{ 'class': `folder` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-down"},"{ 'class': `fas fa-fw fa-chevron-down` }",[]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("span",{},"{ }",[e.TempleRegistry.createText("src",!1)]),e.TempleRegistry.createText(`
               `,!1)]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("tui-tab",{class:"tab",group:"project",selector:"#index-html"},[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("tui-tab",{class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"project",selector:"#app-tml"},"{ 'class': `pl-15 pt-10 block`, 'active': `tx-white`, 'inactive': `tx-muted`, 'group': `project`, 'selector': `#app-tml` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},"{ 'class': `fas fa-fw fa-file` }",[]),e.TempleRegistry.createText(`
+                app.tml
+              `,!1)]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("tui-tab",{class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"project",selector:"#client-ts"},"{ 'class': `pl-15 pt-10 block`, 'active': `tx-white`, 'inactive': `tx-muted`, 'group': `project`, 'selector': `#client-ts` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},"{ 'class': `fas fa-fw fa-file` }",[]),e.TempleRegistry.createText(`
+                client.ts
+              `,!1)]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("tui-tab",{class:"pt-10 block",active:"tx-white",inactive:"tx-muted",group:"project",selector:"#index-html"},"{ 'class': `pt-10 block`, 'active': `tx-white`, 'inactive': `tx-muted`, 'group': `project`, 'selector': `#index-html` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},"{ 'class': `fas fa-fw fa-file` }",[]),e.TempleRegistry.createText(`
                 index.html
               `,!1)]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("tui-tab",{class:"tab active",group:"project",selector:"#webpack-js"},[e.TempleRegistry.createText(`
-                webpack.config.js
+              `,!1),e.TempleRegistry.createElement("tui-tab",{class:"pt-10 block",active:"tx-white",inactive:"tx-muted",group:"project",selector:"#package-json"},"{ 'class': `pt-10 block`, 'active': `tx-white`, 'inactive': `tx-muted`, 'group': `project`, 'selector': `#package-json` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},"{ 'class': `fas fa-fw fa-file` }",[]),e.TempleRegistry.createText(`
+                package.json
               `,!1)]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("tui-tab",{class:"tab",group:"project",selector:"#tsconfig-json"},[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("tui-tab",{class:"pt-10 block",active:"tx-white",inactive:"tx-muted",group:"project",selector:"#tsconfig-json"},"{ 'class': `pt-10 block`, 'active': `tx-white`, 'inactive': `tx-muted`, 'group': `project`, 'selector': `#tsconfig-json` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},"{ 'class': `fas fa-fw fa-file` }",[]),e.TempleRegistry.createText(`
                 tsconfig.json
               `,!1)]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("tui-tab",{class:"tab",group:"project",selector:"#package-json"},[e.TempleRegistry.createText(`
-                package.json
+              `,!1),e.TempleRegistry.createElement("tui-tab",{on:!0,class:"pt-10 block",active:"tx-white",inactive:"tx-muted",group:"project",selector:"#webpack-js"},"{ 'on': true, 'class': `pt-10 block`, 'active': `tx-white`, 'inactive': `tx-muted`, 'group': `project`, 'selector': `#webpack-js` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},"{ 'class': `fas fa-fw fa-file` }",[]),e.TempleRegistry.createText(`
+                webpack.config.js
               `,!1)]),e.TempleRegistry.createText(`
             `,!1)]),e.TempleRegistry.createText(`
-          `,!1)]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("div",{class:"panel-left"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("h5",{class:"folder"},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-down"},[]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("span",{},[e.TempleRegistry.createText("src",!1)]),e.TempleRegistry.createText(`
-            `,!1)]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("tui-tab",{class:"shift-1 block",group:"project",selector:"#app-tml"},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},[]),e.TempleRegistry.createText(`
-              app.tml
-            `,!1)]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("tui-tab",{class:"shift-1 block",group:"project",selector:"#client-ts"},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},[]),e.TempleRegistry.createText(`
-              client.ts
-            `,!1)]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("tui-tab",{class:"block",group:"project",selector:"#index-html"},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},[]),e.TempleRegistry.createText(`
-              index.html
-            `,!1)]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("tui-tab",{class:"block",group:"project",selector:"#package-json"},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},[]),e.TempleRegistry.createText(`
-              package.json
-            `,!1)]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("tui-tab",{class:"block",group:"project",selector:"#tsconfig-json"},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},[]),e.TempleRegistry.createText(`
-              tsconfig.json
-            `,!1)]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("tui-tab",{class:"block active",group:"project",selector:"#webpack-js"},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},[]),e.TempleRegistry.createText(`
-              webpack.config.js
-            `,!1)]),e.TempleRegistry.createText(`
-          `,!1)]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("div",{class:"panel-main"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("main",{},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("ide-code",{id:"client-ts",style:"display:none",lang:"js",numbers:!0,trim:!0,detab:16},[...this._toNodeList(`
+            `,!1),e.TempleRegistry.createElement("app-main",{},"{ }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("ide-code",{id:"client-ts",style:"display:none",lang:"js",numbers:!0,trim:!0,detab:16},"{ 'id': `client-ts`, 'style': `display:none`, 'lang': `js`, 'numbers': true, 'trim': true, 'detab': 16 }",[...this._toNodeList(`
                 import TempleComponent from './app.tml';
 
                 TempleComponent.register();
               `)]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("ide-code",{id:"app-tml",style:"display:none",numbers:!0,trim:!0,detab:16},[...this._toNodeList(`
+              `,!1),e.TempleRegistry.createElement("ide-code",{id:"app-tml",style:"display:none",numbers:!0,trim:!0,detab:16},"{ 'id': `app-tml`, 'style': `display:none`, 'numbers': true, 'trim': true, 'detab': 16 }",[...this._toNodeList(`
                 
                 
    {title}
    
               `)]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("ide-code",{id:"index-html",style:"display:none",numbers:!0,trim:!0,detab:16},[...this._toNodeList(`
+              `,!1),e.TempleRegistry.createElement("ide-code",{id:"index-html",style:"display:none",numbers:!0,trim:!0,detab:16},"{ 'id': `index-html`, 'style': `display:none`, 'numbers': true, 'trim': true, 'detab': 16 }",[...this._toNodeList(`
                 
                 
                   
@@ -197,7 +311,7 @@ ${s}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:
                   
                 
               `)]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("ide-code",{id:"webpack-js",lang:"js",numbers:!0,trim:!0,detab:16},[...this._toNodeList(`
+              `,!1),e.TempleRegistry.createElement("ide-code",{id:"webpack-js",lang:"js",numbers:!0,trim:!0,detab:16},"{ 'id': `webpack-js`, 'lang': `js`, 'numbers': true, 'trim': true, 'detab': 16 }",[...this._toNodeList(`
                 const path = require('path');
                 const HtmlWebpackPlugin = require('html-webpack-plugin');
 
@@ -242,7 +356,7 @@ ${s}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:
                   ]
                 };
               `)]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("ide-code",{id:"tsconfig-json",style:"display:none",lang:"js",numbers:!0,trim:!0,detab:16},[...this._toNodeList(`
+              `,!1),e.TempleRegistry.createElement("ide-code",{id:"tsconfig-json",style:"display:none",lang:"js",numbers:!0,trim:!0,detab:16},"{ 'id': `tsconfig-json`, 'style': `display:none`, 'lang': `js`, 'numbers': true, 'trim': true, 'detab': 16 }",[...this._toNodeList(`
                 {
                   "compilerOptions": {
                     "declaration": true,
@@ -266,7 +380,7 @@ ${s}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:
                   "exclude": [ "dist", "node_modules" ]
                 }
               `)]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("ide-code",{id:"package-json",style:"display:none",lang:"js",numbers:!0,trim:!0,detab:16},[...this._toNodeList(`
+              `,!1),e.TempleRegistry.createElement("ide-code",{id:"package-json",style:"display:none",lang:"js",numbers:!0,trim:!0,detab:16},"{ 'id': `package-json`, 'style': `display:none`, 'lang': `js`, 'numbers': true, 'trim': true, 'detab': 16 }",[...this._toNodeList(`
                 {
                   "name": "my-spa",
                   "version": "1.0.0",
@@ -276,8 +390,8 @@ ${s}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:
                     "build": "webpack --mode production"
                   },
                   "devDependencies": {
-                    "@ossph/temple": "0.1.4"
-                    "@ossph/temple-loader": "0.1.4",
+                    "@ossph/temple": "0.1.6"
+                    "@ossph/temple-loader": "0.1.6",
                     "@types/node": "22.1.0",
                     "html-webpack-plugin": "5.6.0",
                     "webpack-dev-server": "5.0.4",
@@ -291,28 +405,28 @@ ${s}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:
               `)]),e.TempleRegistry.createText(`
             `,!1)]),e.TempleRegistry.createText(`
           `,!1)]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          To test the SPA and see the results, run the following command in terminal.
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("ide-app",{title:"Terminal"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("ide-code",{lang:"bash"},[e.TempleRegistry.createText(`
-            npm run dev
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            To test the SPA and see the results, run the following command in terminal.
           `,!1)]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
-        
-        `,!1),e.TempleRegistry.createElement("nav",{class:"pager"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("a",{class:"prev",href:"/temple/docs/template-engine.html"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-left"},[]),e.TempleRegistry.createText(`
-            `,!1),...this._toNodeList(o("Template Engine")),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("ide-app",{title:"Terminal"},"{ 'title': `Terminal` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("ide-code",{lang:"bash"},"{ 'lang': `bash` }",[e.TempleRegistry.createText(`
+              npm run dev
+            `,!1)]),e.TempleRegistry.createText(`
           `,!1)]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("a",{class:"next",href:"/temple/docs/static-site.html"},[e.TempleRegistry.createText(`
-            `,!1),...this._toNodeList(o("Static Site Generator")),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-right"},[]),e.TempleRegistry.createText(`
+          
+          `,!1),e.TempleRegistry.createElement("nav",{class:"flex"},"{ 'class': `flex` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"tx-primary py-40",href:"/temple/docs/template-engine.html"},"{ 'class': `tx-primary py-40`, 'href': `/temple/docs/template-engine.html` }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-left tx-t-1"},"{ 'class': `fas fa-fw fa-chevron-left tx-t-1` }",[]),e.TempleRegistry.createText(`
+              `,!1),...this._toNodeList(r("Template Engine")),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"flex-grow tx-right tx-primary py-40",href:"/temple/docs/static-site.html"},"{ 'class': `flex-grow tx-right tx-primary py-40`, 'href': `/temple/docs/static-site.html` }",[e.TempleRegistry.createText(`
+              `,!1),...this._toNodeList(r("Static Site Generator")),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-right tx-t-1"},"{ 'class': `fas fa-fw fa-chevron-right tx-t-1` }",[]),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
           `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("footer",{class:"foot"},"{ 'class': `foot` }",[]),e.TempleRegistry.createText(`
         `,!1)]),e.TempleRegistry.createText(`
       `,!1)]),e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("footer",{class:"foot"},[]),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
   `,!1)]),e.TempleRegistry.createText(`
-`,!1)])]}};return ce(He);})();
+`,!1)])]}};return se(Ne);})();
diff --git a/docs/build/server/38ccffadc3c6e8b93d28.js b/docs/build/server/38ccffadc3c6e8b93d28.js
index 1e673c2..c5f9c4e 100644
--- a/docs/build/server/38ccffadc3c6e8b93d28.js
+++ b/docs/build/server/38ccffadc3c6e8b93d28.js
@@ -1,120 +1,236 @@
-var TempleAPI=(()=>{var ee=Object.create;var E=Object.defineProperty;var te=Object.getOwnPropertyDescriptor;var re=Object.getOwnPropertyNames;var ae=Object.getPrototypeOf,le=Object.prototype.hasOwnProperty;var c=(r,t)=>()=>(t||r((t={exports:{}}).exports,t),t.exports),se=(r,t)=>{for(var a in t)E(r,a,{get:t[a],enumerable:!0})},G=(r,t,a,l)=>{if(t&&typeof t=="object"||typeof t=="function")for(let n of re(t))!le.call(r,n)&&n!==a&&E(r,n,{get:()=>t[n],enumerable:!(l=te(t,n))||l.enumerable});return r};var J=(r,t,a)=>(a=r!=null?ee(ae(r)):{},G(t||!r||!r.__esModule?E(a,"default",{value:r,enumerable:!0}):a,r)),ne=r=>G(E({},"__esModule",{value:!0}),r);var D=c(O=>{"use strict";Object.defineProperty(O,"__esModule",{value:!0});var j=class extends Error{static for(t,...a){return a.forEach(function(l){t=t.replace("%s",l)}),new this(t)}static forErrorsFound(t){let a=new this("Invalid Parameters");return a.errors=t,a}static require(t,a,...l){if(!t){for(let n of l)a=a.replace("%s",n);throw new this(a)}}constructor(t,a=500){super(),this.errors={},this.start=0,this.end=0,this.message=t,this.name=this.constructor.name,this.code=a}withCode(t){return this.code=t,this}withPosition(t,a){return this.start=t,this.end=a,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};O.default=j});var S=c(M=>{"use strict";Object.defineProperty(M,"__esModule",{value:!0});var P=class{constructor(t=[]){this._elements=new Set,t.forEach(a=>this._elements.add(a))}add(t){this._elements.add(t)}toArray(){return Array.from(this._elements)}toString(){return Array.from(this._elements).filter(Boolean).map(t=>t.toString()).join("")}};M.default=P});var u=c(q=>{"use strict";Object.defineProperty(q,"__esModule",{value:!0});var ce=new Map;q.default=ce});var b=c(m=>{"use strict";var ie=m&&m.__importDefault||function(r){return r&&r.__esModule?r:{default:r}};Object.defineProperty(m,"__esModule",{value:!0});var oe=ie(S()),fe=["area","base","br","col","embed","hr","img","input","link","meta","param","source","track","wbr"],C=class{static render(t){return t.filter(Boolean).map(a=>a.toString()).join("")}get name(){return this._name}get attributes(){return this._attributes}get children(){return this._children}constructor(t,a={},l=[]){this._attributes={},this._name=t,this._attributes=a,this._children=new oe.default(l)}toString(){let t=Object.entries(this._attributes),a=t.length>0?" "+t.map(([n,f])=>{if(typeof f=="string")return`${n}="${f}"`;if(typeof f=="boolean")return f?n:""}).join(" "):"";if(fe.includes(this._name))return`<${this._name}${a} />`;let l=this._children.toString();return`<${this._name}${a}>${l}`}};m.default=C});var L=c(I=>{"use strict";Object.defineProperty(I,"__esModule",{value:!0});var A=class{get value(){return this._escape?this._value.replace(/&/g,"&").replace(//g,">"):this._value}constructor(t,a=!1){this._escape=a,this._value=t}toString(){return this.value}};I.default=A});var N=c(p=>{"use strict";var W=p&&p.__importDefault||function(r){return r&&r.__esModule?r:{default:r}};Object.defineProperty(p,"__esModule",{value:!0});var ue=W(L()),me=W(b()),$=class{static createElement(t,a,l=[]){return new me.default(t,a,l)}static createText(t,a=!0){return new ue.default(t,a)}};p.default=$});var V=c(h=>{"use strict";var y=h&&h.__importDefault||function(r){return r&&r.__esModule?r:{default:r}};Object.defineProperty(h,"__esModule",{value:!0});var pe=y(D()),k=y(u()),he=y(b()),de=y(N()),B=class{render(t={}){k.default.set("props",t||{}),k.default.set("env",Object.assign(Object.assign({},process.env||{}),{BUILD_ID:this.id(),APP_DATA:btoa(JSON.stringify(Object.assign(Object.assign({},Object.fromEntries(k.default.entries())),{env:Object.assign(Object.assign({},Object.fromEntries(Object.entries(process.env||{}).filter(n=>n[0].startsWith("PUBLIC_")))),{BUILD_ID:this.id()})})))}));let a=this.template(),l=he.default.render(a).trim();if(!l.toLowerCase().startsWith(" tag.");return`
-${l}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:Array.isArray(t)&&t.every(a=>typeof a=="object"&&typeof a.nodeType=="number")?t:[de.default.createText(String(t))]}};h.default=B});var Y=c(d=>{"use strict";Object.defineProperty(d,"__esModule",{value:!0});d.TempleEmitter=void 0;var v=class{emit(t,a){return this}on(t,a){return this}once(t,a){return this}unbind(t,a){return this}};d.TempleEmitter=v;var Te=new v;d.default=Te});var z=c(T=>{"use strict";var _e=T&&T.__importDefault||function(r){return r&&r.__esModule?r:{default:r}};Object.defineProperty(T,"__esModule",{value:!0});var xe=_e(u());function ge(r){let t=xe.default.get("env")||{};return r?t[r]||null:t}T.default=ge});var U=c(_=>{"use strict";var Ee=_&&_.__importDefault||function(r){return r&&r.__esModule?r:{default:r}};Object.defineProperty(_,"__esModule",{value:!0});_.default=ye;var be=Ee(u());function ye(){return be.default.get("props")||{}}});var H=c(x=>{"use strict";var ve=x&&x.__importDefault||function(r){return r&&r.__esModule?r:{default:r}};Object.defineProperty(x,"__esModule",{value:!0});x.default=je;var we=ve(U());function je(){return(0,we.default)().class}});var K=c(R=>{"use strict";Object.defineProperty(R,"__esModule",{value:!0});R.default=Oe;function Oe(r){let t={getter:()=>a.raw,setter:l=>l},a={raw:r,getter(l){return t.getter=l,a},setter(l){return t.setter=l,a}};return Object.defineProperty(a,"value",{get(){return t.getter()},set(l){a.raw=t.setter(l)}}),a}});var X=c(s=>{"use strict";var De=s&&s.__createBinding||(Object.create?function(r,t,a,l){l===void 0&&(l=a);var n=Object.getOwnPropertyDescriptor(t,a);(!n||("get"in n?!t.__esModule:n.writable||n.configurable))&&(n={enumerable:!0,get:function(){return t[a]}}),Object.defineProperty(r,l,n)}:function(r,t,a,l){l===void 0&&(l=a),r[l]=t[a]}),Pe=s&&s.__setModuleDefault||(Object.create?function(r,t){Object.defineProperty(r,"default",{enumerable:!0,value:t})}:function(r,t){r.default=t}),Me=s&&s.__importStar||function(r){if(r&&r.__esModule)return r;var t={};if(r!=null)for(var a in r)a!=="default"&&Object.prototype.hasOwnProperty.call(r,a)&&De(t,r,a);return Pe(t,r),t},i=s&&s.__importDefault||function(r){return r&&r.__esModule?r:{default:r}};Object.defineProperty(s,"__esModule",{value:!0});s.TempleText=s.TempleException=s.TempleEmitter=s.TempleElement=s.TempleRegistry=s.TempleDocument=s.TempleCollection=s.signal=s.classnames=s.props=s.emitter=s.env=s.data=void 0;var Se=i(D());s.TempleException=Se.default;var qe=i(S());s.TempleCollection=qe.default;var Ce=i(V());s.TempleDocument=Ce.default;var Ae=i(N());s.TempleRegistry=Ae.default;var Ie=i(b());s.TempleElement=Ie.default;var Q=Me(Y());s.emitter=Q.default;Object.defineProperty(s,"TempleEmitter",{enumerable:!0,get:function(){return Q.TempleEmitter}});var Le=i(L());s.TempleText=Le.default;var $e=i(u());s.data=$e.default;var Ne=i(z());s.env=Ne.default;var ke=i(U());s.props=ke.default;var Be=i(H());s.classnames=Be.default;var Ue=i(K());s.signal=Ue.default});var F=c((at,Z)=>{Z.exports={...X()}});var Fe={};se(Fe,{default:()=>w});var e=J(F()),g=J(F());var o=function(r,...t){let a=Re(r);for(let l=0;l{document.body.classList.toggle("panel-left-open")};return[e.TempleRegistry.createText(`
-`,!1),e.TempleRegistry.createElement("html",{},[e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("head",{},[e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{charset:"utf-8"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"viewport",content:"width=device-width, initial-scale=1"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("title",{},[...this._toNodeList(a)]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"description",content:l}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:title",content:a}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:description",content:l}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:image",content:"https://ossphilippines.github.io/temple/temple-logo.png"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:url",content:`https://ossphilippines.github.io/temple${t}`}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:type",content:"website"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:card",content:"summary"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:site",content:"@OSSPhilippines"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:title",content:a}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:description",content:l}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:image",content:"https://ossphilippines.github.io/temple/temple-logo.png"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"favicon",href:"/temple/favicon.ico"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"shortcut icon",type:"image/png",href:"/temple/favicon.png"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/fontawesome/all.css"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/theme.css"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:`/temple/build/client/${(0,g.env)("BUILD_ID")}.css`}),e.TempleRegistry.createText(`
+var TempleAPI=(()=>{var X=Object.create;var g=Object.defineProperty;var Z=Object.getOwnPropertyDescriptor;var ee=Object.getOwnPropertyNames;var te=Object.getPrototypeOf,le=Object.prototype.hasOwnProperty;var i=(l,t)=>()=>(t||l((t={exports:{}}).exports,t),t.exports),ae=(l,t)=>{for(var a in t)g(l,a,{get:t[a],enumerable:!0})},G=(l,t,a,s)=>{if(t&&typeof t=="object"||typeof t=="function")for(let n of ee(t))!le.call(l,n)&&n!==a&&g(l,n,{get:()=>t[n],enumerable:!(s=Z(t,n))||s.enumerable});return l};var R=(l,t,a)=>(a=l!=null?X(te(l)):{},G(t||!l||!l.__esModule?g(a,"default",{value:l,enumerable:!0}):a,l)),se=l=>G(g({},"__esModule",{value:!0}),l);var v=i(w=>{"use strict";Object.defineProperty(w,"__esModule",{value:!0});var E=class extends Error{static for(t,...a){return a.forEach(function(s){t=t.replace("%s",s)}),new this(t)}static forErrorsFound(t){let a=new this("Invalid Parameters");return a.errors=t,a}static require(t,a,...s){if(!t){for(let n of s)a=a.replace("%s",n);throw new this(a)}}constructor(t,a=500){super(),this.errors={},this.start=0,this.end=0,this.message=t,this.name=this.constructor.name,this.code=a}withCode(t){return this.code=t,this}withPosition(t,a){return this.start=t,this.end=a,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};w.default=E});var L=i(j=>{"use strict";Object.defineProperty(j,"__esModule",{value:!0});var k=class{get length(){return this._elements.size}constructor(t=[]){this._elements=new Set,t.forEach(a=>this._elements.add(a))}add(t){this._elements.add(t)}toArray(){return Array.from(this._elements)}toString(){return Array.from(this._elements).filter(Boolean).map(t=>t.toString()).join("")}};j.default=k});var p=i(D=>{"use strict";Object.defineProperty(D,"__esModule",{value:!0});var re=new Map;D.default=re});var N=i(O=>{"use strict";Object.defineProperty(O,"__esModule",{value:!0});var P=class{get value(){return this._escape?this._value.replace(/&/g,"&").replace(//g,">"):this._value}constructor(t,a=!1){this._escape=a,this._value=t}toString(){return this.value}};O.default=P});var M=i(f=>{"use strict";var ce=f&&f.__importDefault||function(l){return l&&l.__esModule?l:{default:l}};Object.defineProperty(f,"__esModule",{value:!0});var ne=ce(L()),ie=["area","base","br","col","embed","hr","img","input","link","meta","param","source","track","wbr"],S=class{get attributes(){return this._attributes}get children(){return this._children}get name(){return this._name}get props(){return this._props}constructor(t,a={},s="",n=[]){this._attributes={},this._name=t,this._attributes=a,this._props=s,this._children=new ne.default(n)}toString(){let t=Object.entries(this._attributes),a=t.length>0?" "+t.map(([n,b])=>{if(typeof b=="string")return`${n}="${b}"`;if(typeof b=="boolean")return b?n:""}).join(" "):"";if(ie.includes(this._name))return`<${this._name}${a} />`;let s=this._children.toString();return`<${this._name}${a}>${s}`}};f.default=S});var I=i(m=>{"use strict";var J=m&&m.__importDefault||function(l){return l&&l.__esModule?l:{default:l}};Object.defineProperty(m,"__esModule",{value:!0});var oe=J(N()),F=J(M()),A=class{static render(t){return t.filter(Boolean).map(a=>a.toString()).join("")}static registry(t,a=new Set){return t.forEach(s=>{s instanceof F.default&&(["html","head","body"].includes(s.name)||a.add(s),s.name!=="head"&&s.children.length>0&&this.registry(s.children.toArray(),a))}),a}static createElement(t,a,s,n=[]){return new F.default(t,a,s,n)}static createText(t,a=!0){return new oe.default(t,a)}};m.default=A});var W=i(x=>{"use strict";var B=x&&x.__importDefault||function(l){return l&&l.__esModule?l:{default:l}};Object.defineProperty(x,"__esModule",{value:!0});var pe=B(v()),C=B(p()),q=B(I()),$=class{bindings(){let t=q.default.registry(this.template());return`{ ${Array.from(t.values()).map((s,n)=>s.props!=="{ }"?`'${n}': ${s.props}`:"").filter(s=>s!=="").join(", ")} }`}render(t={}){C.default.set("props",t||{}),C.default.set("env",Object.assign(Object.assign({},process.env||{}),{BUILD_ID:this.id(),APP_DATA:btoa(JSON.stringify(Object.assign(Object.assign({},Object.fromEntries(C.default.entries())),{env:Object.assign(Object.assign({},Object.fromEntries(Object.entries(process.env||{}).filter(n=>n[0].startsWith("PUBLIC_")))),{BUILD_ID:this.id()})})))}));let a=this.template(),s=q.default.render(a).trim();if(!s.toLowerCase().startsWith(" tag.");return`
+${s}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:Array.isArray(t)&&t.every(a=>typeof a=="object"&&typeof a.nodeType=="number")?t:[q.default.createText(String(t))]}};x.default=$});var z=i(h=>{"use strict";Object.defineProperty(h,"__esModule",{value:!0});h.TempleEmitter=void 0;var y=class{emit(t,a){return this}on(t,a){return this}once(t,a){return this}unbind(t,a){return this}};h.TempleEmitter=y;var fe=new y;h.default=fe});var V=i(u=>{"use strict";var me=u&&u.__importDefault||function(l){return l&&l.__esModule?l:{default:l}};Object.defineProperty(u,"__esModule",{value:!0});var xe=me(p());function he(l){let t=xe.default.get("env")||{};return l?t[l]||null:t}u.default=he});var Y=i(d=>{"use strict";var ue=d&&d.__importDefault||function(l){return l&&l.__esModule?l:{default:l}};Object.defineProperty(d,"__esModule",{value:!0});d.default=Te;var de=ue(p());function Te(){return de.default.get("props")||{}}});var K=i(c=>{"use strict";var be=c&&c.__createBinding||(Object.create?function(l,t,a,s){s===void 0&&(s=a);var n=Object.getOwnPropertyDescriptor(t,a);(!n||("get"in n?!t.__esModule:n.writable||n.configurable))&&(n={enumerable:!0,get:function(){return t[a]}}),Object.defineProperty(l,s,n)}:function(l,t,a,s){s===void 0&&(s=a),l[s]=t[a]}),ge=c&&c.__setModuleDefault||(Object.create?function(l,t){Object.defineProperty(l,"default",{enumerable:!0,value:t})}:function(l,t){l.default=t}),ye=c&&c.__importStar||function(l){if(l&&l.__esModule)return l;var t={};if(l!=null)for(var a in l)a!=="default"&&Object.prototype.hasOwnProperty.call(l,a)&&be(t,l,a);return ge(t,l),t},o=c&&c.__importDefault||function(l){return l&&l.__esModule?l:{default:l}};Object.defineProperty(c,"__esModule",{value:!0});c.TempleText=c.TempleException=c.TempleEmitter=c.TempleElement=c.TempleRegistry=c.TempleDocument=c.TempleCollection=c.props=c.emitter=c.env=c.data=void 0;var _e=o(v());c.TempleException=_e.default;var Ee=o(L());c.TempleCollection=Ee.default;var we=o(W());c.TempleDocument=we.default;var ve=o(I());c.TempleRegistry=ve.default;var ke=o(M());c.TempleElement=ke.default;var H=ye(z());c.emitter=H.default;Object.defineProperty(c,"TempleEmitter",{enumerable:!0,get:function(){return H.TempleEmitter}});var je=o(N());c.TempleText=je.default;var Le=o(p());c.data=Le.default;var De=o(V());c.env=De.default;var Pe=o(Y());c.props=Pe.default});var U=i((Je,Q)=>{Q.exports={...K()}});var Ne={};ae(Ne,{default:()=>_});var e=R(U()),T=R(U());var r=function(l,...t){let a=Oe(l);for(let s=0;s{document.getElementsByTagName("panel-layout")[0].toggle("left")};return[e.TempleRegistry.createText(`
+`,!1),e.TempleRegistry.createElement("html",{},"{ }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("head",{},"{ }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{charset:"utf-8"},"{ 'charset': `utf-8` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"viewport",content:"width=device-width, initial-scale=1"},"{ 'name': `viewport`, 'content': `width=device-width, initial-scale=1` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("title",{},"{ }",[...this._toNodeList(a)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"description",content:s},"{ 'name': `description`, 'content': description }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:title",content:a},"{ 'property': `og:title`, 'content': title }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:description",content:s},"{ 'property': `og:description`, 'content': description }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:image",content:"https://ossphilippines.github.io/temple/temple-logo.png"},"{ 'property': `og:image`, 'content': `https://ossphilippines.github.io/temple/temple-logo.png` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:url",content:`https://ossphilippines.github.io/temple${t}`},"{ 'property': `og:url`, 'content': `https://ossphilippines.github.io/temple${url}` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:type",content:"website"},"{ 'property': `og:type`, 'content': `website` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:card",content:"summary"},"{ 'name': `twitter:card`, 'content': `summary` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:site",content:"@OSSPhilippines"},"{ 'name': `twitter:site`, 'content': `@OSSPhilippines` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:title",content:a},"{ 'name': `twitter:title`, 'content': title }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:description",content:s},"{ 'name': `twitter:description`, 'content': description }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:image",content:"https://ossphilippines.github.io/temple/temple-logo.png"},"{ 'name': `twitter:image`, 'content': `https://ossphilippines.github.io/temple/temple-logo.png` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"favicon",href:"/temple/favicon.ico"},"{ 'rel': `favicon`, 'href': `/temple/favicon.ico` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"shortcut icon",type:"image/png",href:"/temple/favicon.png"},"{ 'rel': `shortcut icon`, 'type': `image/png`, 'href': `/temple/favicon.png` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/fontawesome/all.css"},"{ 'rel': `stylesheet`, 'type': `text/css`, 'href': `/temple/styles/fontawesome/all.css` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/global.css"},"{ 'rel': `stylesheet`, 'type': `text/css`, 'href': `/temple/styles/global.css` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:`/temple/build/client/${(0,T.env)("BUILD_ID")}.css`},"{ 'rel': `stylesheet`, 'type': `text/css`, 'href': `/temple/build/client/${env('BUILD_ID')}.css` }"),e.TempleRegistry.createText(`
   
-  `,!1),e.TempleRegistry.createElement("script",{"data-app":(0,g.env)("APP_DATA"),src:`/temple/build/client/${(0,g.env)("BUILD_ID")}.js`}),e.TempleRegistry.createText(`
-  `,!1),...(0,g.env)("NODE_ENV")==="development"?[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("script",{src:"/dev.js"}),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("script",{"data-app":(0,T.env)("APP_DATA"),src:`/temple/build/client/${(0,T.env)("BUILD_ID")}.js`},"{ 'data-app': env('APP_DATA'), 'src': `/temple/build/client/${env('BUILD_ID')}.js` }"),e.TempleRegistry.createText(`
+  `,!1),...(0,T.env)("NODE_ENV")==="development"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("script",{src:"/dev.js"},"{ 'src': `/dev.js` }"),e.TempleRegistry.createText(`
   `,!1)]:[],e.TempleRegistry.createText(`
 `,!1)]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("body",{class:"dark panel with-head with-left"},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("header",{class:"head panel-head"},[e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("i",{class:"menu fas fa-fw fa-bars",click:n},[]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("a",{href:"/temple"},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("img",{src:"/temple/temple-icon.png",alt:"Temple Logo"}),e.TempleRegistry.createText(`
-  `,!1)]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("h3",{},[e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple"},[e.TempleRegistry.createText("Temple",!1)])]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("nav",{},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple/docs/index.html"},[e.TempleRegistry.createText("Docs",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{class:"github",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-github"},[]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("body",{class:"dark bg-t-0 tx-t1 arial"},"{ 'class': `dark bg-t-0 tx-t1 arial` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("panel-layout",{},"{ }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("panel-head",{},"{ }",[e.TempleRegistry.createElement("menu",{class:"flex flex-center-y px-20 py-15 m-0 bg-t-1"},"{ 'class': `flex flex-center-y px-20 py-15 m-0 bg-t-1` }",[e.TempleRegistry.createText(`
+  `,!1),...t!=="/temple/index.html"&&t!=="/temple/500.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-bars cursor-pointer py-5 pr-10 none md-inline-block tx-t-1",click:n},"{ 'class': `fas fa-fw fa-bars cursor-pointer py-5 pr-10 none md-inline-block tx-t-1`, 'click': toggle }",[]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("div",{class:"flex-grow"},"{ 'class': `flex-grow` }",[]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{href:"/temple"},"{ 'href': `/temple` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("img",{alt:"Temple Logo",class:"h-26 mr-10",src:"/temple/temple-icon.png"},"{ 'alt': `Temple Logo`, 'class': `h-26 mr-10`, 'src': `/temple/temple-icon.png` }"),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("h3",{class:"flex-grow tx-uppercase"},"{ 'class': `flex-grow tx-uppercase` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple"},"{ 'class': `tx-white`, 'href': `/temple` }",[e.TempleRegistry.createText("Temple",!1)]),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("nav",{class:"flex flex-center-y"},"{ 'class': `flex flex-center-y` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple/docs/index.html"},"{ 'class': `tx-white`, 'href': `/temple/docs/index.html` }",[e.TempleRegistry.createText("Docs",!1)]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"tx-t-1 tx-5xl ml-10",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},"{ 'class': `tx-t-1 tx-5xl ml-10`, 'href': `https://github.com/OSSPhilippines/temple`, 'target': `_blank` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-github"},"{ 'class': `fab fa-github` }",[]),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{class:"npm",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-npm text-white"},[]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"bg-h-cb3837 pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},"{ 'class': `bg-h-cb3837 pill tx-t-1 tx-lg ml-5 p-5 tx-center`, 'href': `https://www.npmjs.com/package/@ossph/temple`, 'target': `_blank` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-npm text-white"},"{ 'class': `fab fa-npm text-white` }",[]),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{class:"discord",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-discord text-white"},[]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"bg-h-7289da pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},"{ 'class': `bg-h-7289da pill tx-t-1 tx-lg ml-5 p-5 tx-center`, 'href': `https://discord.gg/open-source-software-ph-905496362982981723`, 'target': `_blank` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-discord text-white"},"{ 'class': `fab fa-discord text-white` }",[]),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
   `,!1)]),e.TempleRegistry.createText(`
+`,!1)])]),e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("panel-left",{},"{ }",[e.TempleRegistry.createElement("header",{class:"flex flex-center-y bg-t-2 py-15 pr-5 pl-10"},"{ 'class': `flex flex-center-y bg-t-2 py-15 pr-5 pl-10` }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("a",{href:"/temple"},"{ 'href': `/temple` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("img",{class:"h-26 mr-10",src:"/temple/temple-icon.png",alt:"Temple Logo"},"{ 'class': `h-26 mr-10`, 'src': `/temple/temple-icon.png`, 'alt': `Temple Logo` }"),e.TempleRegistry.createText(`
+  `,!1)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("h3",{class:"flex-grow m-0 tx-uppercase"},"{ 'class': `flex-grow m-0 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple"},"{ 'class': `tx-white`, 'href': `/temple` }",[e.TempleRegistry.createText("Temple",!1)]),e.TempleRegistry.createText(`
+  `,!1)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-left cursor-pointer none md-inline-block",click:n},"{ 'class': `fas fa-fw fa-chevron-left cursor-pointer none md-inline-block`, 'click': toggle }",[]),e.TempleRegistry.createText(`
 `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("aside",{class:"left panel-left"},[e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("header",{},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("img",{src:"/temple/temple-icon.png",alt:"Temple Logo"}),e.TempleRegistry.createText(`
-    `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("h3",{},[e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple"},[e.TempleRegistry.createText("Temple",!1)])]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("i",{class:"toggle fas fa-fw fa-chevron-left",click:n},[]),e.TempleRegistry.createText(`
+`,!1),e.TempleRegistry.createElement("nav",{class:"bg-t-1 scroll-auto h-calc-full-60"},"{ 'class': `bg-t-1 scroll-auto h-calc-full-60` }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("h6",{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-0 pt-20 pb-10 pl-10 tx-uppercase"},"{ 'class': `bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-0 pt-20 pb-10 pl-10 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),...this._toNodeList(r("Introduction")),e.TempleRegistry.createText(`
   `,!1)]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("nav",{},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("h6",{},[e.TempleRegistry.createText("Introduction",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/index.html"},[e.TempleRegistry.createText("Documentation",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/getting-started.html"},[e.TempleRegistry.createText("Getting Started",!1)]),e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/index.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/index.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/index.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Documentation")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/index.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/index.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Documentation")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/getting-started.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/getting-started.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/getting-started.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Getting Started")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/getting-started.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/getting-started.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Getting Started")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
 
-    `,!1),e.TempleRegistry.createElement("h6",{},[e.TempleRegistry.createText("Features",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/markup-syntax.html"},[e.TempleRegistry.createText("Markup Syntax",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/state-management.html"},[e.TempleRegistry.createText("State Management",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/component-strategy.html"},[e.TempleRegistry.createText("Component Strategy",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/compiler-api.html"},[e.TempleRegistry.createText("Compiler API",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/client-api.html"},[e.TempleRegistry.createText("Client API",!1)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("h6",{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},"{ 'class': `bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),...this._toNodeList(r("Features")),e.TempleRegistry.createText(`
+  `,!1)]),e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/markup-syntax.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/markup-syntax.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/markup-syntax.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Markup Syntax")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/markup-syntax.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/markup-syntax.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Markup Syntax")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/state-management.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/state-management.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/state-management.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("State Management")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/state-management.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/state-management.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("State Management")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/component-strategy.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/component-strategy.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/component-strategy.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Component Strategy")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-strategy.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/component-strategy.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Component Strategy")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/compiler-api.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/compiler-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/compiler-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Compiler API")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/compiler-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/compiler-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Compiler API")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/client-api.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/client-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/client-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Client API")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/client-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/client-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Client API")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
 
-    `,!1),e.TempleRegistry.createElement("h6",{},[e.TempleRegistry.createText("Usage",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/template-engine.html"},[e.TempleRegistry.createText("Template Engine",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/single-page.html"},[e.TempleRegistry.createText("Single Page App",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/static-site.html"},[e.TempleRegistry.createText("Static Site Generator",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/component-publisher.html"},[e.TempleRegistry.createText("Component Publisher",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/developer-tools.html"},[e.TempleRegistry.createText("Developer Tools",!1)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("h6",{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},"{ 'class': `bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),...this._toNodeList(r("Usage")),e.TempleRegistry.createText(`
   `,!1)]),e.TempleRegistry.createText(`
-`,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("panel-main",{class:"panel-main"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("div",{class:"docs container"},[e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("h1",{},[...this._toNodeList(o("Compiler API"))]),e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/template-engine.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/template-engine.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/template-engine.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Template Engine")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/template-engine.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/template-engine.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Template Engine")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/single-page.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/single-page.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/single-page.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Single Page App")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/single-page.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/single-page.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Single Page App")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/static-site.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/static-site.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/static-site.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Static Site Generator")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/static-site.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/static-site.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Static Site Generator")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/component-publisher.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/component-publisher.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/component-publisher.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Component Publisher")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-publisher.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/component-publisher.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Component Publisher")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/developer-tools.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold mb-100",href:"/temple/docs/developer-tools.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold mb-100`, 'href': `/temple/docs/developer-tools.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Developer Tools")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 mb-100",href:"/temple/docs/developer-tools.html"},"{ 'class': `block tx-t-1 py-10 pl-10 mb-100`, 'href': `/temple/docs/developer-tools.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Developer Tools")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+`,!1)])]),e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("panel-main",{},"{ }",[e.TempleRegistry.createText(`
+        `,!1),e.TempleRegistry.createElement("api-docs",{},"{ }",[e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("h1",{class:"tx-primary tx-uppercase tx-30 py-20"},"{ 'class': `tx-primary tx-uppercase tx-30 py-20` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(r("Compiler API")),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          The developer interface for the Temple compiler is designed 
-          to be expressive and easily access the Temple library in most 
-          scenarios. To create a new temple compiler you can follow the 
-          code below.
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",trim:!0,detab:10},[e.TempleRegistry.createText(`
-          import temple from '@ossph/temple';
-          const compiler = temple();
-        `,!1)]),e.TempleRegistry.createText(` 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`  
-          The `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},[e.TempleRegistry.createText("temple()",!1)]),e.TempleRegistry.createText(` 
-          function itself takes in the following options, all of 
-          which are optional.
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            The developer interface for the Temple compiler is designed 
+            to be expressive and easily access the Temple library in most 
+            scenarios. To create a new temple compiler you can follow the 
+            code below.
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",trim:!0,detab:10},"{ 'lang': `js`, 'trim': true, 'detab': 10 }",[e.TempleRegistry.createText(`
+            import temple from '@ossph/temple';
+            const compiler = temple();
+          `,!1)]),e.TempleRegistry.createText(` 
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`  
+            The `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},"{ 'lang': `js`, 'inline': true }",[e.TempleRegistry.createText("temple()",!1)]),e.TempleRegistry.createText(` 
+            function itself takes in the following options, all of 
+            which are optional.
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("api-ui",{start:"TempleOptions"}),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Calling `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},[...this._toNodeList("temple()")]),e.TempleRegistry.createText(` as in 
-          `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},[...this._toNodeList("compiler = temple({/*options*/})")]),e.TempleRegistry.createText(` 
-          returns the Temple compiler which contains the following object.
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("api-ui",{}),e.TempleRegistry.createText(`
-        
-        `,!1),e.TempleRegistry.createElement("nav",{class:"pager"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("a",{class:"prev",href:"/temple/docs/component-strategy.html"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-left"},[]),e.TempleRegistry.createText(`
-            `,!1),...this._toNodeList(o("Component Strategy")),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("api-ui",{start:"TempleOptions"},"{ 'start': `TempleOptions` }"),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            Calling `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},"{ 'lang': `js`, 'inline': true }",[...this._toNodeList("temple()")]),e.TempleRegistry.createText(` as in 
+            `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},"{ 'lang': `js`, 'inline': true }",[...this._toNodeList("compiler = temple({/*options*/})")]),e.TempleRegistry.createText(` 
+            returns the Temple compiler which contains the following object.
           `,!1)]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("a",{class:"next",href:"/temple/docs/client-api.html"},[e.TempleRegistry.createText(`
-            `,!1),...this._toNodeList(o("Client API")),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-right"},[]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("api-ui",{},"{ }"),e.TempleRegistry.createText(`
+
+          `,!1),e.TempleRegistry.createElement("nav",{class:"flex"},"{ 'class': `flex` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"tx-primary py-40",href:"/temple/docs/component-strategy.html"},"{ 'class': `tx-primary py-40`, 'href': `/temple/docs/component-strategy.html` }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-left tx-t-1"},"{ 'class': `fas fa-fw fa-chevron-left tx-t-1` }",[]),e.TempleRegistry.createText(`
+              `,!1),...this._toNodeList(r("Component Strategy")),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"flex-grow tx-right tx-primary py-40",href:"/temple/docs/client-api.html"},"{ 'class': `flex-grow tx-right tx-primary py-40`, 'href': `/temple/docs/client-api.html` }",[e.TempleRegistry.createText(`
+              `,!1),...this._toNodeList(r("Client API")),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-right tx-t-1"},"{ 'class': `fas fa-fw fa-chevron-right tx-t-1` }",[]),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
           `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("footer",{class:"foot"},"{ 'class': `foot` }",[]),e.TempleRegistry.createText(`
         `,!1)]),e.TempleRegistry.createText(`
       `,!1)]),e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("footer",{class:"foot"},[]),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
   `,!1)]),e.TempleRegistry.createText(`
-`,!1)])]}};return ne(Fe);})();
+`,!1)])]}};return se(Ne);})();
diff --git a/docs/build/server/3e6a90cc5da3e950a902.js b/docs/build/server/3e6a90cc5da3e950a902.js
index 660d314..1655c6e 100644
--- a/docs/build/server/3e6a90cc5da3e950a902.js
+++ b/docs/build/server/3e6a90cc5da3e950a902.js
@@ -1,171 +1,287 @@
-var TempleAPI=(()=>{var ee=Object.create;var E=Object.defineProperty;var te=Object.getOwnPropertyDescriptor;var ae=Object.getOwnPropertyNames;var re=Object.getPrototypeOf,le=Object.prototype.hasOwnProperty;var c=(a,t)=>()=>(t||a((t={exports:{}}).exports,t),t.exports),se=(a,t)=>{for(var r in t)E(a,r,{get:t[r],enumerable:!0})},J=(a,t,r,l)=>{if(t&&typeof t=="object"||typeof t=="function")for(let n of ae(t))!le.call(a,n)&&n!==r&&E(a,n,{get:()=>t[n],enumerable:!(l=te(t,n))||l.enumerable});return a};var G=(a,t,r)=>(r=a!=null?ee(re(a)):{},J(t||!a||!a.__esModule?E(r,"default",{value:a,enumerable:!0}):r,a)),ne=a=>J(E({},"__esModule",{value:!0}),a);var D=c(O=>{"use strict";Object.defineProperty(O,"__esModule",{value:!0});var j=class extends Error{static for(t,...r){return r.forEach(function(l){t=t.replace("%s",l)}),new this(t)}static forErrorsFound(t){let r=new this("Invalid Parameters");return r.errors=t,r}static require(t,r,...l){if(!t){for(let n of l)r=r.replace("%s",n);throw new this(r)}}constructor(t,r=500){super(),this.errors={},this.start=0,this.end=0,this.message=t,this.name=this.constructor.name,this.code=r}withCode(t){return this.code=t,this}withPosition(t,r){return this.start=t,this.end=r,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};O.default=j});var M=c(P=>{"use strict";Object.defineProperty(P,"__esModule",{value:!0});var S=class{constructor(t=[]){this._elements=new Set,t.forEach(r=>this._elements.add(r))}add(t){this._elements.add(t)}toArray(){return Array.from(this._elements)}toString(){return Array.from(this._elements).filter(Boolean).map(t=>t.toString()).join("")}};P.default=S});var f=c(q=>{"use strict";Object.defineProperty(q,"__esModule",{value:!0});var ce=new Map;q.default=ce});var b=c(m=>{"use strict";var ie=m&&m.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(m,"__esModule",{value:!0});var oe=ie(M()),fe=["area","base","br","col","embed","hr","img","input","link","meta","param","source","track","wbr"],L=class{static render(t){return t.filter(Boolean).map(r=>r.toString()).join("")}get name(){return this._name}get attributes(){return this._attributes}get children(){return this._children}constructor(t,r={},l=[]){this._attributes={},this._name=t,this._attributes=r,this._children=new oe.default(l)}toString(){let t=Object.entries(this._attributes),r=t.length>0?" "+t.map(([n,o])=>{if(typeof o=="string")return`${n}="${o}"`;if(typeof o=="boolean")return o?n:""}).join(" "):"";if(fe.includes(this._name))return`<${this._name}${r} />`;let l=this._children.toString();return`<${this._name}${r}>${l}`}};m.default=L});var C=c(A=>{"use strict";Object.defineProperty(A,"__esModule",{value:!0});var k=class{get value(){return this._escape?this._value.replace(/&/g,"&").replace(//g,">"):this._value}constructor(t,r=!1){this._escape=r,this._value=t}toString(){return this.value}};A.default=k});var $=c(u=>{"use strict";var F=u&&u.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(u,"__esModule",{value:!0});var me=F(C()),ue=F(b()),I=class{static createElement(t,r,l=[]){return new ue.default(t,r,l)}static createText(t,r=!0){return new me.default(t,r)}};u.default=I});var W=c(p=>{"use strict";var v=p&&p.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(p,"__esModule",{value:!0});var pe=v(D()),N=v(f()),de=v(b()),he=v($()),B=class{render(t={}){N.default.set("props",t||{}),N.default.set("env",Object.assign(Object.assign({},process.env||{}),{BUILD_ID:this.id(),APP_DATA:btoa(JSON.stringify(Object.assign(Object.assign({},Object.fromEntries(N.default.entries())),{env:Object.assign(Object.assign({},Object.fromEntries(Object.entries(process.env||{}).filter(n=>n[0].startsWith("PUBLIC_")))),{BUILD_ID:this.id()})})))}));let r=this.template(),l=de.default.render(r).trim();if(!l.toLowerCase().startsWith(" tag.");return`
-${l}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:Array.isArray(t)&&t.every(r=>typeof r=="object"&&typeof r.nodeType=="number")?t:[he.default.createText(String(t))]}};p.default=B});var V=c(d=>{"use strict";Object.defineProperty(d,"__esModule",{value:!0});d.TempleEmitter=void 0;var y=class{emit(t,r){return this}on(t,r){return this}once(t,r){return this}unbind(t,r){return this}};d.TempleEmitter=y;var Te=new y;d.default=Te});var Y=c(h=>{"use strict";var _e=h&&h.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(h,"__esModule",{value:!0});var xe=_e(f());function ge(a){let t=xe.default.get("env")||{};return a?t[a]||null:t}h.default=ge});var H=c(T=>{"use strict";var Ee=T&&T.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(T,"__esModule",{value:!0});T.default=ve;var be=Ee(f());function ve(){return be.default.get("props")||{}}});var z=c(_=>{"use strict";var ye=_&&_.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(_,"__esModule",{value:!0});_.default=je;var we=ye(H());function je(){return(0,we.default)().class}});var K=c(R=>{"use strict";Object.defineProperty(R,"__esModule",{value:!0});R.default=Oe;function Oe(a){let t={getter:()=>r.raw,setter:l=>l},r={raw:a,getter(l){return t.getter=l,r},setter(l){return t.setter=l,r}};return Object.defineProperty(r,"value",{get(){return t.getter()},set(l){r.raw=t.setter(l)}}),r}});var X=c(s=>{"use strict";var De=s&&s.__createBinding||(Object.create?function(a,t,r,l){l===void 0&&(l=r);var n=Object.getOwnPropertyDescriptor(t,r);(!n||("get"in n?!t.__esModule:n.writable||n.configurable))&&(n={enumerable:!0,get:function(){return t[r]}}),Object.defineProperty(a,l,n)}:function(a,t,r,l){l===void 0&&(l=r),a[l]=t[r]}),Se=s&&s.__setModuleDefault||(Object.create?function(a,t){Object.defineProperty(a,"default",{enumerable:!0,value:t})}:function(a,t){a.default=t}),Pe=s&&s.__importStar||function(a){if(a&&a.__esModule)return a;var t={};if(a!=null)for(var r in a)r!=="default"&&Object.prototype.hasOwnProperty.call(a,r)&&De(t,a,r);return Se(t,a),t},i=s&&s.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(s,"__esModule",{value:!0});s.TempleText=s.TempleException=s.TempleEmitter=s.TempleElement=s.TempleRegistry=s.TempleDocument=s.TempleCollection=s.signal=s.classnames=s.props=s.emitter=s.env=s.data=void 0;var Me=i(D());s.TempleException=Me.default;var qe=i(M());s.TempleCollection=qe.default;var Le=i(W());s.TempleDocument=Le.default;var ke=i($());s.TempleRegistry=ke.default;var Ae=i(b());s.TempleElement=Ae.default;var Q=Pe(V());s.emitter=Q.default;Object.defineProperty(s,"TempleEmitter",{enumerable:!0,get:function(){return Q.TempleEmitter}});var Ce=i(C());s.TempleText=Ce.default;var Ie=i(f());s.data=Ie.default;var $e=i(Y());s.env=$e.default;var Ne=i(H());s.props=Ne.default;var Be=i(z());s.classnames=Be.default;var He=i(K());s.signal=He.default});var U=c((rt,Z)=>{Z.exports={...X()}});var Ue={};se(Ue,{default:()=>w});var e=G(U()),g=G(U());var x=function(a,...t){let r=Re(a);for(let l=0;l{document.body.classList.toggle("panel-left-open")};return[e.TempleRegistry.createText(`
-`,!1),e.TempleRegistry.createElement("html",{},[e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("head",{},[e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{charset:"utf-8"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"viewport",content:"width=device-width, initial-scale=1"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("title",{},[...this._toNodeList(r)]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"description",content:l}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:title",content:r}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:description",content:l}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:image",content:"https://ossphilippines.github.io/temple/temple-logo.png"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:url",content:`https://ossphilippines.github.io/temple${t}`}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:type",content:"website"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:card",content:"summary"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:site",content:"@OSSPhilippines"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:title",content:r}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:description",content:l}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:image",content:"https://ossphilippines.github.io/temple/temple-logo.png"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"favicon",href:"/temple/favicon.ico"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"shortcut icon",type:"image/png",href:"/temple/favicon.png"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/fontawesome/all.css"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/theme.css"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:`/temple/build/client/${(0,g.env)("BUILD_ID")}.css`}),e.TempleRegistry.createText(`
+var TempleAPI=(()=>{var X=Object.create;var g=Object.defineProperty;var Z=Object.getOwnPropertyDescriptor;var ee=Object.getOwnPropertyNames;var te=Object.getPrototypeOf,le=Object.prototype.hasOwnProperty;var i=(l,t)=>()=>(t||l((t={exports:{}}).exports,t),t.exports),ae=(l,t)=>{for(var a in t)g(l,a,{get:t[a],enumerable:!0})},H=(l,t,a,s)=>{if(t&&typeof t=="object"||typeof t=="function")for(let n of ee(t))!le.call(l,n)&&n!==a&&g(l,n,{get:()=>t[n],enumerable:!(s=Z(t,n))||s.enumerable});return l};var U=(l,t,a)=>(a=l!=null?X(te(l)):{},H(t||!l||!l.__esModule?g(a,"default",{value:l,enumerable:!0}):a,l)),se=l=>H(g({},"__esModule",{value:!0}),l);var v=i(w=>{"use strict";Object.defineProperty(w,"__esModule",{value:!0});var E=class extends Error{static for(t,...a){return a.forEach(function(s){t=t.replace("%s",s)}),new this(t)}static forErrorsFound(t){let a=new this("Invalid Parameters");return a.errors=t,a}static require(t,a,...s){if(!t){for(let n of s)a=a.replace("%s",n);throw new this(a)}}constructor(t,a=500){super(),this.errors={},this.start=0,this.end=0,this.message=t,this.name=this.constructor.name,this.code=a}withCode(t){return this.code=t,this}withPosition(t,a){return this.start=t,this.end=a,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};w.default=E});var S=i(L=>{"use strict";Object.defineProperty(L,"__esModule",{value:!0});var k=class{get length(){return this._elements.size}constructor(t=[]){this._elements=new Set,t.forEach(a=>this._elements.add(a))}add(t){this._elements.add(t)}toArray(){return Array.from(this._elements)}toString(){return Array.from(this._elements).filter(Boolean).map(t=>t.toString()).join("")}};L.default=k});var p=i(j=>{"use strict";Object.defineProperty(j,"__esModule",{value:!0});var re=new Map;j.default=re});var O=i(N=>{"use strict";Object.defineProperty(N,"__esModule",{value:!0});var D=class{get value(){return this._escape?this._value.replace(/&/g,"&").replace(//g,">"):this._value}constructor(t,a=!1){this._escape=a,this._value=t}toString(){return this.value}};N.default=D});var M=i(m=>{"use strict";var ce=m&&m.__importDefault||function(l){return l&&l.__esModule?l:{default:l}};Object.defineProperty(m,"__esModule",{value:!0});var ne=ce(S()),ie=["area","base","br","col","embed","hr","img","input","link","meta","param","source","track","wbr"],P=class{get attributes(){return this._attributes}get children(){return this._children}get name(){return this._name}get props(){return this._props}constructor(t,a={},s="",n=[]){this._attributes={},this._name=t,this._attributes=a,this._props=s,this._children=new ne.default(n)}toString(){let t=Object.entries(this._attributes),a=t.length>0?" "+t.map(([n,b])=>{if(typeof b=="string")return`${n}="${b}"`;if(typeof b=="boolean")return b?n:""}).join(" "):"";if(ie.includes(this._name))return`<${this._name}${a} />`;let s=this._children.toString();return`<${this._name}${a}>${s}`}};m.default=P});var q=i(f=>{"use strict";var J=f&&f.__importDefault||function(l){return l&&l.__esModule?l:{default:l}};Object.defineProperty(f,"__esModule",{value:!0});var oe=J(O()),R=J(M()),A=class{static render(t){return t.filter(Boolean).map(a=>a.toString()).join("")}static registry(t,a=new Set){return t.forEach(s=>{s instanceof R.default&&(["html","head","body"].includes(s.name)||a.add(s),s.name!=="head"&&s.children.length>0&&this.registry(s.children.toArray(),a))}),a}static createElement(t,a,s,n=[]){return new R.default(t,a,s,n)}static createText(t,a=!0){return new oe.default(t,a)}};f.default=A});var G=i(h=>{"use strict";var B=h&&h.__importDefault||function(l){return l&&l.__esModule?l:{default:l}};Object.defineProperty(h,"__esModule",{value:!0});var pe=B(v()),C=B(p()),I=B(q()),$=class{bindings(){let t=I.default.registry(this.template());return`{ ${Array.from(t.values()).map((s,n)=>s.props!=="{ }"?`'${n}': ${s.props}`:"").filter(s=>s!=="").join(", ")} }`}render(t={}){C.default.set("props",t||{}),C.default.set("env",Object.assign(Object.assign({},process.env||{}),{BUILD_ID:this.id(),APP_DATA:btoa(JSON.stringify(Object.assign(Object.assign({},Object.fromEntries(C.default.entries())),{env:Object.assign(Object.assign({},Object.fromEntries(Object.entries(process.env||{}).filter(n=>n[0].startsWith("PUBLIC_")))),{BUILD_ID:this.id()})})))}));let a=this.template(),s=I.default.render(a).trim();if(!s.toLowerCase().startsWith(" tag.");return`
+${s}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:Array.isArray(t)&&t.every(a=>typeof a=="object"&&typeof a.nodeType=="number")?t:[I.default.createText(String(t))]}};h.default=$});var W=i(x=>{"use strict";Object.defineProperty(x,"__esModule",{value:!0});x.TempleEmitter=void 0;var y=class{emit(t,a){return this}on(t,a){return this}once(t,a){return this}unbind(t,a){return this}};x.TempleEmitter=y;var me=new y;x.default=me});var z=i(u=>{"use strict";var fe=u&&u.__importDefault||function(l){return l&&l.__esModule?l:{default:l}};Object.defineProperty(u,"__esModule",{value:!0});var he=fe(p());function xe(l){let t=he.default.get("env")||{};return l?t[l]||null:t}u.default=xe});var V=i(d=>{"use strict";var ue=d&&d.__importDefault||function(l){return l&&l.__esModule?l:{default:l}};Object.defineProperty(d,"__esModule",{value:!0});d.default=Te;var de=ue(p());function Te(){return de.default.get("props")||{}}});var K=i(r=>{"use strict";var be=r&&r.__createBinding||(Object.create?function(l,t,a,s){s===void 0&&(s=a);var n=Object.getOwnPropertyDescriptor(t,a);(!n||("get"in n?!t.__esModule:n.writable||n.configurable))&&(n={enumerable:!0,get:function(){return t[a]}}),Object.defineProperty(l,s,n)}:function(l,t,a,s){s===void 0&&(s=a),l[s]=t[a]}),ge=r&&r.__setModuleDefault||(Object.create?function(l,t){Object.defineProperty(l,"default",{enumerable:!0,value:t})}:function(l,t){l.default=t}),ye=r&&r.__importStar||function(l){if(l&&l.__esModule)return l;var t={};if(l!=null)for(var a in l)a!=="default"&&Object.prototype.hasOwnProperty.call(l,a)&&be(t,l,a);return ge(t,l),t},o=r&&r.__importDefault||function(l){return l&&l.__esModule?l:{default:l}};Object.defineProperty(r,"__esModule",{value:!0});r.TempleText=r.TempleException=r.TempleEmitter=r.TempleElement=r.TempleRegistry=r.TempleDocument=r.TempleCollection=r.props=r.emitter=r.env=r.data=void 0;var _e=o(v());r.TempleException=_e.default;var Ee=o(S());r.TempleCollection=Ee.default;var we=o(G());r.TempleDocument=we.default;var ve=o(q());r.TempleRegistry=ve.default;var ke=o(M());r.TempleElement=ke.default;var Y=ye(W());r.emitter=Y.default;Object.defineProperty(r,"TempleEmitter",{enumerable:!0,get:function(){return Y.TempleEmitter}});var Le=o(O());r.TempleText=Le.default;var Se=o(p());r.data=Se.default;var je=o(z());r.env=je.default;var De=o(V());r.props=De.default});var F=i((Je,Q)=>{Q.exports={...K()}});var Oe={};ae(Oe,{default:()=>_});var e=U(F()),T=U(F());var c=function(l,...t){let a=Ne(l);for(let s=0;s{document.getElementsByTagName("panel-layout")[0].toggle("left")};return[e.TempleRegistry.createText(`
+`,!1),e.TempleRegistry.createElement("html",{},"{ }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("head",{},"{ }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{charset:"utf-8"},"{ 'charset': `utf-8` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"viewport",content:"width=device-width, initial-scale=1"},"{ 'name': `viewport`, 'content': `width=device-width, initial-scale=1` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("title",{},"{ }",[...this._toNodeList(a)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"description",content:s},"{ 'name': `description`, 'content': description }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:title",content:a},"{ 'property': `og:title`, 'content': title }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:description",content:s},"{ 'property': `og:description`, 'content': description }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:image",content:"https://ossphilippines.github.io/temple/temple-logo.png"},"{ 'property': `og:image`, 'content': `https://ossphilippines.github.io/temple/temple-logo.png` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:url",content:`https://ossphilippines.github.io/temple${t}`},"{ 'property': `og:url`, 'content': `https://ossphilippines.github.io/temple${url}` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:type",content:"website"},"{ 'property': `og:type`, 'content': `website` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:card",content:"summary"},"{ 'name': `twitter:card`, 'content': `summary` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:site",content:"@OSSPhilippines"},"{ 'name': `twitter:site`, 'content': `@OSSPhilippines` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:title",content:a},"{ 'name': `twitter:title`, 'content': title }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:description",content:s},"{ 'name': `twitter:description`, 'content': description }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:image",content:"https://ossphilippines.github.io/temple/temple-logo.png"},"{ 'name': `twitter:image`, 'content': `https://ossphilippines.github.io/temple/temple-logo.png` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"favicon",href:"/temple/favicon.ico"},"{ 'rel': `favicon`, 'href': `/temple/favicon.ico` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"shortcut icon",type:"image/png",href:"/temple/favicon.png"},"{ 'rel': `shortcut icon`, 'type': `image/png`, 'href': `/temple/favicon.png` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/fontawesome/all.css"},"{ 'rel': `stylesheet`, 'type': `text/css`, 'href': `/temple/styles/fontawesome/all.css` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/global.css"},"{ 'rel': `stylesheet`, 'type': `text/css`, 'href': `/temple/styles/global.css` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:`/temple/build/client/${(0,T.env)("BUILD_ID")}.css`},"{ 'rel': `stylesheet`, 'type': `text/css`, 'href': `/temple/build/client/${env('BUILD_ID')}.css` }"),e.TempleRegistry.createText(`
   
-  `,!1),e.TempleRegistry.createElement("script",{"data-app":(0,g.env)("APP_DATA"),src:`/temple/build/client/${(0,g.env)("BUILD_ID")}.js`}),e.TempleRegistry.createText(`
-  `,!1),...(0,g.env)("NODE_ENV")==="development"?[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("script",{src:"/dev.js"}),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("script",{"data-app":(0,T.env)("APP_DATA"),src:`/temple/build/client/${(0,T.env)("BUILD_ID")}.js`},"{ 'data-app': env('APP_DATA'), 'src': `/temple/build/client/${env('BUILD_ID')}.js` }"),e.TempleRegistry.createText(`
+  `,!1),...(0,T.env)("NODE_ENV")==="development"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("script",{src:"/dev.js"},"{ 'src': `/dev.js` }"),e.TempleRegistry.createText(`
   `,!1)]:[],e.TempleRegistry.createText(`
 `,!1)]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("body",{class:"dark panel with-head with-left"},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("header",{class:"head panel-head"},[e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("i",{class:"menu fas fa-fw fa-bars",click:n},[]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("a",{href:"/temple"},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("img",{src:"/temple/temple-icon.png",alt:"Temple Logo"}),e.TempleRegistry.createText(`
-  `,!1)]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("h3",{},[e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple"},[e.TempleRegistry.createText("Temple",!1)])]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("nav",{},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple/docs/index.html"},[e.TempleRegistry.createText("Docs",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{class:"github",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-github"},[]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("body",{class:"dark bg-t-0 tx-t1 arial"},"{ 'class': `dark bg-t-0 tx-t1 arial` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("panel-layout",{},"{ }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("panel-head",{},"{ }",[e.TempleRegistry.createElement("menu",{class:"flex flex-center-y px-20 py-15 m-0 bg-t-1"},"{ 'class': `flex flex-center-y px-20 py-15 m-0 bg-t-1` }",[e.TempleRegistry.createText(`
+  `,!1),...t!=="/temple/index.html"&&t!=="/temple/500.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-bars cursor-pointer py-5 pr-10 none md-inline-block tx-t-1",click:n},"{ 'class': `fas fa-fw fa-bars cursor-pointer py-5 pr-10 none md-inline-block tx-t-1`, 'click': toggle }",[]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("div",{class:"flex-grow"},"{ 'class': `flex-grow` }",[]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{href:"/temple"},"{ 'href': `/temple` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("img",{alt:"Temple Logo",class:"h-26 mr-10",src:"/temple/temple-icon.png"},"{ 'alt': `Temple Logo`, 'class': `h-26 mr-10`, 'src': `/temple/temple-icon.png` }"),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("h3",{class:"flex-grow tx-uppercase"},"{ 'class': `flex-grow tx-uppercase` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple"},"{ 'class': `tx-white`, 'href': `/temple` }",[e.TempleRegistry.createText("Temple",!1)]),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{class:"npm",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-npm text-white"},[]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("nav",{class:"flex flex-center-y"},"{ 'class': `flex flex-center-y` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple/docs/index.html"},"{ 'class': `tx-white`, 'href': `/temple/docs/index.html` }",[e.TempleRegistry.createText("Docs",!1)]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"tx-t-1 tx-5xl ml-10",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},"{ 'class': `tx-t-1 tx-5xl ml-10`, 'href': `https://github.com/OSSPhilippines/temple`, 'target': `_blank` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-github"},"{ 'class': `fab fa-github` }",[]),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{class:"discord",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-discord text-white"},[]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"bg-h-cb3837 pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},"{ 'class': `bg-h-cb3837 pill tx-t-1 tx-lg ml-5 p-5 tx-center`, 'href': `https://www.npmjs.com/package/@ossph/temple`, 'target': `_blank` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-npm text-white"},"{ 'class': `fab fa-npm text-white` }",[]),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"bg-h-7289da pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},"{ 'class': `bg-h-7289da pill tx-t-1 tx-lg ml-5 p-5 tx-center`, 'href': `https://discord.gg/open-source-software-ph-905496362982981723`, 'target': `_blank` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-discord text-white"},"{ 'class': `fab fa-discord text-white` }",[]),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]),e.TempleRegistry.createText(`
+`,!1)])]),e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("panel-left",{},"{ }",[e.TempleRegistry.createElement("header",{class:"flex flex-center-y bg-t-2 py-15 pr-5 pl-10"},"{ 'class': `flex flex-center-y bg-t-2 py-15 pr-5 pl-10` }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("a",{href:"/temple"},"{ 'href': `/temple` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("img",{class:"h-26 mr-10",src:"/temple/temple-icon.png",alt:"Temple Logo"},"{ 'class': `h-26 mr-10`, 'src': `/temple/temple-icon.png`, 'alt': `Temple Logo` }"),e.TempleRegistry.createText(`
   `,!1)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("h3",{class:"flex-grow m-0 tx-uppercase"},"{ 'class': `flex-grow m-0 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple"},"{ 'class': `tx-white`, 'href': `/temple` }",[e.TempleRegistry.createText("Temple",!1)]),e.TempleRegistry.createText(`
+  `,!1)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-left cursor-pointer none md-inline-block",click:n},"{ 'class': `fas fa-fw fa-chevron-left cursor-pointer none md-inline-block`, 'click': toggle }",[]),e.TempleRegistry.createText(`
 `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("aside",{class:"left panel-left"},[e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("header",{},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("img",{src:"/temple/temple-icon.png",alt:"Temple Logo"}),e.TempleRegistry.createText(`
-    `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("h3",{},[e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple"},[e.TempleRegistry.createText("Temple",!1)])]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("i",{class:"toggle fas fa-fw fa-chevron-left",click:n},[]),e.TempleRegistry.createText(`
+`,!1),e.TempleRegistry.createElement("nav",{class:"bg-t-1 scroll-auto h-calc-full-60"},"{ 'class': `bg-t-1 scroll-auto h-calc-full-60` }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("h6",{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-0 pt-20 pb-10 pl-10 tx-uppercase"},"{ 'class': `bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-0 pt-20 pb-10 pl-10 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),...this._toNodeList(c("Introduction")),e.TempleRegistry.createText(`
   `,!1)]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("nav",{},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("h6",{},[e.TempleRegistry.createText("Introduction",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/index.html"},[e.TempleRegistry.createText("Documentation",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/getting-started.html"},[e.TempleRegistry.createText("Getting Started",!1)]),e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/index.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/index.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/index.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("Documentation")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/index.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/index.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("Documentation")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/getting-started.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/getting-started.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/getting-started.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("Getting Started")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/getting-started.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/getting-started.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("Getting Started")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
 
-    `,!1),e.TempleRegistry.createElement("h6",{},[e.TempleRegistry.createText("Features",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/markup-syntax.html"},[e.TempleRegistry.createText("Markup Syntax",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/state-management.html"},[e.TempleRegistry.createText("State Management",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/component-strategy.html"},[e.TempleRegistry.createText("Component Strategy",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/compiler-api.html"},[e.TempleRegistry.createText("Compiler API",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/client-api.html"},[e.TempleRegistry.createText("Client API",!1)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("h6",{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},"{ 'class': `bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),...this._toNodeList(c("Features")),e.TempleRegistry.createText(`
+  `,!1)]),e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/markup-syntax.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/markup-syntax.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/markup-syntax.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("Markup Syntax")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/markup-syntax.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/markup-syntax.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("Markup Syntax")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/state-management.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/state-management.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/state-management.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("State Management")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/state-management.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/state-management.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("State Management")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/component-strategy.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/component-strategy.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/component-strategy.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("Component Strategy")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-strategy.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/component-strategy.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("Component Strategy")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/compiler-api.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/compiler-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/compiler-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("Compiler API")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/compiler-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/compiler-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("Compiler API")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/client-api.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/client-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/client-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("Client API")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/client-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/client-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("Client API")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
 
-    `,!1),e.TempleRegistry.createElement("h6",{},[e.TempleRegistry.createText("Usage",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/template-engine.html"},[e.TempleRegistry.createText("Template Engine",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/single-page.html"},[e.TempleRegistry.createText("Single Page App",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/static-site.html"},[e.TempleRegistry.createText("Static Site Generator",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/component-publisher.html"},[e.TempleRegistry.createText("Component Publisher",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/developer-tools.html"},[e.TempleRegistry.createText("Developer Tools",!1)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("h6",{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},"{ 'class': `bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),...this._toNodeList(c("Usage")),e.TempleRegistry.createText(`
   `,!1)]),e.TempleRegistry.createText(`
-`,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("panel-main",{class:"panel-main"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("div",{class:"docs container"},[e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("h1",{},[...this._toNodeList(x("Documentation"))]),e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/template-engine.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/template-engine.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/template-engine.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("Template Engine")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/template-engine.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/template-engine.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("Template Engine")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/single-page.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/single-page.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/single-page.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("Single Page App")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/single-page.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/single-page.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("Single Page App")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/static-site.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/static-site.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/static-site.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("Static Site Generator")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/static-site.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/static-site.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("Static Site Generator")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/component-publisher.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/component-publisher.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/component-publisher.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("Component Publisher")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-publisher.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/component-publisher.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("Component Publisher")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/developer-tools.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold mb-100",href:"/temple/docs/developer-tools.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold mb-100`, 'href': `/temple/docs/developer-tools.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("Developer Tools")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 mb-100",href:"/temple/docs/developer-tools.html"},"{ 'class': `block tx-t-1 py-10 pl-10 mb-100`, 'href': `/temple/docs/developer-tools.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(c("Developer Tools")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+`,!1)])]),e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("panel-main",{},"{ }",[e.TempleRegistry.createText(`
+        `,!1),e.TempleRegistry.createElement("api-docs",{},"{ }",[e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("h1",{class:"tx-primary tx-uppercase tx-30 py-20"},"{ 'class': `tx-primary tx-uppercase tx-30 py-20` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(c("Documentation")),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Temple is a template engine with a built-in compiler that 
-          generates HTML markup, web components and support reactivity. 
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Like React and Svelte, Temple is a modern approach to building
-          front-end code addressing state management and reactivity. 
-          Unlike React and Svelte that focus on keeping the developer 
-          experience mostly on the front-end, Temple focuses on being 
-          a modern templating solution for server side frameworks.
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Temple can be used as a template engine on the server side, 
-          as a site generator to make static websites and single page 
-          applications, or can be used to publish native HTML5 web 
-          components.
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Temple sticks closely to the classic web development model of 
-          HTML, CSS, and JS, just adding a few extensions to HTML and 
-          JavaScript. It arguably has fewer concepts and tools to learn 
-          than some of the other framework options.
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("ide-app",{title:"Basic Example"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("div",{class:"split-view"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("ide-code",{numbers:!0,trim:!0,detab:14},[...this._toNodeList(`
-              
-              
-              
    Hello {name}!
    
-            `)]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("ide-preview",{},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("div",{},[e.TempleRegistry.createText(`
-                `,!1),e.TempleRegistry.createElement("h1",{},[e.TempleRegistry.createText("Hello world!",!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            Temple is a template engine with a built-in compiler that 
+            generates HTML markup, web components and support reactivity. 
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            Like React and Svelte, Temple is a modern approach to building
+            front-end code addressing state management and reactivity. 
+            Unlike React and Svelte that focus on keeping the developer 
+            experience mostly on the front-end, Temple focuses on being 
+            a modern templating solution for server side frameworks.
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            Temple can be used as a template engine on the server side, 
+            as a site generator to make static websites and single page 
+            applications, or can be used to publish native HTML5 web 
+            components.
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            Temple sticks closely to the classic web development model of 
+            HTML, CSS, and JS, just adding a few extensions to HTML and 
+            JavaScript. It arguably has fewer concepts and tools to learn 
+            than some of the other framework options.
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("ide-app",{title:"Basic Example",class:"py-20"},"{ 'title': `Basic Example`, 'class': `py-20` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("div",{class:"flex bg-h-EFEFEF h-full lg-block"},"{ 'class': `flex bg-h-EFEFEF h-full lg-block` }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("ide-code",{class:"basis-half",numbers:!0,trim:!0,detab:16},"{ 'class': `basis-half`, 'numbers': true, 'trim': true, 'detab': 16 }",[...this._toNodeList(`
+                
+                
+                
    Hello {name}!
    
+              `)]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("ide-preview",{class:"bg-white basis-half h-140 lg-h-auto"},"{ 'class': `bg-white basis-half h-140 lg-h-auto` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("div",{},"{ }",[e.TempleRegistry.createText(`
+                  `,!1),e.TempleRegistry.createElement("h1",{},"{ }",[e.TempleRegistry.createText("Hello world!",!1)]),e.TempleRegistry.createText(`
+                `,!1)]),e.TempleRegistry.createText(`
               `,!1)]),e.TempleRegistry.createText(`
             `,!1)]),e.TempleRegistry.createText(`
           `,!1)]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          At it's core, a temple file is a special template file that 
-          allows HTML, JavaScript, CSS and importing of components and 
-          templates. All of which are transpiled to TypeScript or 
-          JavaScript source code.
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("ide-app",{title:"Transpiler Example"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("div",{class:"split-view"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("ide-code",{numbers:!0,ltrim:!0,detab:14},[...this._toNodeList(`
-              
-              
-              
    Hello {name}!!
    
-              
-              
-
-            `)]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("ide-code",{class:"div",lang:"js",trim:!0,detab:14},[...this._toNodeList(`
-              import { props } from '@ossph/temple';
-              export default class Hello extends TempleComponent {
-                styles() {
-                  return 'h1 { font-weight: bold; }';
-                }
-                template() {
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            At it's core, a temple file is a special template file that 
+            allows HTML, JavaScript, CSS and importing of components and 
+            templates. All of which are transpiled to TypeScript or 
+            JavaScript source code.
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("ide-app",{title:"Transpiler Example",class:"py-20"},"{ 'title': `Transpiler Example`, 'class': `py-20` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("div",{class:"flex bg-h-EFEFEF h-full lg-block"},"{ 'class': `flex bg-h-EFEFEF h-full lg-block` }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("ide-code",{class:"basis-half scroll-auto",scroll:!0,numbers:!0,ltrim:!0,detab:16},"{ 'class': `basis-half scroll-auto`, 'scroll': true, 'numbers': true, 'ltrim': true, 'detab': 16 }",[...this._toNodeList(`
+                
+                
+                
    Hello {name}!!
    
+                
+                
+
+              `)]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("ide-code",{class:"basis-half h-full bd-t-1 bd-solid bdy-0 bdl-1 bdr-0 lg-bd-0 lg-h-auto scroll-auto",lang:"js",trim:!0,scroll:!0,detab:16},"{ 'class': `basis-half h-full bd-t-1 bd-solid bdy-0 bdl-1 bdr-0 lg-bd-0 lg-h-auto scroll-auto`, 'lang': `js`, 'trim': true, 'scroll': true, 'detab': 16 }",[...this._toNodeList(`
+                import { props } from '@ossph/temple';
+                export default class Hello extends TempleComponent {
+                  styles() {
+                    return 'h1 { font-weight: bold; }';
+                  }
+                  template() {
+                    const { name } = props();
+                    return () => [
+                      TempleRegistry.createElement('h1', null, \`Hello \${name}\`)
+                    ]
+                  }
                 }
-              }
-            `)]),e.TempleRegistry.createText(`
+              `)]),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
           `,!1)]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
-        
-        `,!1),e.TempleRegistry.createElement("nav",{class:"pager"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("a",{class:"next",href:"/temple/docs/getting-started.html"},[e.TempleRegistry.createText(`
-            `,!1),...this._toNodeList(x("Getting Started")),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-right"},[]),e.TempleRegistry.createText(`
+
+          `,!1),e.TempleRegistry.createElement("nav",{class:"flex"},"{ 'class': `flex` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"flex-grow tx-right tx-primary py-40",href:"/temple/docs/getting-started.html"},"{ 'class': `flex-grow tx-right tx-primary py-40`, 'href': `/temple/docs/getting-started.html` }",[e.TempleRegistry.createText(`
+              `,!1),...this._toNodeList(c("Getting Started")),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-right tx-t-1"},"{ 'class': `fas fa-fw fa-chevron-right tx-t-1` }",[]),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
           `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("footer",{class:"foot"},"{ 'class': `foot` }",[]),e.TempleRegistry.createText(`
         `,!1)]),e.TempleRegistry.createText(`
       `,!1)]),e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("footer",{class:"foot"},[]),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
   `,!1)]),e.TempleRegistry.createText(`
-`,!1)])]}};return ne(Ue);})();
+`,!1)])]}};return se(Oe);})();
diff --git a/docs/build/server/57e37fa233b38c87fe71.js b/docs/build/server/57e37fa233b38c87fe71.js
index 46e0f3c..a762bba 100644
--- a/docs/build/server/57e37fa233b38c87fe71.js
+++ b/docs/build/server/57e37fa233b38c87fe71.js
@@ -1,617 +1,771 @@
-var TempleAPI=(()=>{var ee=Object.create;var _=Object.defineProperty;var te=Object.getOwnPropertyDescriptor;var ae=Object.getOwnPropertyNames;var re=Object.getPrototypeOf,se=Object.prototype.hasOwnProperty;var c=(a,t)=>()=>(t||a((t={exports:{}}).exports,t),t.exports),le=(a,t)=>{for(var r in t)_(a,r,{get:t[r],enumerable:!0})},W=(a,t,r,s)=>{if(t&&typeof t=="object"||typeof t=="function")for(let n of ae(t))!se.call(a,n)&&n!==r&&_(a,n,{get:()=>t[n],enumerable:!(s=te(t,n))||s.enumerable});return a};var H=(a,t,r)=>(r=a!=null?ee(re(a)):{},W(t||!a||!a.__esModule?_(r,"default",{value:a,enumerable:!0}):r,a)),ie=a=>W(_({},"__esModule",{value:!0}),a);var k=c(N=>{"use strict";Object.defineProperty(N,"__esModule",{value:!0});var w=class extends Error{static for(t,...r){return r.forEach(function(s){t=t.replace("%s",s)}),new this(t)}static forErrorsFound(t){let r=new this("Invalid Parameters");return r.errors=t,r}static require(t,r,...s){if(!t){for(let n of s)r=r.replace("%s",n);throw new this(r)}}constructor(t,r=500){super(),this.errors={},this.start=0,this.end=0,this.message=t,this.name=this.constructor.name,this.code=r}withCode(t){return this.code=t,this}withPosition(t,r){return this.start=t,this.end=r,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};N.default=w});var O=c(S=>{"use strict";Object.defineProperty(S,"__esModule",{value:!0});var j=class{constructor(t=[]){this._elements=new Set,t.forEach(r=>this._elements.add(r))}add(t){this._elements.add(t)}toArray(){return Array.from(this._elements)}toString(){return Array.from(this._elements).filter(Boolean).map(t=>t.toString()).join("")}};S.default=j});var m=c(C=>{"use strict";Object.defineProperty(C,"__esModule",{value:!0});var ne=new Map;C.default=ne});var g=c(f=>{"use strict";var ce=f&&f.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(f,"__esModule",{value:!0});var oe=ce(O()),ue=["area","base","br","col","embed","hr","img","input","link","meta","param","source","track","wbr"],M=class{static render(t){return t.filter(Boolean).map(r=>r.toString()).join("")}get name(){return this._name}get attributes(){return this._attributes}get children(){return this._children}constructor(t,r={},s=[]){this._attributes={},this._name=t,this._attributes=r,this._children=new oe.default(s)}toString(){let t=Object.entries(this._attributes),r=t.length>0?" "+t.map(([n,u])=>{if(typeof u=="string")return`${n}="${u}"`;if(typeof u=="boolean")return u?n:""}).join(" "):"";if(ue.includes(this._name))return`<${this._name}${r} />`;let s=this._children.toString();return`<${this._name}${r}>${s}`}};f.default=M});var I=c(P=>{"use strict";Object.defineProperty(P,"__esModule",{value:!0});var D=class{get value(){return this._escape?this._value.replace(/&/g,"&").replace(//g,">"):this._value}constructor(t,r=!1){this._escape=r,this._value=t}toString(){return this.value}};P.default=D});var A=c(d=>{"use strict";var J=d&&d.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(d,"__esModule",{value:!0});var me=J(I()),fe=J(g()),q=class{static createElement(t,r,s=[]){return new fe.default(t,r,s)}static createText(t,r=!0){return new me.default(t,r)}};d.default=q});var R=c(h=>{"use strict";var y=h&&h.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(h,"__esModule",{value:!0});var de=y(k()),$=y(m()),he=y(g()),pe=y(A()),B=class{render(t={}){$.default.set("props",t||{}),$.default.set("env",Object.assign(Object.assign({},process.env||{}),{BUILD_ID:this.id(),APP_DATA:btoa(JSON.stringify(Object.assign(Object.assign({},Object.fromEntries($.default.entries())),{env:Object.assign(Object.assign({},Object.fromEntries(Object.entries(process.env||{}).filter(n=>n[0].startsWith("PUBLIC_")))),{BUILD_ID:this.id()})})))}));let r=this.template(),s=he.default.render(r).trim();if(!s.toLowerCase().startsWith(" tag.");return`
-${s}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:Array.isArray(t)&&t.every(r=>typeof r=="object"&&typeof r.nodeType=="number")?t:[pe.default.createText(String(t))]}};h.default=B});var V=c(p=>{"use strict";Object.defineProperty(p,"__esModule",{value:!0});p.TempleEmitter=void 0;var v=class{emit(t,r){return this}on(t,r){return this}once(t,r){return this}unbind(t,r){return this}};p.TempleEmitter=v;var Te=new v;p.default=Te});var z=c(T=>{"use strict";var xe=T&&T.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(T,"__esModule",{value:!0});var Ee=xe(m());function be(a){let t=Ee.default.get("env")||{};return a?t[a]||null:t}T.default=be});var F=c(x=>{"use strict";var _e=x&&x.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(x,"__esModule",{value:!0});x.default=ye;var ge=_e(m());function ye(){return ge.default.get("props")||{}}});var G=c(E=>{"use strict";var ve=E&&E.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(E,"__esModule",{value:!0});E.default=we;var Le=ve(F());function we(){return(0,Le.default)().class}});var K=c(U=>{"use strict";Object.defineProperty(U,"__esModule",{value:!0});U.default=Ne;function Ne(a){let t={getter:()=>r.raw,setter:s=>s},r={raw:a,getter(s){return t.getter=s,r},setter(s){return t.setter=s,r}};return Object.defineProperty(r,"value",{get(){return t.getter()},set(s){r.raw=t.setter(s)}}),r}});var X=c(l=>{"use strict";var ke=l&&l.__createBinding||(Object.create?function(a,t,r,s){s===void 0&&(s=r);var n=Object.getOwnPropertyDescriptor(t,r);(!n||("get"in n?!t.__esModule:n.writable||n.configurable))&&(n={enumerable:!0,get:function(){return t[r]}}),Object.defineProperty(a,s,n)}:function(a,t,r,s){s===void 0&&(s=r),a[s]=t[r]}),je=l&&l.__setModuleDefault||(Object.create?function(a,t){Object.defineProperty(a,"default",{enumerable:!0,value:t})}:function(a,t){a.default=t}),Se=l&&l.__importStar||function(a){if(a&&a.__esModule)return a;var t={};if(a!=null)for(var r in a)r!=="default"&&Object.prototype.hasOwnProperty.call(a,r)&&ke(t,a,r);return je(t,a),t},o=l&&l.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(l,"__esModule",{value:!0});l.TempleText=l.TempleException=l.TempleEmitter=l.TempleElement=l.TempleRegistry=l.TempleDocument=l.TempleCollection=l.signal=l.classnames=l.props=l.emitter=l.env=l.data=void 0;var Oe=o(k());l.TempleException=Oe.default;var Ce=o(O());l.TempleCollection=Ce.default;var Me=o(R());l.TempleDocument=Me.default;var De=o(A());l.TempleRegistry=De.default;var Pe=o(g());l.TempleElement=Pe.default;var Q=Se(V());l.emitter=Q.default;Object.defineProperty(l,"TempleEmitter",{enumerable:!0,get:function(){return Q.TempleEmitter}});var Ie=o(I());l.TempleText=Ie.default;var qe=o(m());l.data=qe.default;var Ae=o(z());l.env=Ae.default;var $e=o(F());l.props=$e.default;var Be=o(G());l.classnames=Be.default;var Fe=o(K());l.signal=Fe.default});var Y=c((rt,Z)=>{Z.exports={...X()}});var Ye={};le(Ye,{default:()=>L});var e=H(Y()),b=H(Y());var i=function(a,...t){let r=Ue(a);for(let s=0;s{document.body.classList.toggle("panel-left-open")};return[e.TempleRegistry.createText(`
-`,!1),e.TempleRegistry.createElement("html",{},[e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("head",{},[e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{charset:"utf-8"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"viewport",content:"width=device-width, initial-scale=1"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("title",{},[...this._toNodeList(r)]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"description",content:s}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:title",content:r}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:description",content:s}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:image",content:"https://ossphilippines.github.io/temple/temple-logo.png"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:url",content:`https://ossphilippines.github.io/temple${t}`}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:type",content:"website"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:card",content:"summary"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:site",content:"@OSSPhilippines"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:title",content:r}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:description",content:s}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:image",content:"https://ossphilippines.github.io/temple/temple-logo.png"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"favicon",href:"/temple/favicon.ico"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"shortcut icon",type:"image/png",href:"/temple/favicon.png"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/fontawesome/all.css"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/theme.css"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:`/temple/build/client/${(0,b.env)("BUILD_ID")}.css`}),e.TempleRegistry.createText(`
+var TempleAPI=(()=>{var X=Object.create;var y=Object.defineProperty;var Z=Object.getOwnPropertyDescriptor;var ee=Object.getOwnPropertyNames;var te=Object.getPrototypeOf,ae=Object.prototype.hasOwnProperty;var n=(a,t)=>()=>(t||a((t={exports:{}}).exports,t),t.exports),re=(a,t)=>{for(var r in t)y(a,r,{get:t[r],enumerable:!0})},F=(a,t,r,s)=>{if(t&&typeof t=="object"||typeof t=="function")for(let i of ee(t))!ae.call(a,i)&&i!==r&&y(a,i,{get:()=>t[i],enumerable:!(s=Z(t,i))||s.enumerable});return a};var W=(a,t,r)=>(r=a!=null?X(te(a)):{},F(t||!a||!a.__esModule?y(r,"default",{value:a,enumerable:!0}):r,a)),le=a=>F(y({},"__esModule",{value:!0}),a);var v=n(k=>{"use strict";Object.defineProperty(k,"__esModule",{value:!0});var _=class extends Error{static for(t,...r){return r.forEach(function(s){t=t.replace("%s",s)}),new this(t)}static forErrorsFound(t){let r=new this("Invalid Parameters");return r.errors=t,r}static require(t,r,...s){if(!t){for(let i of s)r=r.replace("%s",i);throw new this(r)}}constructor(t,r=500){super(),this.errors={},this.start=0,this.end=0,this.message=t,this.name=this.constructor.name,this.code=r}withCode(t){return this.code=t,this}withPosition(t,r){return this.start=t,this.end=r,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};k.default=_});var N=n(w=>{"use strict";Object.defineProperty(w,"__esModule",{value:!0});var L=class{get length(){return this._elements.size}constructor(t=[]){this._elements=new Set,t.forEach(r=>this._elements.add(r))}add(t){this._elements.add(t)}toArray(){return Array.from(this._elements)}toString(){return Array.from(this._elements).filter(Boolean).map(t=>t.toString()).join("")}};w.default=L});var m=n(S=>{"use strict";Object.defineProperty(S,"__esModule",{value:!0});var se=new Map;S.default=se});var D=n(C=>{"use strict";Object.defineProperty(C,"__esModule",{value:!0});var j=class{get value(){return this._escape?this._value.replace(/&/g,"&").replace(//g,">"):this._value}constructor(t,r=!1){this._escape=r,this._value=t}toString(){return this.value}};C.default=j});var M=n(p=>{"use strict";var ce=p&&p.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(p,"__esModule",{value:!0});var ie=ce(N()),ne=["area","base","br","col","embed","hr","img","input","link","meta","param","source","track","wbr"],O=class{get attributes(){return this._attributes}get children(){return this._children}get name(){return this._name}get props(){return this._props}constructor(t,r={},s="",i=[]){this._attributes={},this._name=t,this._attributes=r,this._props=s,this._children=new ie.default(i)}toString(){let t=Object.entries(this._attributes),r=t.length>0?" "+t.map(([i,b])=>{if(typeof b=="string")return`${i}="${b}"`;if(typeof b=="boolean")return b?i:""}).join(" "):"";if(ne.includes(this._name))return`<${this._name}${r} />`;let s=this._children.toString();return`<${this._name}${r}>${s}`}};p.default=O});var P=n(u=>{"use strict";var H=u&&u.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(u,"__esModule",{value:!0});var oe=H(D()),Y=H(M()),I=class{static render(t){return t.filter(Boolean).map(r=>r.toString()).join("")}static registry(t,r=new Set){return t.forEach(s=>{s instanceof Y.default&&(["html","head","body"].includes(s.name)||r.add(s),s.name!=="head"&&s.children.length>0&&this.registry(s.children.toArray(),r))}),r}static createElement(t,r,s,i=[]){return new Y.default(t,r,s,i)}static createText(t,r=!0){return new oe.default(t,r)}};u.default=I});var J=n(f=>{"use strict";var U=f&&f.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(f,"__esModule",{value:!0});var me=U(v()),A=U(m()),q=U(P()),$=class{bindings(){let t=q.default.registry(this.template());return`{ ${Array.from(t.values()).map((s,i)=>s.props!=="{ }"?`'${i}': ${s.props}`:"").filter(s=>s!=="").join(", ")} }`}render(t={}){A.default.set("props",t||{}),A.default.set("env",Object.assign(Object.assign({},process.env||{}),{BUILD_ID:this.id(),APP_DATA:btoa(JSON.stringify(Object.assign(Object.assign({},Object.fromEntries(A.default.entries())),{env:Object.assign(Object.assign({},Object.fromEntries(Object.entries(process.env||{}).filter(i=>i[0].startsWith("PUBLIC_")))),{BUILD_ID:this.id()})})))}));let r=this.template(),s=q.default.render(r).trim();if(!s.toLowerCase().startsWith(" tag.");return`
+${s}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:Array.isArray(t)&&t.every(r=>typeof r=="object"&&typeof r.nodeType=="number")?t:[q.default.createText(String(t))]}};f.default=$});var z=n(x=>{"use strict";Object.defineProperty(x,"__esModule",{value:!0});x.TempleEmitter=void 0;var g=class{emit(t,r){return this}on(t,r){return this}once(t,r){return this}unbind(t,r){return this}};x.TempleEmitter=g;var pe=new g;x.default=pe});var G=n(d=>{"use strict";var ue=d&&d.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(d,"__esModule",{value:!0});var fe=ue(m());function xe(a){let t=fe.default.get("env")||{};return a?t[a]||null:t}d.default=xe});var R=n(h=>{"use strict";var de=h&&h.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(h,"__esModule",{value:!0});h.default=Te;var he=de(m());function Te(){return he.default.get("props")||{}}});var K=n(c=>{"use strict";var be=c&&c.__createBinding||(Object.create?function(a,t,r,s){s===void 0&&(s=r);var i=Object.getOwnPropertyDescriptor(t,r);(!i||("get"in i?!t.__esModule:i.writable||i.configurable))&&(i={enumerable:!0,get:function(){return t[r]}}),Object.defineProperty(a,s,i)}:function(a,t,r,s){s===void 0&&(s=r),a[s]=t[r]}),ye=c&&c.__setModuleDefault||(Object.create?function(a,t){Object.defineProperty(a,"default",{enumerable:!0,value:t})}:function(a,t){a.default=t}),ge=c&&c.__importStar||function(a){if(a&&a.__esModule)return a;var t={};if(a!=null)for(var r in a)r!=="default"&&Object.prototype.hasOwnProperty.call(a,r)&&be(t,a,r);return ye(t,a),t},o=c&&c.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(c,"__esModule",{value:!0});c.TempleText=c.TempleException=c.TempleEmitter=c.TempleElement=c.TempleRegistry=c.TempleDocument=c.TempleCollection=c.props=c.emitter=c.env=c.data=void 0;var Ee=o(v());c.TempleException=Ee.default;var _e=o(N());c.TempleCollection=_e.default;var ke=o(J());c.TempleDocument=ke.default;var ve=o(P());c.TempleRegistry=ve.default;var Le=o(M());c.TempleElement=Le.default;var V=ge(z());c.emitter=V.default;Object.defineProperty(c,"TempleEmitter",{enumerable:!0,get:function(){return V.TempleEmitter}});var we=o(D());c.TempleText=we.default;var Ne=o(m());c.data=Ne.default;var Se=o(G());c.env=Se.default;var je=o(R());c.props=je.default});var B=n((He,Q)=>{Q.exports={...K()}});var De={};re(De,{default:()=>E});var e=W(B()),T=W(B());var l=function(a,...t){let r=Ce(a);for(let s=0;s{document.getElementsByTagName("panel-layout")[0].toggle("left")};return[e.TempleRegistry.createText(`
+`,!1),e.TempleRegistry.createElement("html",{},"{ }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("head",{},"{ }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{charset:"utf-8"},"{ 'charset': `utf-8` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"viewport",content:"width=device-width, initial-scale=1"},"{ 'name': `viewport`, 'content': `width=device-width, initial-scale=1` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("title",{},"{ }",[...this._toNodeList(r)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"description",content:s},"{ 'name': `description`, 'content': description }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:title",content:r},"{ 'property': `og:title`, 'content': title }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:description",content:s},"{ 'property': `og:description`, 'content': description }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:image",content:"https://ossphilippines.github.io/temple/temple-logo.png"},"{ 'property': `og:image`, 'content': `https://ossphilippines.github.io/temple/temple-logo.png` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:url",content:`https://ossphilippines.github.io/temple${t}`},"{ 'property': `og:url`, 'content': `https://ossphilippines.github.io/temple${url}` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:type",content:"website"},"{ 'property': `og:type`, 'content': `website` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:card",content:"summary"},"{ 'name': `twitter:card`, 'content': `summary` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:site",content:"@OSSPhilippines"},"{ 'name': `twitter:site`, 'content': `@OSSPhilippines` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:title",content:r},"{ 'name': `twitter:title`, 'content': title }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:description",content:s},"{ 'name': `twitter:description`, 'content': description }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:image",content:"https://ossphilippines.github.io/temple/temple-logo.png"},"{ 'name': `twitter:image`, 'content': `https://ossphilippines.github.io/temple/temple-logo.png` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"favicon",href:"/temple/favicon.ico"},"{ 'rel': `favicon`, 'href': `/temple/favicon.ico` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"shortcut icon",type:"image/png",href:"/temple/favicon.png"},"{ 'rel': `shortcut icon`, 'type': `image/png`, 'href': `/temple/favicon.png` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/fontawesome/all.css"},"{ 'rel': `stylesheet`, 'type': `text/css`, 'href': `/temple/styles/fontawesome/all.css` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/global.css"},"{ 'rel': `stylesheet`, 'type': `text/css`, 'href': `/temple/styles/global.css` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:`/temple/build/client/${(0,T.env)("BUILD_ID")}.css`},"{ 'rel': `stylesheet`, 'type': `text/css`, 'href': `/temple/build/client/${env('BUILD_ID')}.css` }"),e.TempleRegistry.createText(`
   
-  `,!1),e.TempleRegistry.createElement("script",{"data-app":(0,b.env)("APP_DATA"),src:`/temple/build/client/${(0,b.env)("BUILD_ID")}.js`}),e.TempleRegistry.createText(`
-  `,!1),...(0,b.env)("NODE_ENV")==="development"?[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("script",{src:"/dev.js"}),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("script",{"data-app":(0,T.env)("APP_DATA"),src:`/temple/build/client/${(0,T.env)("BUILD_ID")}.js`},"{ 'data-app': env('APP_DATA'), 'src': `/temple/build/client/${env('BUILD_ID')}.js` }"),e.TempleRegistry.createText(`
+  `,!1),...(0,T.env)("NODE_ENV")==="development"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("script",{src:"/dev.js"},"{ 'src': `/dev.js` }"),e.TempleRegistry.createText(`
   `,!1)]:[],e.TempleRegistry.createText(`
 `,!1)]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("body",{class:"dark panel with-head with-left with-right"},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("header",{class:"head panel-head"},[e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("i",{class:"menu fas fa-fw fa-bars",click:n},[]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("a",{href:"/temple"},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("img",{src:"/temple/temple-icon.png",alt:"Temple Logo"}),e.TempleRegistry.createText(`
-  `,!1)]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("h3",{},[e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple"},[e.TempleRegistry.createText("Temple",!1)])]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("nav",{},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple/docs/index.html"},[e.TempleRegistry.createText("Docs",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{class:"github",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-github"},[]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("body",{class:"dark bg-t-0 tx-t1 arial"},"{ 'class': `dark bg-t-0 tx-t1 arial` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("panel-layout",{},"{ }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("panel-head",{},"{ }",[e.TempleRegistry.createElement("menu",{class:"flex flex-center-y px-20 py-15 m-0 bg-t-1"},"{ 'class': `flex flex-center-y px-20 py-15 m-0 bg-t-1` }",[e.TempleRegistry.createText(`
+  `,!1),...t!=="/temple/index.html"&&t!=="/temple/500.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-bars cursor-pointer py-5 pr-10 none md-inline-block tx-t-1",click:i},"{ 'class': `fas fa-fw fa-bars cursor-pointer py-5 pr-10 none md-inline-block tx-t-1`, 'click': toggle }",[]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("div",{class:"flex-grow"},"{ 'class': `flex-grow` }",[]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{href:"/temple"},"{ 'href': `/temple` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("img",{alt:"Temple Logo",class:"h-26 mr-10",src:"/temple/temple-icon.png"},"{ 'alt': `Temple Logo`, 'class': `h-26 mr-10`, 'src': `/temple/temple-icon.png` }"),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{class:"npm",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-npm text-white"},[]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("h3",{class:"flex-grow tx-uppercase"},"{ 'class': `flex-grow tx-uppercase` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple"},"{ 'class': `tx-white`, 'href': `/temple` }",[e.TempleRegistry.createText("Temple",!1)]),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{class:"discord",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-discord text-white"},[]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("nav",{class:"flex flex-center-y"},"{ 'class': `flex flex-center-y` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple/docs/index.html"},"{ 'class': `tx-white`, 'href': `/temple/docs/index.html` }",[e.TempleRegistry.createText("Docs",!1)]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"tx-t-1 tx-5xl ml-10",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},"{ 'class': `tx-t-1 tx-5xl ml-10`, 'href': `https://github.com/OSSPhilippines/temple`, 'target': `_blank` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-github"},"{ 'class': `fab fa-github` }",[]),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
-  `,!1)]),e.TempleRegistry.createText(`
-`,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("aside",{class:"left panel-left"},[e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("header",{},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("img",{src:"/temple/temple-icon.png",alt:"Temple Logo"}),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"bg-h-cb3837 pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},"{ 'class': `bg-h-cb3837 pill tx-t-1 tx-lg ml-5 p-5 tx-center`, 'href': `https://www.npmjs.com/package/@ossph/temple`, 'target': `_blank` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-npm text-white"},"{ 'class': `fab fa-npm text-white` }",[]),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("h3",{},[e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple"},[e.TempleRegistry.createText("Temple",!1)])]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("i",{class:"toggle fas fa-fw fa-chevron-left",click:n},[]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"bg-h-7289da pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},"{ 'class': `bg-h-7289da pill tx-t-1 tx-lg ml-5 p-5 tx-center`, 'href': `https://discord.gg/open-source-software-ph-905496362982981723`, 'target': `_blank` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-discord text-white"},"{ 'class': `fab fa-discord text-white` }",[]),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]),e.TempleRegistry.createText(`
+`,!1)])]),e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("panel-left",{},"{ }",[e.TempleRegistry.createElement("header",{class:"flex flex-center-y bg-t-2 py-15 pr-5 pl-10"},"{ 'class': `flex flex-center-y bg-t-2 py-15 pr-5 pl-10` }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("a",{href:"/temple"},"{ 'href': `/temple` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("img",{class:"h-26 mr-10",src:"/temple/temple-icon.png",alt:"Temple Logo"},"{ 'class': `h-26 mr-10`, 'src': `/temple/temple-icon.png`, 'alt': `Temple Logo` }"),e.TempleRegistry.createText(`
   `,!1)]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("nav",{},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("h6",{},[e.TempleRegistry.createText("Introduction",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/index.html"},[e.TempleRegistry.createText("Documentation",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/getting-started.html"},[e.TempleRegistry.createText("Getting Started",!1)]),e.TempleRegistry.createText(`
-
-    `,!1),e.TempleRegistry.createElement("h6",{},[e.TempleRegistry.createText("Features",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/markup-syntax.html"},[e.TempleRegistry.createText("Markup Syntax",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/state-management.html"},[e.TempleRegistry.createText("State Management",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/component-strategy.html"},[e.TempleRegistry.createText("Component Strategy",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/compiler-api.html"},[e.TempleRegistry.createText("Compiler API",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/client-api.html"},[e.TempleRegistry.createText("Client API",!1)]),e.TempleRegistry.createText(`
-
-    `,!1),e.TempleRegistry.createElement("h6",{},[e.TempleRegistry.createText("Usage",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/template-engine.html"},[e.TempleRegistry.createText("Template Engine",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/single-page.html"},[e.TempleRegistry.createText("Single Page App",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/static-site.html"},[e.TempleRegistry.createText("Static Site Generator",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/component-publisher.html"},[e.TempleRegistry.createText("Component Publisher",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/developer-tools.html"},[e.TempleRegistry.createText("Developer Tools",!1)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("h3",{class:"flex-grow m-0 tx-uppercase"},"{ 'class': `flex-grow m-0 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple"},"{ 'class': `tx-white`, 'href': `/temple` }",[e.TempleRegistry.createText("Temple",!1)]),e.TempleRegistry.createText(`
   `,!1)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-left cursor-pointer none md-inline-block",click:i},"{ 'class': `fas fa-fw fa-chevron-left cursor-pointer none md-inline-block`, 'click': toggle }",[]),e.TempleRegistry.createText(`
 `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("aside",{class:"panel-right right"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("h6",{},[...this._toNodeList(i("On this page"))]),e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("nav",{},[e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("a",{href:"#imports"},[...this._toNodeList(i("Imports"))]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("a",{href:"#styles"},[...this._toNodeList(i("Styles"))]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("a",{href:"#scripts"},[...this._toNodeList(i("Scripts"))]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("a",{href:"#markup"},[...this._toNodeList(i("Markup"))]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("nav",{},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("a",{href:"#tagnames"},[...this._toNodeList(i("Tag Names"))]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("a",{href:"#attributes"},[...this._toNodeList(i("Attributes"))]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("a",{href:"#conditionals"},[...this._toNodeList(i("Conditionals"))]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("a",{href:"#iterations"},[...this._toNodeList(i("Iterations"))]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("a",{href:"#trycatch"},[...this._toNodeList(i("Try/Catch"))]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
-      `,!1)]),e.TempleRegistry.createText(`
+`,!1),e.TempleRegistry.createElement("nav",{class:"bg-t-1 scroll-auto h-calc-full-60"},"{ 'class': `bg-t-1 scroll-auto h-calc-full-60` }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("h6",{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-0 pt-20 pb-10 pl-10 tx-uppercase"},"{ 'class': `bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-0 pt-20 pb-10 pl-10 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),...this._toNodeList(l("Introduction")),e.TempleRegistry.createText(`
+  `,!1)]),e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/index.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/index.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/index.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("Documentation")),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("panel-main",{class:"panel-main"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("div",{class:"docs container"},[e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("h1",{},[...this._toNodeList(i("Markup Syntax"))]),e.TempleRegistry.createText(`
-
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Components are the building blocks of Temple files. Documents 
-          and page level markup are written in 
-          `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText(".dtml",!1)]),e.TempleRegistry.createText(` files. Components 
-          and templates are written in 
-          `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText(".tml",!1)]),e.TempleRegistry.createText(` files. In both 
-          cases, the code is written in a superset of HTML.
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          The four sections that make up a temple file \u2014 imports, 
-          script, styles and markup \u2014 are all optional and can be 
-          used in any order.
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("ide-app",{title:"Code Structure"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("ide-code",{numbers:!0,detab:12},[...this._toNodeList(`
-            
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/index.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/index.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("Documentation")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/getting-started.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/getting-started.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/getting-started.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("Getting Started")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/getting-started.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/getting-started.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("Getting Started")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
 
-            
+  `,!1),e.TempleRegistry.createElement("h6",{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},"{ 'class': `bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),...this._toNodeList(l("Features")),e.TempleRegistry.createText(`
+  `,!1)]),e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/markup-syntax.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/markup-syntax.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/markup-syntax.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("Markup Syntax")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/markup-syntax.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/markup-syntax.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("Markup Syntax")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/state-management.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/state-management.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/state-management.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("State Management")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/state-management.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/state-management.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("State Management")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/component-strategy.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/component-strategy.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/component-strategy.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("Component Strategy")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-strategy.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/component-strategy.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("Component Strategy")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/compiler-api.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/compiler-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/compiler-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("Compiler API")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/compiler-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/compiler-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("Compiler API")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/client-api.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/client-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/client-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("Client API")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/client-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/client-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("Client API")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
 
-            
-            
-            
-          `)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("h6",{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},"{ 'class': `bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),...this._toNodeList(l("Usage")),e.TempleRegistry.createText(`
+  `,!1)]),e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/template-engine.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/template-engine.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/template-engine.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("Template Engine")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/template-engine.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/template-engine.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("Template Engine")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/single-page.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/single-page.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/single-page.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("Single Page App")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/single-page.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/single-page.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("Single Page App")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/static-site.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/static-site.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/static-site.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("Static Site Generator")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/static-site.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/static-site.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("Static Site Generator")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/component-publisher.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/component-publisher.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/component-publisher.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("Component Publisher")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-publisher.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/component-publisher.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("Component Publisher")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/developer-tools.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold mb-100",href:"/temple/docs/developer-tools.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold mb-100`, 'href': `/temple/docs/developer-tools.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("Developer Tools")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 mb-100",href:"/temple/docs/developer-tools.html"},"{ 'class': `block tx-t-1 py-10 pl-10 mb-100`, 'href': `/temple/docs/developer-tools.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("Developer Tools")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+`,!1)])]),e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("panel-right",{},"{ }",[e.TempleRegistry.createText(`
+        `,!1),e.TempleRegistry.createElement("menu",{class:"m-0 px-10 py-20 h-calc-full-40 bg-t-2 scroll-auto"},"{ 'class': `m-0 px-10 py-20 h-calc-full-40 bg-t-2 scroll-auto` }",[e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("h6",{class:"tx-muted tx-14 mb-0 mt-0 pb-10 tx-uppercase"},"{ 'class': `tx-muted tx-14 mb-0 mt-0 pb-10 tx-uppercase` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(l("On this page")),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("nav",{class:"tx-14 tx-lh-32"},"{ 'class': `tx-14 tx-lh-32` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-0",href:"#imports"},"{ 'class': `block tx-t-0`, 'href': `#imports` }",[...this._toNodeList(l("Imports"))]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-0",href:"#styles"},"{ 'class': `block tx-t-0`, 'href': `#styles` }",[...this._toNodeList(l("Styles"))]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-0",href:"#scripts"},"{ 'class': `block tx-t-0`, 'href': `#scripts` }",[...this._toNodeList(l("Scripts"))]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-0",href:"#markup"},"{ 'class': `block tx-t-0`, 'href': `#markup` }",[...this._toNodeList(l("Markup"))]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("nav",{class:"pl-20"},"{ 'class': `pl-20` }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1",href:"#tagnames"},"{ 'class': `block tx-t-1`, 'href': `#tagnames` }",[...this._toNodeList(l("Tag Names"))]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1",href:"#attributes"},"{ 'class': `block tx-t-1`, 'href': `#attributes` }",[...this._toNodeList(l("Attributes"))]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1",href:"#conditionals"},"{ 'class': `block tx-t-1`, 'href': `#conditionals` }",[...this._toNodeList(l("Conditionals"))]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1",href:"#iterations"},"{ 'class': `block tx-t-1`, 'href': `#iterations` }",[...this._toNodeList(l("Iterations"))]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1",href:"#trycatch"},"{ 'class': `block tx-t-1`, 'href': `#trycatch` }",[...this._toNodeList(l("Try/Catch"))]),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
         `,!1)]),e.TempleRegistry.createText(`
+      `,!1)]),e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("panel-main",{},"{ }",[e.TempleRegistry.createText(`
+        `,!1),e.TempleRegistry.createElement("api-docs",{},"{ }",[e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("h1",{class:"tx-primary tx-uppercase tx-30 py-20"},"{ 'class': `tx-primary tx-uppercase tx-30 py-20` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(l("Markup Syntax")),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("a",{name:"imports"},[]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("h2",{},[...this._toNodeList(i("Imports"))]),e.TempleRegistry.createText(`
-
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Imports are used to include additional components, templates 
-          and stylesheets in the current component. Components can 
-          be imported as a `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("template",!1)]),e.TempleRegistry.createText(` or 
-          `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("component",!1)]),e.TempleRegistry.createText(` type.
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            Components are the building blocks of Temple files. Documents 
+            and page level markup are written in 
+            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText(".dtml",!1)]),e.TempleRegistry.createText(` files. Components 
+            and templates are written in 
+            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText(".tml",!1)]),e.TempleRegistry.createText(` files. In both 
+            cases, the code is written in a superset of HTML.
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            The four sections that make up a temple file \u2014 imports, 
+            script, styles and markup \u2014 are all optional and can be 
+            used in any order.
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("ide-app",{title:"Code Structure",class:"py-20"},"{ 'title': `Code Structure`, 'class': `py-20` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("ide-code",{numbers:!0,detab:14},"{ 'numbers': true, 'detab': 14 }",[...this._toNodeList(`
+              
+
+              
+
+              
+              
+              
+            `)]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("ide-app",{title:"Import Examples"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("ide-code",{numbers:!0,trim:!0,detab:12},[...this._toNodeList(`
-            
-            
-            
-            
+          `,!1),e.TempleRegistry.createElement("a",{name:"imports"},"{ 'name': `imports` }",[]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("h2",{class:"tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0"},"{ 'class': `tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(l("Imports")),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
 
-            
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            Imports are used to include additional components, templates 
+            and stylesheets in the current component. Components can 
+            be imported as a `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("template",!1)]),e.TempleRegistry.createText(` or 
+            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("component",!1)]),e.TempleRegistry.createText(` type.
+          `,!1)]),e.TempleRegistry.createText(`
 
-            
-            
-            
-          `)]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
-        
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          The `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("rel",!1)]),e.TempleRegistry.createText(` attribute 
-          specifies the relationship between the current document and 
-          the linked resource. 
-          
-          `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText('rel="import"',!1)]),e.TempleRegistry.createText(` denotes
-          that the imported resource is a component or template.
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          The `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("type",!1)]),e.TempleRegistry.createText(` 
-          attribute specifies the type of the linked resource. 
-          
-          `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText('type="component"',!1)]),e.TempleRegistry.createText(` 
-          imports a web component that can be used as regular markup
-          with attributes and children. 
+          `,!1),e.TempleRegistry.createElement("ide-app",{title:"Import Examples",class:"py-20"},"{ 'title': `Import Examples`, 'class': `py-20` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("ide-code",{class:"scroll-auto",numbers:!0,trim:!0,detab:14},"{ 'class': `scroll-auto`, 'numbers': true, 'trim': true, 'detab': 14 }",[...this._toNodeList(`
+              
+              
+              
+              
+
+              
+
+              
+              
+              
+            `)]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
           
-          `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText('type="template"',!1)]),e.TempleRegistry.createText(` 
-          imports a template partial that can be included in the current 
-          markup. Template partials do not process attributes or children
-          if given.
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          The 
-          `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("href",!1)]),e.TempleRegistry.createText(` attribute specifies
-          the URL of the linked resource. The 
-          `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("name",!1)]),e.TempleRegistry.createText(`
-          attribute specifies the tag name of the imported component or template.
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            The `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("rel",!1)]),e.TempleRegistry.createText(` attribute 
+            specifies the relationship between the current document and 
+            the linked resource. 
+            
+            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText('rel="import"',!1)]),e.TempleRegistry.createText(` denotes
+            that the imported resource is a component or template.
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            The `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("type",!1)]),e.TempleRegistry.createText(` 
+            attribute specifies the type of the linked resource. 
+            
+            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText('type="component"',!1)]),e.TempleRegistry.createText(` 
+            imports a web component that can be used as regular markup
+            with attributes and children. 
+            
+            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText('type="template"',!1)]),e.TempleRegistry.createText(` 
+            imports a template partial that can be included in the current 
+            markup. Template partials do not process attributes or children
+            if given.
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            The 
+            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("href",!1)]),e.TempleRegistry.createText(` attribute specifies
+            the URL of the linked resource. The 
+            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("name",!1)]),e.TempleRegistry.createText(`
+            attribute specifies the tag name of the imported component or template.
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("a",{name:"styles"},[]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("h2",{},[...this._toNodeList(i("Styles"))]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("a",{name:"styles"},"{ 'name': `styles` }",[]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("h2",{class:"tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0"},"{ 'class': `tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(l("Styles")),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          CSS styles inside a `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList("
-          `)]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("ide-app",{title:"Using :host",class:"py-20"},"{ 'title': `Using :host`, 'class': `py-20` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("ide-code",{numbers:!0,trim:!0,detab:14},"{ 'numbers': true, 'trim': true, 'detab': 14 }",[...this._toNodeList(`
+              
+            `)]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          You can also add conditional styles using the 
-          `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList(":host")]),e.TempleRegistry.createText(` selector function. 
-          This can be used to style the host so long as it matches the 
-          given selector. For example, it can be used to select for 
-          hosts that have a given attribute or class.
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            You can also add conditional styles using the 
+            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[...this._toNodeList(":host")]),e.TempleRegistry.createText(` selector function. 
+            This can be used to style the host so long as it matches the 
+            given selector. For example, it can be used to select for 
+            hosts that have a given attribute or class.
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("ide-app",{title:":host Conditionals"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("ide-code",{numbers:!0,trim:!0,detab:12},[...this._toNodeList(`
-            
-          `)]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("ide-app",{title:":host Conditionals",class:"py-20"},"{ 'title': `:host Conditionals`, 'class': `py-20` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("ide-code",{numbers:!0,trim:!0,detab:14},"{ 'numbers': true, 'trim': true, 'detab': 14 }",[...this._toNodeList(`
+              
+            `)]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("a",{name:"scripts"},[]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("h2",{},[...this._toNodeList(i("Scripts"))]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("a",{name:"scripts"},"{ 'name': `scripts` }",[]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("h2",{class:"tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0"},"{ 'class': `tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(l("Scripts")),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          The `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList("
+          `,!1),e.TempleRegistry.createElement("ide-app",{title:"Top-Level Variables",class:"py-20"},"{ 'title': `Top-Level Variables`, 'class': `py-20` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("ide-code",{numbers:!0,trim:!0,detab:14},"{ 'numbers': true, 'trim': true, 'detab': 14 }",[...this._toNodeList(`
+              
 
-            
    {title}
    
-          `)]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
+              
    {title}
    
+            `)]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          The `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList("
+          `,!1),e.TempleRegistry.createElement("ide-app",{title:"Importing Files",class:"py-20"},"{ 'title': `Importing Files`, 'class': `py-20` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("ide-code",{class:"scroll-auto",numbers:!0,trim:!0,detab:14},"{ 'class': `scroll-auto`, 'numbers': true, 'trim': true, 'detab': 14 }",[...this._toNodeList(`
+              
 
-            
    {title}
    
-          `)]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
+              
    {title}
    
+            `)]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          You can use `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList("@/")]),e.TempleRegistry.createText(` to prefix the 
-          current working directory. This is useful when importing
-          files completely in a separate directory in your project
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            You can use `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[...this._toNodeList("@/")]),e.TempleRegistry.createText(` to prefix the 
+            current working directory. This is useful when importing
+            files completely in a separate directory in your project
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("ide-app",{title:"@ Imports"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("ide-code",{numbers:!0,trim:!0,detab:12},[...this._toNodeList(`
-            
+          `,!1),e.TempleRegistry.createElement("ide-app",{title:"@ Imports",class:"py-20"},"{ 'title': `@ Imports`, 'class': `py-20` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("ide-code",{class:"scroll-auto",numbers:!0,trim:!0,detab:14},"{ 'class': `scroll-auto`, 'numbers': true, 'trim': true, 'detab': 14 }",[...this._toNodeList(`
+              
 
-            
    {title}
    
-          `)]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
+              
    {title}
    
+            `)]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("a",{name:"markup"},[]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("h2",{},[...this._toNodeList(i("Markup"))]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("a",{name:"markup"},"{ 'name': `markup` }",[]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("h2",{class:"tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0"},"{ 'class': `tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(l("Markup")),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          In order to be closer to the native, Temple follows the same 
-          standards and conventions as HTML5 web components. Temple 
-          components are compiled to native web components that possibly 
-          can be used in other projects any modern browser.
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            In order to be closer to the native, Temple follows the same 
+            standards and conventions as HTML5 web components. Temple 
+            components are compiled to native web components that possibly 
+            can be used in other projects any modern browser.
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("a",{name:"tagnames"},[]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("h3",{},[...this._toNodeList(i("Tag Names"))]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("a",{name:"tagnames"},"{ 'name': `tagnames` }",[]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("h3",{class:"tx-t-1 tx-uppercase tx-22 pt-40 pb-20"},"{ 'class': `tx-t-1 tx-uppercase tx-22 pt-40 pb-20` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(l("Tag Names")),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Tag names must have at least one dash (-) in them. As such 
-          you probably want to name your element with two distinct words 
-          like `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList("i18n-translate")]),e.TempleRegistry.createText(`. You can 
-          use as many dashes as you want, you're not limited to one. 
-          Some specific rules to follow in order to make a valid tag 
-          name:
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            For web components it's recommended that tag names must have 
+            at least one dash (-) in them. As such you probably want to 
+            name your element with two distinct words like 
+            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[...this._toNodeList("i18n-translate")]),e.TempleRegistry.createText(`. You can 
+            use as many dashes as you want, you're not limited to one. 
+            Some specific rules to follow in order to make a valid tag 
+            name:
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("ul",{},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("i18n-translate",{li:!0,trim:!0},[e.TempleRegistry.createText(`
-            It must use all lowercase characters of the alphabet (a-z).
+          `,!1),e.TempleRegistry.createElement("ul",{},"{ }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("i18n-translate",{li:!0,trim:!0,class:"my-10 tx-lh-24"},"{ 'li': true, 'trim': true, 'class': `my-10 tx-lh-24` }",[e.TempleRegistry.createText(`
+              It must use all lowercase characters of the alphabet (a-z).
+            `,!1)]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("i18n-translate",{li:!0,trim:!0,class:"my-10 tx-lh-24"},"{ 'li': true, 'trim': true, 'class': `my-10 tx-lh-24` }",[e.TempleRegistry.createText(`
+              It must contain at least one dash (-). Temple will 
+              auto prefix component names based on your configuration.
+            `,!1)]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("i18n-translate",{li:!0,trim:!0,class:"my-10 tx-lh-24"},"{ 'li': true, 'trim': true, 'class': `my-10 tx-lh-24` }",[e.TempleRegistry.createText(`
+              It must not be an already reserved tag name including 
+              `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("annotation-xml",!1)]),e.TempleRegistry.createText(`,
+              `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("color-profile",!1)]),e.TempleRegistry.createText(`,
+              `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("font-face",!1)]),e.TempleRegistry.createText(`,
+              `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("font-face-src",!1)]),e.TempleRegistry.createText(`,
+              `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("font-face-uri",!1)]),e.TempleRegistry.createText(`,
+              `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("font-face-format",!1)]),e.TempleRegistry.createText(`,
+              `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("font-face-name",!1)]),e.TempleRegistry.createText(`, and 
+              `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("missing-glyph",!1)]),e.TempleRegistry.createText(`.
+            `,!1)]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("i18n-translate",{li:!0,trim:!0,class:"my-10 tx-lh-24"},"{ 'li': true, 'trim': true, 'class': `my-10 tx-lh-24` }",[e.TempleRegistry.createText(`
+              It must not contain symbols, like =, @, $.
+            `,!1)]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("i18n-translate",{li:!0,trim:!0,class:"my-10 tx-lh-24"},"{ 'li': true, 'trim': true, 'class': `my-10 tx-lh-24` }",[e.TempleRegistry.createText(`
+              It can contain underscores, and numbers.
+            `,!1)]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("i18n-translate",{li:!0,trim:!0,class:"my-10 tx-lh-24"},"{ 'li': true, 'trim': true, 'class': `my-10 tx-lh-24` }",[e.TempleRegistry.createText(`
+              It can contain characters from different alphabets, 
+              such as \xE9, \xF0, \xF6, \u7231.
+            `,!1)]),e.TempleRegistry.createText(`
           `,!1)]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("i18n-translate",{li:!0,trim:!0},[e.TempleRegistry.createText(`
-            t must contain at least one dash (-).
+
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            Additionally, Temple works best with correct markup. The 
+            following standards should be followed:
           `,!1)]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("i18n-translate",{li:!0,trim:!0},[e.TempleRegistry.createText(`
-            It must not be an already reserved tag name including 
-            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("annotation-xml",!1)]),e.TempleRegistry.createText(`,
-            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("color-profile",!1)]),e.TempleRegistry.createText(`,
-            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("font-face",!1)]),e.TempleRegistry.createText(`,
-            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("font-face-src",!1)]),e.TempleRegistry.createText(`,
-            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("font-face-uri",!1)]),e.TempleRegistry.createText(`,
-            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("font-face-format",!1)]),e.TempleRegistry.createText(`,
-            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("font-face-name",!1)]),e.TempleRegistry.createText(`, and 
-            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("missing-glyph",!1)]),e.TempleRegistry.createText(`.
+
+          `,!1),e.TempleRegistry.createElement("ul",{},"{ }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("i18n-translate",{li:!0,trim:!0,class:"my-10 tx-lh-24"},"{ 'li': true, 'trim': true, 'class': `my-10 tx-lh-24` }",[e.TempleRegistry.createText(`
+              Self closing tags like 
+              `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[...this._toNodeList("")]),e.TempleRegistry.createText(`,
+              `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[...this._toNodeList("")]),e.TempleRegistry.createText(`,
+              `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[...this._toNodeList("")]),e.TempleRegistry.createText(`,
+              `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[...this._toNodeList("")]),e.TempleRegistry.createText(`
+              must have a slash before the closing.
+            `,!1)]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("i18n-translate",{li:!0,trim:!0,class:"my-10 tx-lh-24"},"{ 'li': true, 'trim': true, 'class': `my-10 tx-lh-24` }",[e.TempleRegistry.createText(`
+              When using tables, rows should be wrapped in a 
+              `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[...this._toNodeList("")]),e.TempleRegistry.createText(` tag and cells
+              should be wrapped in a `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[...this._toNodeList("")]),e.TempleRegistry.createText(` 
+              tag. ie. `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[...this._toNodeList("")]),e.TempleRegistry.createText(` tag and cells
-            should be wrapped in a `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList("")]),e.TempleRegistry.createText(` 
-            tag. ie. `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList("
    ")]),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("i18n-translate",{li:!0,trim:!0,class:"my-10 tx-lh-24"},"{ 'li': true, 'trim': true, 'class': `my-10 tx-lh-24` }",[e.TempleRegistry.createText(`
+              When using lists, items should be wrapped in a 
+              `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[...this._toNodeList("
      ")]),e.TempleRegistry.createText(` or 
+              `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[...this._toNodeList("
        ")]),e.TempleRegistry.createText(` tags.
+              ie. `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[...this._toNodeList("
        • ")]),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
           `,!1)]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("i18n-translate",{li:!0,trim:!0},[e.TempleRegistry.createText(`
-            It must not contain symbols, like =, @, $.
+
+          `,!1),e.TempleRegistry.createElement("tui-alert",{solid:!0,curved:!0,secondary:!0,class:"py-20 tx-lh-24"},"{ 'solid': true, 'curved': true, 'secondary': true, 'class': `py-20 tx-lh-24` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-exclamation-triangle"},"{ 'class': `fas fa-exclamation-triangle` }",[]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("strong",{},"{ }",[e.TempleRegistry.createText("Warning:",!1)]),e.TempleRegistry.createText(` Any markup auto corrected by browser will cause data syncing 
+            issues with Temple.
           `,!1)]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("i18n-translate",{li:!0,trim:!0},[e.TempleRegistry.createText(`
-            It can contain underscores, and numbers.
+
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            Temple components can loosely be self closing
+            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[...this._toNodeList("")]),e.TempleRegistry.createText(`
+            or expressed as a block
+            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[...this._toNodeList("")]),e.TempleRegistry.createText(`.
           `,!1)]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("i18n-translate",{li:!0,trim:!0},[e.TempleRegistry.createText(`
-            It can contain characters from different alphabets, 
-            such as \xE9, \xF0, \xF6, \u7231.
+
+          `,!1),e.TempleRegistry.createElement("a",{name:"attributes"},"{ 'name': `attributes` }",[]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("h3",{class:"tx-t-1 tx-uppercase tx-22 pt-40 pb-20"},"{ 'class': `tx-t-1 tx-uppercase tx-22 pt-40 pb-20` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(l("Attributes")),e.TempleRegistry.createText(`
           `,!1)]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Additionally, Temple works best with correct markup. The 
-          following standards should be followed:
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("ide-app",{title:"Markup Expressions"},"{ 'title': `Markup Expressions` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("ide-code",{class:"scroll-auto",numbers:!0,trim:!0,detab:14},"{ 'class': `scroll-auto`, 'numbers': true, 'trim': true, 'detab': 14 }",[...this._toNodeList(`
+              
+                {title}
+              
+              
+                {detail}
+              
+            `)]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("ul",{},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("i18n-translate",{li:!0,trim:!0},[e.TempleRegistry.createText(`
-            Self closing tags like 
-            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList("")]),e.TempleRegistry.createText(`,
-            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList("")]),e.TempleRegistry.createText(`,
-            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList("")]),e.TempleRegistry.createText(`,
-            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList("")]),e.TempleRegistry.createText(`
-            must have a slash before the closing.
-          `,!1)]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("i18n-translate",{li:!0,trim:!0},[e.TempleRegistry.createText(`
-            When using tables, rows should be wrapped in a 
-            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList("
    `} tag and cells
+              should be wrapped in a {``} 
+              tag. ie. {`
    ")]),e.TempleRegistry.createText(`
-          `,!1)]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("i18n-translate",{li:!0,trim:!0},[e.TempleRegistry.createText(`
-            When using lists, items should be wrapped in a 
-            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList("
      ")]),e.TempleRegistry.createText(` or 
-            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList("
        ")]),e.TempleRegistry.createText(` tags.
-            ie. `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList("
        • ")]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            Attributes can be bound to expressions using the 
+            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[...this._toNodeList("{}")]),e.TempleRegistry.createText(` syntax. 
+            Expressions can be variables, functions, or any valid 
+            JavaScript expression. By default, attributes work exactly 
+            like their HTML counterparts.
           `,!1)]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("tui-alert",{solid:!0,curved:!0,secondary:!0},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-exclamation-triangle"},[]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("strong",{},[e.TempleRegistry.createText("Warning:",!1)]),e.TempleRegistry.createText(` Any markup auto corrected by browser will cause data syncing 
-          issues with Temple.
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("div",{class:"scroll-auto bg-black"},"{ 'class': `scroll-auto bg-black` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("ide-code",{trim:!0},"{ 'trim': true }",[...this._toNodeList(`
+              
+            `)]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            Traditional HTML attributes can be assigned string values or 
+            no value evaluates as `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[...this._toNodeList("true")]),e.TempleRegistry.createText(`.
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Temple components can loosely be self closing
-          `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList("")]),e.TempleRegistry.createText(`
-          or expressed as a block
-          `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList("")]),e.TempleRegistry.createText(`.
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("ide-code",{trim:!0},"{ 'trim': true }",[...this._toNodeList(`
+            Click
+          `)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            Attributes can be assigned variable names.
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("a",{name:"attributes"},[]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("h3",{},[...this._toNodeList(i("Attributes"))]),e.TempleRegistry.createText(`
-
-        `,!1),e.TempleRegistry.createElement("ide-app",{title:"Markup Expressions"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("ide-code",{numbers:!0,trim:!0,detab:12},[...this._toNodeList(`
-            
-              {title}
-            
-            
-              {detail}
-            
+          `,!1),e.TempleRegistry.createElement("ide-code",{trim:!0},"{ 'trim': true }",[...this._toNodeList(`
+            Click
           `)]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            Variable names do not need to be wrapped in curly braces
+            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[...this._toNodeList("{}")]),e.TempleRegistry.createText(`.
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Attributes can be bound to expressions using the 
-          `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList("{}")]),e.TempleRegistry.createText(` syntax. 
-          Expressions can be variables, functions, or any valid 
-          JavaScript expression. By default, attributes work exactly 
-          like their HTML counterparts.
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("ide-code",{trim:!0},"{ 'trim': true }",[...this._toNodeList(`
+            Click
+          `)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            Attributes with the same name as a variable can be assigned
+            by just wrapping curly braces. ie. 
+            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[...this._toNodeList("{title}")]),e.TempleRegistry.createText(`.
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("ide-code",{trim:!0,detab:10},[...this._toNodeList(`
-          
-        `)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Traditional HTML attributes can be assigned string values or 
-          no value evaluates as `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList("true")]),e.TempleRegistry.createText(`.
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("div",{class:"scroll-auto bg-black"},"{ 'class': `scroll-auto bg-black` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("ide-code",{trim:!0,detab:14},"{ 'trim': true, 'detab': 14 }",[...this._toNodeList(`
+              
+              Click
+            `)]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            Spread operators can be used to assign multiple attributes.
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("ide-code",{trim:!0,detab:10},[...this._toNodeList(`
-          Click
-        `)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Attributes can be assigned variable names.
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("div",{class:"scroll-auto bg-black"},"{ 'class': `scroll-auto bg-black` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("ide-code",{numbers:!0,trim:!0,detab:14},"{ 'numbers': true, 'trim': true, 'detab': 14 }",[...this._toNodeList(`
+              
+              
+                Click
+              
+            `)]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            You can assign any valid JavaScript expression to an attribute.
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("ide-code",{trim:!0,detab:10},[...this._toNodeList(`
-          Click
-        `)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Variable names do not need to be wrapped in curly braces
-          `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList("{}")]),e.TempleRegistry.createText(`.
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("a",{name:"conditionals"},"{ 'name': `conditionals` }",[]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("h3",{class:"tx-t-1 tx-uppercase tx-22 pt-40 pb-20"},"{ 'class': `tx-t-1 tx-uppercase tx-22 pt-40 pb-20` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(l("Conditionals")),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("ide-code",{trim:!0,detab:10},[...this._toNodeList(`
-          Click
-        `)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Attributes with the same name as a variable can be assigned
-          by just wrapping curly braces. ie. 
-          `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList("{title}")]),e.TempleRegistry.createText(`.
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("ide-app",{title:"Conditionals",class:"py-20"},"{ 'title': `Conditionals`, 'class': `py-20` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("ide-code",{class:"scroll-auto",numbers:!0,trim:!0,detab:14},"{ 'class': `scroll-auto`, 'numbers': true, 'trim': true, 'detab': 14 }",[...this._toNodeList(`
+               10}>
+                
          Count is greater than 10
          
+              
+                
          Count is less than 5
          
+              
+                
          Count is between 5 and 10
          
+                        
+            `)]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            Conditionals can be used to show or hide elements based on 
+            the value of a variable.
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("ide-code",{trim:!0,detab:10},[...this._toNodeList(`
-          
-          Click
-        `)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Spread operators can be used to assign multiple attributes.
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("div",{class:"scroll-auto bg-black"},"{ 'class': `scroll-auto bg-black` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("ide-code",{numbers:!0,trim:!0,detab:14},"{ 'numbers': true, 'trim': true, 'detab': 14 }",[...this._toNodeList(`
+               10}>
+                
          Count is greater than 10
          
+                        
+            `)]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            The basic syntax for an if statement looks like this and can be 
+            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[...this._toNodeList("truesy")]),e.TempleRegistry.createText(` or 
+            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[...this._toNodeList("falsey")]),e.TempleRegistry.createText(`.
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("ide-code",{numbers:!0,trim:!0,detab:10},[...this._toNodeList(`
-          
-          
-            Click
-          
-        `)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          You can assign any valid JavaScript expression to an attribute.
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("div",{class:"scroll-auto bg-black"},"{ 'class': `scroll-auto bg-black` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("ide-code",{numbers:!0,trim:!0,detab:14},"{ 'numbers': true, 'trim': true, 'detab': 14 }",[...this._toNodeList(`
+               10}>
+                
          Count is not greater than 10
          
+                        
+            `)]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            You can also use the `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[...this._toNodeList("false")]),e.TempleRegistry.createText(`
+            attribute to negate the condition.
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("a",{name:"conditionals"},[]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("h3",{},[...this._toNodeList(i("Conditionals"))]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("div",{class:"scroll-auto bg-black"},"{ 'class': `scroll-auto bg-black` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("ide-code",{numbers:!0,trim:!0,detab:14},"{ 'numbers': true, 'trim': true, 'detab': 14 }",[...this._toNodeList(`
+               10}>
+                
          Count is greater than 10
          
+              
+                
          Count is less than or equal to 10
          
+                        
+            `)]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            You can use the `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[...this._toNodeList("else")]),e.TempleRegistry.createText(` block to 
+            show content when the condition is false.
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("ide-app",{title:"Conditionals"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("ide-code",{numbers:!0,trim:!0,detab:12},[...this._toNodeList(`
+          `,!1),e.TempleRegistry.createElement("ide-code",{numbers:!0,trim:!0,detab:12},"{ 'numbers': true, 'trim': true, 'detab': 12 }",[...this._toNodeList(`
              10}>
               
          Count is greater than 10
          
             
               
          Count is less than 5
          
-            
-              
          Count is between 5 and 10
          
                       
           `)]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Conditionals can be used to show or hide elements based on 
-          the value of a variable.
-        `,!1)]),e.TempleRegistry.createText(`
-
-        `,!1),e.TempleRegistry.createElement("ide-code",{numbers:!0,trim:!0,detab:12},[...this._toNodeList(`
-           10}>
-            
          Count is greater than 10
          
-                    
-        `)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          The basic syntax for an if statement looks like this and can be 
-          `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList("truesy")]),e.TempleRegistry.createText(` or 
-          `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList("falsey")]),e.TempleRegistry.createText(`.
-        `,!1)]),e.TempleRegistry.createText(`
-
-        `,!1),e.TempleRegistry.createElement("ide-code",{numbers:!0,trim:!0,detab:12},[...this._toNodeList(`
-           10}>
-            
          Count is not greater than 10
          
-                    
-        `)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          You can also use the `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList("false")]),e.TempleRegistry.createText(`
-          attribute to negate the condition.
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            You can use the `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[...this._toNodeList("elif")]),e.TempleRegistry.createText(` block to 
+            show content when the previous condition is false.
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("ide-code",{numbers:!0,trim:!0,detab:12},[...this._toNodeList(`
-           10}>
-            
          Count is greater than 10
          
-          
-            
          Count is less than or equal to 10
          
-                    
-        `)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          You can use the `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList("else")]),e.TempleRegistry.createText(` block to 
-          show content when the condition is false.
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("a",{name:"iterations"},"{ 'name': `iterations` }",[]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("h3",{class:"tx-t-1 tx-uppercase tx-22 pt-40 pb-20"},"{ 'class': `tx-t-1 tx-uppercase tx-22 pt-40 pb-20` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(l("Iterations")),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("ide-code",{numbers:!0,trim:!0,detab:12},[...this._toNodeList(`
-           10}>
-            
          Count is greater than 10
          
-          
-            
          Count is less than 5
          
-                    
-        `)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          You can use the `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList("elif")]),e.TempleRegistry.createText(` block to 
-          show content when the previous condition is false.
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("ide-app",{title:"Each",class:"py-20"},"{ 'title': `Each`, 'class': `py-20` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("ide-code",{class:"scroll-auto",numbers:!0,trim:!0,detab:14},"{ 'class': `scroll-auto`, 'numbers': true, 'trim': true, 'detab': 14 }",[...this._toNodeList(`
+              
+                
          #{index + 1} {article.title}
          
+                
          {article.body}
          
+                        
+            `)]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            The `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[...this._toNodeList("")]),e.TempleRegistry.createText(` block can be used 
+            to iterate over an array of items or objects.
+            The `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[...this._toNodeList("from")]),e.TempleRegistry.createText(` attribute value is 
+            required and can be an array, object or JavaScript expression 
+            that evaluates to an array or object. Both the 
+            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[...this._toNodeList("key")]),e.TempleRegistry.createText(` and 
+            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[...this._toNodeList("value")]),e.TempleRegistry.createText(` attributes are optional.
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("a",{name:"iterations"},[]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("h3",{},[...this._toNodeList(i("Iterations"))]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("div",{class:"scroll-auto bg-black"},"{ 'class': `scroll-auto bg-black` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("ide-code",{numbers:!0,trim:!0,detab:14},"{ 'numbers': true, 'trim': true, 'detab': 14 }",[...this._toNodeList(`
+              
+                
          {article.title}
          
+                
          {article.body}
          
+                        
+            `)]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            The value of `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[...this._toNodeList("value")]),e.TempleRegistry.createText(`, in this 
+            case `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[...this._toNodeList("article")]),e.TempleRegistry.createText(` can be used 
+            only with in the block. This can be any valid JavaScript 
+            variable name.
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("ide-app",{title:"Each"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("ide-code",{numbers:!0,trim:!0,detab:12},[...this._toNodeList(`
-            
-              
          #{index + 1} {article.title}
          
-              
          {article.body}
          
+          `,!1),e.TempleRegistry.createElement("ide-code",{numbers:!0,trim:!0,detab:12},"{ 'numbers': true, 'trim': true, 'detab': 12 }",[...this._toNodeList(`
+            
+              
          #{index} ???
          
                       
           `)]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          The `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList("")]),e.TempleRegistry.createText(` block can be used 
-          to iterate over an array of items or objects.
-          The `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList("from")]),e.TempleRegistry.createText(` attribute value is 
-          required and can be an array, object or JavaScript expression 
-          that evaluates to an array or object. Both the 
-          `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList("key")]),e.TempleRegistry.createText(` and 
-          `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList("value")]),e.TempleRegistry.createText(` attributes are optional.
-        `,!1)]),e.TempleRegistry.createText(`
-
-        `,!1),e.TempleRegistry.createElement("ide-code",{numbers:!0,trim:!0,detab:12},[...this._toNodeList(`
-          
-            
          {article.title}
          
-            
          {article.body}
          
-                    
-        `)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          The value of `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList("value")]),e.TempleRegistry.createText(`, in this 
-          case `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList("article")]),e.TempleRegistry.createText(` can be used 
-          only with in the block. This can be any valid JavaScript 
-          variable name.
-        `,!1)]),e.TempleRegistry.createText(`
-
-        `,!1),e.TempleRegistry.createElement("ide-code",{numbers:!0,trim:!0,detab:12},[...this._toNodeList(`
-          
-            
          #{index} ???
          
-                    
-        `)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          The value of `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList("key")]),e.TempleRegistry.createText(`, in this 
-          case `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList("index")]),e.TempleRegistry.createText(` can be used 
-          only with in the block. This can be any valid JavaScript 
-          variable name.
-        `,!1)]),e.TempleRegistry.createText(`
-
-        `,!1),e.TempleRegistry.createElement("a",{name:"trycatch"},[]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("h3",{},[...this._toNodeList(i("Try/Catch"))]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            The value of `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[...this._toNodeList("key")]),e.TempleRegistry.createText(`, in this 
+            case `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[...this._toNodeList("index")]),e.TempleRegistry.createText(` can be used 
+            only with in the block. This can be any valid JavaScript 
+            variable name.
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("ide-app",{title:"Try/Catch Example"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("ide-code",{numbers:!0,trim:!0,detab:12},[...this._toNodeList(`
-            
-              
          {mayCauseError()}
          
-            
-              
          Error: {e.message}
          
-                      
-          `)]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("a",{name:"trycatch"},"{ 'name': `trycatch` }",[]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("h3",{class:"tx-t-1 tx-uppercase tx-22 pt-40 pb-20"},"{ 'class': `tx-t-1 tx-uppercase tx-22 pt-40 pb-20` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(l("Try/Catch")),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          The `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList("")]),e.TempleRegistry.createText(` block can 
-          be used to catch errors that occur in the block. The 
-          `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList("")]),e.TempleRegistry.createText(` block is required and 
-          can be used to handle the error.
-
-          The value of `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList("error")]),e.TempleRegistry.createText(`, in the  
-          `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList("")]),e.TempleRegistry.createText(` block in this case
-          `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList("e")]),e.TempleRegistry.createText(` is an 
-          `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},[...this._toNodeList("Error")]),e.TempleRegistry.createText(` object
-          that can only be used with in the block. 
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("ide-app",{title:"Try/Catch Example",class:"py-20"},"{ 'title': `Try/Catch Example`, 'class': `py-20` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("ide-code",{numbers:!0,trim:!0,detab:14},"{ 'numbers': true, 'trim': true, 'detab': 14 }",[...this._toNodeList(`
+              
+                
          {mayCauseError()}
          
+              
+                
          Error: {e.message}
          
+                        
+            `)]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("nav",{class:"pager"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("a",{class:"prev",href:"/temple/docs/getting-started.html"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-left"},[]),e.TempleRegistry.createText(`
-            `,!1),...this._toNodeList(i("Getting Started")),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            The `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[...this._toNodeList("")]),e.TempleRegistry.createText(` block can 
+            be used to catch errors that occur in the block. The 
+            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[...this._toNodeList("")]),e.TempleRegistry.createText(` block is required and 
+            can be used to handle the error.
+
+            The value of `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[...this._toNodeList("error")]),e.TempleRegistry.createText(`, in the  
+            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[...this._toNodeList("")]),e.TempleRegistry.createText(` block in this case
+            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[...this._toNodeList("e")]),e.TempleRegistry.createText(` is an 
+            `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},"{ 'lang': `js`, 'inline': true }",[...this._toNodeList("Error")]),e.TempleRegistry.createText(` object
+            that can only be used with in the block. 
           `,!1)]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("a",{class:"next",href:"/temple/docs/state-management.html"},[e.TempleRegistry.createText(`
-            `,!1),...this._toNodeList(i("State Management")),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-right"},[]),e.TempleRegistry.createText(`
+
+          `,!1),e.TempleRegistry.createElement("nav",{class:"flex"},"{ 'class': `flex` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"tx-primary py-40",href:"/temple/docs/getting-started.html"},"{ 'class': `tx-primary py-40`, 'href': `/temple/docs/getting-started.html` }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-left tx-t-1"},"{ 'class': `fas fa-fw fa-chevron-left tx-t-1` }",[]),e.TempleRegistry.createText(`
+              `,!1),...this._toNodeList(l("Getting Started")),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"flex-grow tx-right tx-primary py-40",href:"/temple/docs/state-management.html"},"{ 'class': `flex-grow tx-right tx-primary py-40`, 'href': `/temple/docs/state-management.html` }",[e.TempleRegistry.createText(`
+              `,!1),...this._toNodeList(l("State Management")),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-right tx-t-1"},"{ 'class': `fas fa-fw fa-chevron-right tx-t-1` }",[]),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
           `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("footer",{class:"foot"},"{ 'class': `foot` }",[]),e.TempleRegistry.createText(`
         `,!1)]),e.TempleRegistry.createText(`
       `,!1)]),e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("footer",{class:"foot"},[]),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
   `,!1)]),e.TempleRegistry.createText(`
-`,!1)])]}};return ie(Ye);})();
+`,!1)])]}};return le(De);})();
diff --git a/docs/build/server/75ff7698b5db04ad540c.js b/docs/build/server/75ff7698b5db04ad540c.js
index 9278758..f6cbc12 100644
--- a/docs/build/server/75ff7698b5db04ad540c.js
+++ b/docs/build/server/75ff7698b5db04ad540c.js
@@ -1,182 +1,302 @@
-var TempleAPI=(()=>{var ee=Object.create;var g=Object.defineProperty;var te=Object.getOwnPropertyDescriptor;var ae=Object.getOwnPropertyNames;var re=Object.getPrototypeOf,le=Object.prototype.hasOwnProperty;var i=(a,t)=>()=>(t||a((t={exports:{}}).exports,t),t.exports),se=(a,t)=>{for(var r in t)g(a,r,{get:t[r],enumerable:!0})},F=(a,t,r,l)=>{if(t&&typeof t=="object"||typeof t=="function")for(let n of ae(t))!le.call(a,n)&&n!==r&&g(a,n,{get:()=>t[n],enumerable:!(l=te(t,n))||l.enumerable});return a};var J=(a,t,r)=>(r=a!=null?ee(re(a)):{},F(t||!a||!a.__esModule?g(r,"default",{value:a,enumerable:!0}):r,a)),ce=a=>F(g({},"__esModule",{value:!0}),a);var k=i(L=>{"use strict";Object.defineProperty(L,"__esModule",{value:!0});var D=class extends Error{static for(t,...r){return r.forEach(function(l){t=t.replace("%s",l)}),new this(t)}static forErrorsFound(t){let r=new this("Invalid Parameters");return r.errors=t,r}static require(t,r,...l){if(!t){for(let n of l)r=r.replace("%s",n);throw new this(r)}}constructor(t,r=500){super(),this.errors={},this.start=0,this.end=0,this.message=t,this.name=this.constructor.name,this.code=r}withCode(t){return this.code=t,this}withPosition(t,r){return this.start=t,this.end=r,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};L.default=D});var P=i(A=>{"use strict";Object.defineProperty(A,"__esModule",{value:!0});var N=class{constructor(t=[]){this._elements=new Set,t.forEach(r=>this._elements.add(r))}add(t){this._elements.add(t)}toArray(){return Array.from(this._elements)}toString(){return Array.from(this._elements).filter(Boolean).map(t=>t.toString()).join("")}};A.default=N});var m=i(S=>{"use strict";Object.defineProperty(S,"__esModule",{value:!0});var ne=new Map;S.default=ne});var y=i(p=>{"use strict";var ie=p&&p.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(p,"__esModule",{value:!0});var oe=ie(P()),fe=["area","base","br","col","embed","hr","img","input","link","meta","param","source","track","wbr"],O=class{static render(t){return t.filter(Boolean).map(r=>r.toString()).join("")}get name(){return this._name}get attributes(){return this._attributes}get children(){return this._children}constructor(t,r={},l=[]){this._attributes={},this._name=t,this._attributes=r,this._children=new oe.default(l)}toString(){let t=Object.entries(this._attributes),r=t.length>0?" "+t.map(([n,f])=>{if(typeof f=="string")return`${n}="${f}"`;if(typeof f=="boolean")return f?n:""}).join(" "):"";if(fe.includes(this._name))return`<${this._name}${r} />`;let l=this._children.toString();return`<${this._name}${r}>${l}`}};p.default=O});var M=i(I=>{"use strict";Object.defineProperty(I,"__esModule",{value:!0});var j=class{get value(){return this._escape?this._value.replace(/&/g,"&").replace(//g,">"):this._value}constructor(t,r=!1){this._escape=r,this._value=t}toString(){return this.value}};I.default=j});var q=i(d=>{"use strict";var R=d&&d.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(d,"__esModule",{value:!0});var me=R(M()),pe=R(y()),C=class{static createElement(t,r,l=[]){return new pe.default(t,r,l)}static createText(t,r=!0){return new me.default(t,r)}};d.default=C});var Y=i(h=>{"use strict";var _=h&&h.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(h,"__esModule",{value:!0});var de=_(k()),U=_(m()),he=_(y()),ue=_(q()),B=class{render(t={}){U.default.set("props",t||{}),U.default.set("env",Object.assign(Object.assign({},process.env||{}),{BUILD_ID:this.id(),APP_DATA:btoa(JSON.stringify(Object.assign(Object.assign({},Object.fromEntries(U.default.entries())),{env:Object.assign(Object.assign({},Object.fromEntries(Object.entries(process.env||{}).filter(n=>n[0].startsWith("PUBLIC_")))),{BUILD_ID:this.id()})})))}));let r=this.template(),l=he.default.render(r).trim();if(!l.toLowerCase().startsWith(" tag.");return`
-${l}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:Array.isArray(t)&&t.every(r=>typeof r=="object"&&typeof r.nodeType=="number")?t:[ue.default.createText(String(t))]}};h.default=B});var G=i(u=>{"use strict";Object.defineProperty(u,"__esModule",{value:!0});u.TempleEmitter=void 0;var v=class{emit(t,r){return this}on(t,r){return this}once(t,r){return this}unbind(t,r){return this}};u.TempleEmitter=v;var Te=new v;u.default=Te});var V=i(T=>{"use strict";var xe=T&&T.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(T,"__esModule",{value:!0});var Ee=xe(m());function be(a){let t=Ee.default.get("env")||{};return a?t[a]||null:t}T.default=be});var $=i(x=>{"use strict";var ge=x&&x.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(x,"__esModule",{value:!0});x.default=_e;var ye=ge(m());function _e(){return ye.default.get("props")||{}}});var z=i(E=>{"use strict";var ve=E&&E.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(E,"__esModule",{value:!0});E.default=De;var we=ve($());function De(){return(0,we.default)().class}});var K=i(W=>{"use strict";Object.defineProperty(W,"__esModule",{value:!0});W.default=Le;function Le(a){let t={getter:()=>r.raw,setter:l=>l},r={raw:a,getter(l){return t.getter=l,r},setter(l){return t.setter=l,r}};return Object.defineProperty(r,"value",{get(){return t.getter()},set(l){r.raw=t.setter(l)}}),r}});var X=i(s=>{"use strict";var ke=s&&s.__createBinding||(Object.create?function(a,t,r,l){l===void 0&&(l=r);var n=Object.getOwnPropertyDescriptor(t,r);(!n||("get"in n?!t.__esModule:n.writable||n.configurable))&&(n={enumerable:!0,get:function(){return t[r]}}),Object.defineProperty(a,l,n)}:function(a,t,r,l){l===void 0&&(l=r),a[l]=t[r]}),Ne=s&&s.__setModuleDefault||(Object.create?function(a,t){Object.defineProperty(a,"default",{enumerable:!0,value:t})}:function(a,t){a.default=t}),Ae=s&&s.__importStar||function(a){if(a&&a.__esModule)return a;var t={};if(a!=null)for(var r in a)r!=="default"&&Object.prototype.hasOwnProperty.call(a,r)&&ke(t,a,r);return Ne(t,a),t},o=s&&s.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(s,"__esModule",{value:!0});s.TempleText=s.TempleException=s.TempleEmitter=s.TempleElement=s.TempleRegistry=s.TempleDocument=s.TempleCollection=s.signal=s.classnames=s.props=s.emitter=s.env=s.data=void 0;var Pe=o(k());s.TempleException=Pe.default;var Se=o(P());s.TempleCollection=Se.default;var Oe=o(Y());s.TempleDocument=Oe.default;var je=o(q());s.TempleRegistry=je.default;var Ie=o(y());s.TempleElement=Ie.default;var Q=Ae(G());s.emitter=Q.default;Object.defineProperty(s,"TempleEmitter",{enumerable:!0,get:function(){return Q.TempleEmitter}});var Me=o(M());s.TempleText=Me.default;var Ce=o(m());s.data=Ce.default;var qe=o(V());s.env=qe.default;var Ue=o($());s.props=Ue.default;var Be=o(z());s.classnames=Be.default;var $e=o(K());s.signal=$e.default});var H=i((rt,Z)=>{Z.exports={...X()}});var He={};se(He,{default:()=>w});var e=J(H()),b=J(H());var c=function(a,...t){let r=We(a);for(let l=0;l{document.body.classList.toggle("panel-left-open")};return[e.TempleRegistry.createText(`
-`,!1),e.TempleRegistry.createElement("html",{},[e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("head",{},[e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{charset:"utf-8"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"viewport",content:"width=device-width, initial-scale=1"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("title",{},[...this._toNodeList(r)]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"description",content:l}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:title",content:r}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:description",content:l}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:image",content:"https://ossphilippines.github.io/temple/temple-logo.png"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:url",content:`https://ossphilippines.github.io/temple${t}`}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:type",content:"website"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:card",content:"summary"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:site",content:"@OSSPhilippines"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:title",content:r}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:description",content:l}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:image",content:"https://ossphilippines.github.io/temple/temple-logo.png"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"favicon",href:"/temple/favicon.ico"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"shortcut icon",type:"image/png",href:"/temple/favicon.png"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/fontawesome/all.css"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/theme.css"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:`/temple/build/client/${(0,b.env)("BUILD_ID")}.css`}),e.TempleRegistry.createText(`
+var TempleAPI=(()=>{var X=Object.create;var g=Object.defineProperty;var Z=Object.getOwnPropertyDescriptor;var ee=Object.getOwnPropertyNames;var te=Object.getPrototypeOf,ae=Object.prototype.hasOwnProperty;var o=(a,t)=>()=>(t||a((t={exports:{}}).exports,t),t.exports),le=(a,t)=>{for(var l in t)g(a,l,{get:t[l],enumerable:!0})},W=(a,t,l,r)=>{if(t&&typeof t=="object"||typeof t=="function")for(let i of ee(t))!ae.call(a,i)&&i!==l&&g(a,i,{get:()=>t[i],enumerable:!(r=Z(t,i))||r.enumerable});return a};var H=(a,t,l)=>(l=a!=null?X(te(a)):{},W(t||!a||!a.__esModule?g(l,"default",{value:a,enumerable:!0}):l,a)),se=a=>W(g({},"__esModule",{value:!0}),a);var _=o(w=>{"use strict";Object.defineProperty(w,"__esModule",{value:!0});var E=class extends Error{static for(t,...l){return l.forEach(function(r){t=t.replace("%s",r)}),new this(t)}static forErrorsFound(t){let l=new this("Invalid Parameters");return l.errors=t,l}static require(t,l,...r){if(!t){for(let i of r)l=l.replace("%s",i);throw new this(l)}}constructor(t,l=500){super(),this.errors={},this.start=0,this.end=0,this.message=t,this.name=this.constructor.name,this.code=l}withCode(t){return this.code=t,this}withPosition(t,l){return this.start=t,this.end=l,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};w.default=E});var N=o(L=>{"use strict";Object.defineProperty(L,"__esModule",{value:!0});var k=class{get length(){return this._elements.size}constructor(t=[]){this._elements=new Set,t.forEach(l=>this._elements.add(l))}add(t){this._elements.add(t)}toArray(){return Array.from(this._elements)}toString(){return Array.from(this._elements).filter(Boolean).map(t=>t.toString()).join("")}};L.default=k});var p=o(D=>{"use strict";Object.defineProperty(D,"__esModule",{value:!0});var re=new Map;D.default=re});var P=o(S=>{"use strict";Object.defineProperty(S,"__esModule",{value:!0});var A=class{get value(){return this._escape?this._value.replace(/&/g,"&").replace(//g,">"):this._value}constructor(t,l=!1){this._escape=l,this._value=t}toString(){return this.value}};S.default=A});var j=o(m=>{"use strict";var ce=m&&m.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(m,"__esModule",{value:!0});var ie=ce(N()),oe=["area","base","br","col","embed","hr","img","input","link","meta","param","source","track","wbr"],I=class{get attributes(){return this._attributes}get children(){return this._children}get name(){return this._name}get props(){return this._props}constructor(t,l={},r="",i=[]){this._attributes={},this._name=t,this._attributes=l,this._props=r,this._children=new ie.default(i)}toString(){let t=Object.entries(this._attributes),l=t.length>0?" "+t.map(([i,T])=>{if(typeof T=="string")return`${i}="${T}"`;if(typeof T=="boolean")return T?i:""}).join(" "):"";if(oe.includes(this._name))return`<${this._name}${l} />`;let r=this._children.toString();return`<${this._name}${l}>${r}`}};m.default=I});var C=o(f=>{"use strict";var J=f&&f.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(f,"__esModule",{value:!0});var ne=J(P()),F=J(j()),O=class{static render(t){return t.filter(Boolean).map(l=>l.toString()).join("")}static registry(t,l=new Set){return t.forEach(r=>{r instanceof F.default&&(["html","head","body"].includes(r.name)||l.add(r),r.name!=="head"&&r.children.length>0&&this.registry(r.children.toArray(),l))}),l}static createElement(t,l,r,i=[]){return new F.default(t,l,r,i)}static createText(t,l=!0){return new ne.default(t,l)}};f.default=O});var R=o(d=>{"use strict";var $=d&&d.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(d,"__esModule",{value:!0});var pe=$(_()),M=$(p()),U=$(C()),B=class{bindings(){let t=U.default.registry(this.template());return`{ ${Array.from(t.values()).map((r,i)=>r.props!=="{ }"?`'${i}': ${r.props}`:"").filter(r=>r!=="").join(", ")} }`}render(t={}){M.default.set("props",t||{}),M.default.set("env",Object.assign(Object.assign({},process.env||{}),{BUILD_ID:this.id(),APP_DATA:btoa(JSON.stringify(Object.assign(Object.assign({},Object.fromEntries(M.default.entries())),{env:Object.assign(Object.assign({},Object.fromEntries(Object.entries(process.env||{}).filter(i=>i[0].startsWith("PUBLIC_")))),{BUILD_ID:this.id()})})))}));let l=this.template(),r=U.default.render(l).trim();if(!r.toLowerCase().startsWith(" tag.");return`
+${r}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:Array.isArray(t)&&t.every(l=>typeof l=="object"&&typeof l.nodeType=="number")?t:[U.default.createText(String(t))]}};d.default=B});var G=o(x=>{"use strict";Object.defineProperty(x,"__esModule",{value:!0});x.TempleEmitter=void 0;var y=class{emit(t,l){return this}on(t,l){return this}once(t,l){return this}unbind(t,l){return this}};x.TempleEmitter=y;var me=new y;x.default=me});var Y=o(h=>{"use strict";var fe=h&&h.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(h,"__esModule",{value:!0});var de=fe(p());function xe(a){let t=de.default.get("env")||{};return a?t[a]||null:t}h.default=xe});var z=o(u=>{"use strict";var he=u&&u.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(u,"__esModule",{value:!0});u.default=be;var ue=he(p());function be(){return ue.default.get("props")||{}}});var K=o(c=>{"use strict";var Te=c&&c.__createBinding||(Object.create?function(a,t,l,r){r===void 0&&(r=l);var i=Object.getOwnPropertyDescriptor(t,l);(!i||("get"in i?!t.__esModule:i.writable||i.configurable))&&(i={enumerable:!0,get:function(){return t[l]}}),Object.defineProperty(a,r,i)}:function(a,t,l,r){r===void 0&&(r=l),a[r]=t[l]}),ge=c&&c.__setModuleDefault||(Object.create?function(a,t){Object.defineProperty(a,"default",{enumerable:!0,value:t})}:function(a,t){a.default=t}),ye=c&&c.__importStar||function(a){if(a&&a.__esModule)return a;var t={};if(a!=null)for(var l in a)l!=="default"&&Object.prototype.hasOwnProperty.call(a,l)&&Te(t,a,l);return ge(t,a),t},n=c&&c.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(c,"__esModule",{value:!0});c.TempleText=c.TempleException=c.TempleEmitter=c.TempleElement=c.TempleRegistry=c.TempleDocument=c.TempleCollection=c.props=c.emitter=c.env=c.data=void 0;var ve=n(_());c.TempleException=ve.default;var Ee=n(N());c.TempleCollection=Ee.default;var we=n(R());c.TempleDocument=we.default;var _e=n(C());c.TempleRegistry=_e.default;var ke=n(j());c.TempleElement=ke.default;var V=ye(G());c.emitter=V.default;Object.defineProperty(c,"TempleEmitter",{enumerable:!0,get:function(){return V.TempleEmitter}});var Le=n(P());c.TempleText=Le.default;var Ne=n(p());c.data=Ne.default;var De=n(Y());c.env=De.default;var Ae=n(z());c.props=Ae.default});var q=o((Je,Q)=>{Q.exports={...K()}});var Pe={};le(Pe,{default:()=>v});var e=H(q()),b=H(q());var s=function(a,...t){let l=Se(a);for(let r=0;r{document.getElementsByTagName("panel-layout")[0].toggle("left")};return[e.TempleRegistry.createText(`
+`,!1),e.TempleRegistry.createElement("html",{},"{ }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("head",{},"{ }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{charset:"utf-8"},"{ 'charset': `utf-8` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"viewport",content:"width=device-width, initial-scale=1"},"{ 'name': `viewport`, 'content': `width=device-width, initial-scale=1` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("title",{},"{ }",[...this._toNodeList(l)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"description",content:r},"{ 'name': `description`, 'content': description }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:title",content:l},"{ 'property': `og:title`, 'content': title }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:description",content:r},"{ 'property': `og:description`, 'content': description }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:image",content:"https://ossphilippines.github.io/temple/temple-logo.png"},"{ 'property': `og:image`, 'content': `https://ossphilippines.github.io/temple/temple-logo.png` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:url",content:`https://ossphilippines.github.io/temple${t}`},"{ 'property': `og:url`, 'content': `https://ossphilippines.github.io/temple${url}` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:type",content:"website"},"{ 'property': `og:type`, 'content': `website` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:card",content:"summary"},"{ 'name': `twitter:card`, 'content': `summary` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:site",content:"@OSSPhilippines"},"{ 'name': `twitter:site`, 'content': `@OSSPhilippines` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:title",content:l},"{ 'name': `twitter:title`, 'content': title }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:description",content:r},"{ 'name': `twitter:description`, 'content': description }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:image",content:"https://ossphilippines.github.io/temple/temple-logo.png"},"{ 'name': `twitter:image`, 'content': `https://ossphilippines.github.io/temple/temple-logo.png` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"favicon",href:"/temple/favicon.ico"},"{ 'rel': `favicon`, 'href': `/temple/favicon.ico` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"shortcut icon",type:"image/png",href:"/temple/favicon.png"},"{ 'rel': `shortcut icon`, 'type': `image/png`, 'href': `/temple/favicon.png` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/fontawesome/all.css"},"{ 'rel': `stylesheet`, 'type': `text/css`, 'href': `/temple/styles/fontawesome/all.css` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/global.css"},"{ 'rel': `stylesheet`, 'type': `text/css`, 'href': `/temple/styles/global.css` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:`/temple/build/client/${(0,b.env)("BUILD_ID")}.css`},"{ 'rel': `stylesheet`, 'type': `text/css`, 'href': `/temple/build/client/${env('BUILD_ID')}.css` }"),e.TempleRegistry.createText(`
   
-  `,!1),e.TempleRegistry.createElement("script",{"data-app":(0,b.env)("APP_DATA"),src:`/temple/build/client/${(0,b.env)("BUILD_ID")}.js`}),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("script",{"data-app":(0,b.env)("APP_DATA"),src:`/temple/build/client/${(0,b.env)("BUILD_ID")}.js`},"{ 'data-app': env('APP_DATA'), 'src': `/temple/build/client/${env('BUILD_ID')}.js` }"),e.TempleRegistry.createText(`
   `,!1),...(0,b.env)("NODE_ENV")==="development"?[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("script",{src:"/dev.js"}),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("script",{src:"/dev.js"},"{ 'src': `/dev.js` }"),e.TempleRegistry.createText(`
   `,!1)]:[],e.TempleRegistry.createText(`
 `,!1)]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("body",{class:"dark panel with-head with-left with-right"},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("header",{class:"head panel-head"},[e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("i",{class:"menu fas fa-fw fa-bars",click:n},[]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("a",{href:"/temple"},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("img",{src:"/temple/temple-icon.png",alt:"Temple Logo"}),e.TempleRegistry.createText(`
-  `,!1)]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("h3",{},[e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple"},[e.TempleRegistry.createText("Temple",!1)])]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("nav",{},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple/docs/index.html"},[e.TempleRegistry.createText("Docs",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{class:"github",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-github"},[]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("body",{class:"dark bg-t-0 tx-t1 arial"},"{ 'class': `dark bg-t-0 tx-t1 arial` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("panel-layout",{},"{ }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("panel-head",{},"{ }",[e.TempleRegistry.createElement("menu",{class:"flex flex-center-y px-20 py-15 m-0 bg-t-1"},"{ 'class': `flex flex-center-y px-20 py-15 m-0 bg-t-1` }",[e.TempleRegistry.createText(`
+  `,!1),...t!=="/temple/index.html"&&t!=="/temple/500.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-bars cursor-pointer py-5 pr-10 none md-inline-block tx-t-1",click:i},"{ 'class': `fas fa-fw fa-bars cursor-pointer py-5 pr-10 none md-inline-block tx-t-1`, 'click': toggle }",[]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("div",{class:"flex-grow"},"{ 'class': `flex-grow` }",[]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{href:"/temple"},"{ 'href': `/temple` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("img",{alt:"Temple Logo",class:"h-26 mr-10",src:"/temple/temple-icon.png"},"{ 'alt': `Temple Logo`, 'class': `h-26 mr-10`, 'src': `/temple/temple-icon.png` }"),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{class:"npm",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-npm text-white"},[]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("h3",{class:"flex-grow tx-uppercase"},"{ 'class': `flex-grow tx-uppercase` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple"},"{ 'class': `tx-white`, 'href': `/temple` }",[e.TempleRegistry.createText("Temple",!1)]),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{class:"discord",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-discord text-white"},[]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("nav",{class:"flex flex-center-y"},"{ 'class': `flex flex-center-y` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple/docs/index.html"},"{ 'class': `tx-white`, 'href': `/temple/docs/index.html` }",[e.TempleRegistry.createText("Docs",!1)]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"tx-t-1 tx-5xl ml-10",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},"{ 'class': `tx-t-1 tx-5xl ml-10`, 'href': `https://github.com/OSSPhilippines/temple`, 'target': `_blank` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-github"},"{ 'class': `fab fa-github` }",[]),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
-  `,!1)]),e.TempleRegistry.createText(`
-`,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("aside",{class:"left panel-left"},[e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("header",{},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("img",{src:"/temple/temple-icon.png",alt:"Temple Logo"}),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"bg-h-cb3837 pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},"{ 'class': `bg-h-cb3837 pill tx-t-1 tx-lg ml-5 p-5 tx-center`, 'href': `https://www.npmjs.com/package/@ossph/temple`, 'target': `_blank` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-npm text-white"},"{ 'class': `fab fa-npm text-white` }",[]),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("h3",{},[e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple"},[e.TempleRegistry.createText("Temple",!1)])]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("i",{class:"toggle fas fa-fw fa-chevron-left",click:n},[]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"bg-h-7289da pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},"{ 'class': `bg-h-7289da pill tx-t-1 tx-lg ml-5 p-5 tx-center`, 'href': `https://discord.gg/open-source-software-ph-905496362982981723`, 'target': `_blank` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-discord text-white"},"{ 'class': `fab fa-discord text-white` }",[]),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]),e.TempleRegistry.createText(`
+`,!1)])]),e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("panel-left",{},"{ }",[e.TempleRegistry.createElement("header",{class:"flex flex-center-y bg-t-2 py-15 pr-5 pl-10"},"{ 'class': `flex flex-center-y bg-t-2 py-15 pr-5 pl-10` }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("a",{href:"/temple"},"{ 'href': `/temple` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("img",{class:"h-26 mr-10",src:"/temple/temple-icon.png",alt:"Temple Logo"},"{ 'class': `h-26 mr-10`, 'src': `/temple/temple-icon.png`, 'alt': `Temple Logo` }"),e.TempleRegistry.createText(`
   `,!1)]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("nav",{},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("h6",{},[e.TempleRegistry.createText("Introduction",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/index.html"},[e.TempleRegistry.createText("Documentation",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/getting-started.html"},[e.TempleRegistry.createText("Getting Started",!1)]),e.TempleRegistry.createText(`
-
-    `,!1),e.TempleRegistry.createElement("h6",{},[e.TempleRegistry.createText("Features",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/markup-syntax.html"},[e.TempleRegistry.createText("Markup Syntax",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/state-management.html"},[e.TempleRegistry.createText("State Management",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/component-strategy.html"},[e.TempleRegistry.createText("Component Strategy",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/compiler-api.html"},[e.TempleRegistry.createText("Compiler API",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/client-api.html"},[e.TempleRegistry.createText("Client API",!1)]),e.TempleRegistry.createText(`
-
-    `,!1),e.TempleRegistry.createElement("h6",{},[e.TempleRegistry.createText("Usage",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/template-engine.html"},[e.TempleRegistry.createText("Template Engine",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/single-page.html"},[e.TempleRegistry.createText("Single Page App",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/static-site.html"},[e.TempleRegistry.createText("Static Site Generator",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/component-publisher.html"},[e.TempleRegistry.createText("Component Publisher",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/developer-tools.html"},[e.TempleRegistry.createText("Developer Tools",!1)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("h3",{class:"flex-grow m-0 tx-uppercase"},"{ 'class': `flex-grow m-0 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple"},"{ 'class': `tx-white`, 'href': `/temple` }",[e.TempleRegistry.createText("Temple",!1)]),e.TempleRegistry.createText(`
   `,!1)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-left cursor-pointer none md-inline-block",click:i},"{ 'class': `fas fa-fw fa-chevron-left cursor-pointer none md-inline-block`, 'click': toggle }",[]),e.TempleRegistry.createText(`
 `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("aside",{class:"panel-right right"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("h6",{},[...this._toNodeList(c("On this page"))]),e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("nav",{},[e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("a",{href:"#document"},[...this._toNodeList(c("Document"))]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("a",{href:"#template"},[...this._toNodeList(c("Template"))]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("a",{href:"#component"},[...this._toNodeList(c("Component"))]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("nav",{},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("a",{href:"#strat-1"},[...this._toNodeList(c("Strategy 1"))]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("a",{href:"#strat-2"},[...this._toNodeList(c("Strategy 2"))]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("a",{href:"#strat-3"},[...this._toNodeList(c("Strategy 3"))]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("a",{href:"#strat-4"},[...this._toNodeList(c("Strategy 4"))]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("a",{href:"#fouc"},[...this._toNodeList(c("FOUC"))]),e.TempleRegistry.createText(`
-      `,!1)]),e.TempleRegistry.createText(`
+`,!1),e.TempleRegistry.createElement("nav",{class:"bg-t-1 scroll-auto h-calc-full-60"},"{ 'class': `bg-t-1 scroll-auto h-calc-full-60` }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("h6",{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-0 pt-20 pb-10 pl-10 tx-uppercase"},"{ 'class': `bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-0 pt-20 pb-10 pl-10 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),...this._toNodeList(s("Introduction")),e.TempleRegistry.createText(`
+  `,!1)]),e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/index.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/index.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/index.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("Documentation")),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("panel-main",{class:"panel-main"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("div",{class:"docs container"},[e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("h1",{},[...this._toNodeList(c("Component Strategy"))]),e.TempleRegistry.createText(`
-
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          There are three types of components in Temple: Document, 
-          Template, and Component. Each type of component has a 
-          different strategy for rendering and updating the DOM. The 
-          Document component is the root component of the application 
-          and is responsible for rendering the entire application. The 
-          Template component is a reusable component that can be used 
-          in multiple places in the application. The Component component 
-          is a custom component that can be used to create complex UI 
-          elements.
-        `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/index.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/index.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("Documentation")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/getting-started.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/getting-started.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/getting-started.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("Getting Started")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/getting-started.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/getting-started.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("Getting Started")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("a",{name:"document"},[]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("h2",{},[...this._toNodeList(c("Document"))]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("h6",{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},"{ 'class': `bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),...this._toNodeList(s("Features")),e.TempleRegistry.createText(`
+  `,!1)]),e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/markup-syntax.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/markup-syntax.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/markup-syntax.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("Markup Syntax")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/markup-syntax.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/markup-syntax.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("Markup Syntax")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/state-management.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/state-management.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/state-management.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("State Management")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/state-management.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/state-management.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("State Management")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/component-strategy.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/component-strategy.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/component-strategy.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("Component Strategy")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-strategy.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/component-strategy.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("Component Strategy")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/compiler-api.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/compiler-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/compiler-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("Compiler API")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/compiler-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/compiler-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("Compiler API")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/client-api.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/client-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/client-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("Client API")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/client-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/client-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("Client API")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          A document denoted by files with the 
-          `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText(".dtml",!1)]),e.TempleRegistry.createText(` extension, is the root of
-          each page view that should include the document markup 
-          starting with `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList("")]),e.TempleRegistry.createText(`. While 
-          it looks like another Temple component, there are some key 
-          differences in how it is used.
+  `,!1),e.TempleRegistry.createElement("h6",{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},"{ 'class': `bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),...this._toNodeList(s("Usage")),e.TempleRegistry.createText(`
+  `,!1)]),e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/template-engine.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/template-engine.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/template-engine.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("Template Engine")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/template-engine.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/template-engine.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("Template Engine")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/single-page.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/single-page.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/single-page.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("Single Page App")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/single-page.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/single-page.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("Single Page App")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/static-site.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/static-site.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/static-site.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("Static Site Generator")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/static-site.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/static-site.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("Static Site Generator")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/component-publisher.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/component-publisher.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/component-publisher.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("Component Publisher")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-publisher.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/component-publisher.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("Component Publisher")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/developer-tools.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold mb-100",href:"/temple/docs/developer-tools.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold mb-100`, 'href': `/temple/docs/developer-tools.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("Developer Tools")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 mb-100",href:"/temple/docs/developer-tools.html"},"{ 'class': `block tx-t-1 py-10 pl-10 mb-100`, 'href': `/temple/docs/developer-tools.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("Developer Tools")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+`,!1)])]),e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("panel-right",{},"{ }",[e.TempleRegistry.createText(`
+        `,!1),e.TempleRegistry.createElement("menu",{class:"m-0 px-10 py-20 h-calc-full-40 bg-t-2 scroll-auto"},"{ 'class': `m-0 px-10 py-20 h-calc-full-40 bg-t-2 scroll-auto` }",[e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("h6",{class:"tx-muted tx-14 mb-0 mt-0 pb-10 tx-uppercase"},"{ 'class': `tx-muted tx-14 mb-0 mt-0 pb-10 tx-uppercase` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(s("On this page")),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("nav",{class:"tx-14 tx-lh-32"},"{ 'class': `tx-14 tx-lh-32` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-0",href:"#document"},"{ 'class': `block tx-t-0`, 'href': `#document` }",[...this._toNodeList(s("Document"))]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-0",href:"#template"},"{ 'class': `block tx-t-0`, 'href': `#template` }",[...this._toNodeList(s("Template"))]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-0",href:"#component"},"{ 'class': `block tx-t-0`, 'href': `#component` }",[...this._toNodeList(s("Component"))]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("nav",{class:"pl-20"},"{ 'class': `pl-20` }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1",href:"#strat-1"},"{ 'class': `block tx-t-1`, 'href': `#strat-1` }",[...this._toNodeList(s("Strategy 1"))]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1",href:"#strat-2"},"{ 'class': `block tx-t-1`, 'href': `#strat-2` }",[...this._toNodeList(s("Strategy 2"))]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1",href:"#strat-3"},"{ 'class': `block tx-t-1`, 'href': `#strat-3` }",[...this._toNodeList(s("Strategy 3"))]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1",href:"#strat-4"},"{ 'class': `block tx-t-1`, 'href': `#strat-4` }",[...this._toNodeList(s("Strategy 4"))]),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-0",href:"#fouc"},"{ 'class': `block tx-t-0`, 'href': `#fouc` }",[...this._toNodeList(s("FOUC"))]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
         `,!1)]),e.TempleRegistry.createText(`
-
-        `,!1),e.TempleRegistry.createElement("ul",{},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-              A document logic (`,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList("
-          
-            
-              
-              {title}
-            
-            
-              
          {title}
          
-            
-          
-        `)]),e.TempleRegistry.createText(`
-
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          You can create a template for the head of your
-          document and then import it. This allows you to
-          reuse the head markup in multiple documents.
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("ide-code",{trim:!0,detab:12},"{ 'trim': true, 'detab': 12 }",[...this._toNodeList(`
+            
+            
+              
+                
+                {title}
+              
+              
+                
          {title}
          
+              
+            
+          `)]),e.TempleRegistry.createText(`
+
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            You can create a template for the head of your
+            document and then import it. This allows you to
+            reuse the head markup in multiple documents.
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("ide-app",{panel:250,title:"Using Templates"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("div",{class:"panel-head"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("div",{class:"tabs"},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("tui-tab",{class:"tab active",group:"templates",selector:"#page2-dtml"},[e.TempleRegistry.createText(`
-                src/page.dtml
-              `,!1)]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("tui-tab",{class:"tab",group:"templates",selector:"#head-tml"},[e.TempleRegistry.createText(`
-                src/head.tml
+          `,!1),e.TempleRegistry.createElement("ide-app",{height:250,title:"Using Templates",class:"py-20"},"{ 'height': 250, 'title': `Using Templates`, 'class': `py-20` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("app-head",{},"{ }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("div",{class:"flex scroll-x-auto pt-5 pl-5"},"{ 'class': `flex scroll-x-auto pt-5 pl-5` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("tui-tab",{on:!0,class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"template",selector:"#template-page-dtml"},"{ 'on': true, 'class': `relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0`, 'active': `bg-black tx-white`, 'inactive': `bg-t-1 tx-muted`, 'group': `template`, 'selector': `#template-page-dtml` }",[e.TempleRegistry.createText(`
+                  src/page.dtml
+                `,!1)]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("tui-tab",{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"template",selector:"#template-head-tml"},"{ 'class': `relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0`, 'active': `bg-black tx-white`, 'inactive': `bg-t-1 tx-muted`, 'group': `template`, 'selector': `#template-head-tml` }",[e.TempleRegistry.createText(`
+                  src/head.tml
+                `,!1)]),e.TempleRegistry.createText(`
               `,!1)]),e.TempleRegistry.createText(`
             `,!1)]),e.TempleRegistry.createText(`
-          `,!1)]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("div",{class:"panel-left"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("h5",{class:"folder"},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-down"},[]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("span",{},[e.TempleRegistry.createText("src",!1)]),e.TempleRegistry.createText(`
-            `,!1)]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("tui-tab",{class:"shift-1 block active",group:"templates",selector:"#page2-dtml"},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},[]),e.TempleRegistry.createText(`
-              page.dtml
-            `,!1)]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("tui-tab",{class:"shift-1 block",group:"templates",selector:"#head-tml"},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},[]),e.TempleRegistry.createText(`
-              head.tml
+            `,!1),e.TempleRegistry.createElement("app-left",{},"{ }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("h5",{class:"p-5"},"{ 'class': `p-5` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-down"},"{ 'class': `fas fa-fw fa-chevron-down` }",[]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("span",{},"{ }",[e.TempleRegistry.createText("src",!1)]),e.TempleRegistry.createText(`
+              `,!1)]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("tui-tab",{on:!0,class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"template",selector:"#template-page-dtml"},"{ 'on': true, 'class': `pl-15 pt-10 block`, 'active': `tx-white`, 'inactive': `tx-muted`, 'group': `template`, 'selector': `#template-page-dtml` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},"{ 'class': `fas fa-fw fa-file` }",[]),e.TempleRegistry.createText(`
+                page.dtml
+              `,!1)]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("tui-tab",{class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"template",selector:"#template-head-tml"},"{ 'class': `pl-15 pt-10 block`, 'active': `tx-white`, 'inactive': `tx-muted`, 'group': `template`, 'selector': `#template-head-tml` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},"{ 'class': `fas fa-fw fa-file` }",[]),e.TempleRegistry.createText(`
+                head.tml
+              `,!1)]),e.TempleRegistry.createText(`
             `,!1)]),e.TempleRegistry.createText(`
-          `,!1)]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("div",{class:"panel-main"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("main",{},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("ide-code",{id:"page2-dtml",numbers:!0,trim:!0,detab:16},[...this._toNodeList(`
+            `,!1),e.TempleRegistry.createElement("app-main",{},"{ }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("ide-code",{id:"template-page-dtml",numbers:!0,trim:!0,detab:16},"{ 'id': `template-page-dtml`, 'numbers': true, 'trim': true, 'detab': 16 }",[...this._toNodeList(`
                 
                 
                 
               `)]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("ide-code",{id:"header3-tml",style:"display:none",numbers:!0,trim:!0,detab:16},[...this._toNodeList(`
+              `,!1),e.TempleRegistry.createElement("ide-code",{id:"strat-1-header-tml",style:"display:none",numbers:!0,trim:!0,detab:16},"{ 'id': `strat-1-header-tml`, 'style': `display:none`, 'numbers': true, 'trim': true, 'detab': 16 }",[...this._toNodeList(`
                 
          
                   Logo
                   
          Brand
          
                 
          
               `)]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("ide-code",{id:"footer3-tml",style:"display:none",numbers:!0,trim:!0,detab:16},[...this._toNodeList(`
+              `,!1),e.TempleRegistry.createElement("ide-code",{id:"strat-1-footer-tml",style:"display:none",numbers:!0,trim:!0,detab:16},"{ 'id': `strat-1-footer-tml`, 'style': `display:none`, 'numbers': true, 'trim': true, 'detab': 16 }",[...this._toNodeList(`
                 
          
                   About
                   © 2025
@@ -415,53 +537,53 @@ ${l}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:
               `)]),e.TempleRegistry.createText(`
             `,!1)]),e.TempleRegistry.createText(`
           `,!1)]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("a",{name:"strat-2"},[]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("h3",{},[...this._toNodeList(c("Strategy 2: Shallow Components"))]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("a",{name:"strat-2"},"{ 'name': `strat-2` }",[]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("h3",{class:"tx-t-1 tx-uppercase tx-22 pt-40 pb-20"},"{ 'class': `tx-t-1 tx-uppercase tx-22 pt-40 pb-20` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(s("Strategy 2: Shallow Components")),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          This strategy uses components that do not have a 
-          `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList("
@@ -161,7 +275,7 @@ ${s}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:
                 
                 
          {title}
          
               `)]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("ide-code",{id:"package-json",style:"display:none",lang:"js",numbers:!0,trim:!0,detab:16},[...this._toNodeList(`
+              `,!1),e.TempleRegistry.createElement("ide-code",{id:"package-json",style:"display:none",lang:"js",numbers:!0,trim:!0,detab:16},"{ 'id': `package-json`, 'style': `display:none`, 'lang': `js`, 'numbers': true, 'trim': true, 'detab': 16 }",[...this._toNodeList(`
                 {
                   "name": "my-project",
                   "version": "1.0.0",
@@ -170,10 +284,10 @@ ${s}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:
                     "build": "ts-node ./src/build.ts"
                   },
                   "dependencies": {
-                    "@ossph/temple": "0.1.4"
+                    "@ossph/temple": "0.1.6"
                   },
                   "devDependencies": {
-                    "@ossph/temple-dev": "0.1.4",
+                    "@ossph/temple-dev": "0.1.6",
                     "@types/node": "22.1.0",
                     "ts-node": "10.9.2",
                     "typescript": "5.5.4"
@@ -182,28 +296,28 @@ ${s}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:
               `)]),e.TempleRegistry.createText(`
             `,!1)]),e.TempleRegistry.createText(`
           `,!1)]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          To test the build script and see the results, run the 
-          following command in terminal.
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("ide-code",{lang:"bash"},[e.TempleRegistry.createText(`
-          npm run build
-        `,!1)]),e.TempleRegistry.createText(`
-        
-        `,!1),e.TempleRegistry.createElement("nav",{class:"pager"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("a",{class:"prev",href:"/temple/docs/static-site.html"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-left"},[]),e.TempleRegistry.createText(`
-            Static Site Generator
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            To test the build script and see the results, run the 
+            following command in terminal.
           `,!1)]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("a",{class:"next",href:"/temple/docs/developer-tools.html"},[e.TempleRegistry.createText(`
-            Developer Tools
-            `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-right"},[]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("ide-code",{lang:"bash"},"{ 'lang': `bash` }",[e.TempleRegistry.createText(`
+            npm run build
+          `,!1)]),e.TempleRegistry.createText(`
+          
+          `,!1),e.TempleRegistry.createElement("nav",{class:"flex"},"{ 'class': `flex` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"tx-primary py-40",href:"/temple/docs/static-site.html"},"{ 'class': `tx-primary py-40`, 'href': `/temple/docs/static-site.html` }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-left tx-t-1"},"{ 'class': `fas fa-fw fa-chevron-left tx-t-1` }",[]),e.TempleRegistry.createText(`
+              `,!1),...this._toNodeList(r("Static Site Generator")),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"flex-grow tx-right tx-primary py-40",href:"/temple/docs/developer-tools.html"},"{ 'class': `flex-grow tx-right tx-primary py-40`, 'href': `/temple/docs/developer-tools.html` }",[e.TempleRegistry.createText(`
+              `,!1),...this._toNodeList(r("Developer Tools")),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-right tx-t-1"},"{ 'class': `fas fa-fw fa-chevron-right tx-t-1` }",[]),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
           `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("footer",{class:"foot"},"{ 'class': `foot` }",[]),e.TempleRegistry.createText(`
         `,!1)]),e.TempleRegistry.createText(`
       `,!1)]),e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("footer",{class:"foot"},[]),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
   `,!1)]),e.TempleRegistry.createText(`
-`,!1)])]}};return ce(We);})();
+`,!1)])]}};return se(Se);})();
diff --git a/docs/build/server/a52462b5d1f8879f7b73.js b/docs/build/server/a52462b5d1f8879f7b73.js
new file mode 100644
index 0000000..6420cfe
--- /dev/null
+++ b/docs/build/server/a52462b5d1f8879f7b73.js
@@ -0,0 +1,438 @@
+var TempleAPI=(()=>{var X=Object.create;var g=Object.defineProperty;var Z=Object.getOwnPropertyDescriptor;var ee=Object.getOwnPropertyNames;var te=Object.getPrototypeOf,ae=Object.prototype.hasOwnProperty;var n=(a,t)=>()=>(t||a((t={exports:{}}).exports,t),t.exports),le=(a,t)=>{for(var l in t)g(a,l,{get:t[l],enumerable:!0})},U=(a,t,l,r)=>{if(t&&typeof t=="object"||typeof t=="function")for(let i of ee(t))!ae.call(a,i)&&i!==l&&g(a,i,{get:()=>t[i],enumerable:!(r=Z(t,i))||r.enumerable});return a};var F=(a,t,l)=>(l=a!=null?X(te(a)):{},U(t||!a||!a.__esModule?g(l,"default",{value:a,enumerable:!0}):l,a)),se=a=>U(g({},"__esModule",{value:!0}),a);var w=n(v=>{"use strict";Object.defineProperty(v,"__esModule",{value:!0});var E=class extends Error{static for(t,...l){return l.forEach(function(r){t=t.replace("%s",r)}),new this(t)}static forErrorsFound(t){let l=new this("Invalid Parameters");return l.errors=t,l}static require(t,l,...r){if(!t){for(let i of r)l=l.replace("%s",i);throw new this(l)}}constructor(t,l=500){super(),this.errors={},this.start=0,this.end=0,this.message=t,this.name=this.constructor.name,this.code=l}withCode(t){return this.code=t,this}withPosition(t,l){return this.start=t,this.end=l,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};v.default=E});var N=n(L=>{"use strict";Object.defineProperty(L,"__esModule",{value:!0});var k=class{get length(){return this._elements.size}constructor(t=[]){this._elements=new Set,t.forEach(l=>this._elements.add(l))}add(t){this._elements.add(t)}toArray(){return Array.from(this._elements)}toString(){return Array.from(this._elements).filter(Boolean).map(t=>t.toString()).join("")}};L.default=k});var p=n(j=>{"use strict";Object.defineProperty(j,"__esModule",{value:!0});var re=new Map;j.default=re});var P=n(D=>{"use strict";Object.defineProperty(D,"__esModule",{value:!0});var S=class{get value(){return this._escape?this._value.replace(/&/g,"&").replace(//g,">"):this._value}constructor(t,l=!1){this._escape=l,this._value=t}toString(){return this.value}};D.default=S});var O=n(f=>{"use strict";var ce=f&&f.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(f,"__esModule",{value:!0});var ie=ce(N()),ne=["area","base","br","col","embed","hr","img","input","link","meta","param","source","track","wbr"],A=class{get attributes(){return this._attributes}get children(){return this._children}get name(){return this._name}get props(){return this._props}constructor(t,l={},r="",i=[]){this._attributes={},this._name=t,this._attributes=l,this._props=r,this._children=new ie.default(i)}toString(){let t=Object.entries(this._attributes),l=t.length>0?" "+t.map(([i,b])=>{if(typeof b=="string")return`${i}="${b}"`;if(typeof b=="boolean")return b?i:""}).join(" "):"";if(ne.includes(this._name))return`<${this._name}${l} />`;let r=this._children.toString();return`<${this._name}${l}>${r}`}};f.default=A});var M=n(m=>{"use strict";var G=m&&m.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(m,"__esModule",{value:!0});var oe=G(P()),J=G(O()),I=class{static render(t){return t.filter(Boolean).map(l=>l.toString()).join("")}static registry(t,l=new Set){return t.forEach(r=>{r instanceof J.default&&(["html","head","body"].includes(r.name)||l.add(r),r.name!=="head"&&r.children.length>0&&this.registry(r.children.toArray(),l))}),l}static createElement(t,l,r,i=[]){return new J.default(t,l,r,i)}static createText(t,l=!0){return new oe.default(t,l)}};m.default=I});var W=n(x=>{"use strict";var B=x&&x.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(x,"__esModule",{value:!0});var pe=B(w()),q=B(p()),C=B(M()),$=class{bindings(){let t=C.default.registry(this.template());return`{ ${Array.from(t.values()).map((r,i)=>r.props!=="{ }"?`'${i}': ${r.props}`:"").filter(r=>r!=="").join(", ")} }`}render(t={}){q.default.set("props",t||{}),q.default.set("env",Object.assign(Object.assign({},process.env||{}),{BUILD_ID:this.id(),APP_DATA:btoa(JSON.stringify(Object.assign(Object.assign({},Object.fromEntries(q.default.entries())),{env:Object.assign(Object.assign({},Object.fromEntries(Object.entries(process.env||{}).filter(i=>i[0].startsWith("PUBLIC_")))),{BUILD_ID:this.id()})})))}));let l=this.template(),r=C.default.render(l).trim();if(!r.toLowerCase().startsWith(" tag.");return`
+${r}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:Array.isArray(t)&&t.every(l=>typeof l=="object"&&typeof l.nodeType=="number")?t:[C.default.createText(String(t))]}};x.default=$});var R=n(d=>{"use strict";Object.defineProperty(d,"__esModule",{value:!0});d.TempleEmitter=void 0;var y=class{emit(t,l){return this}on(t,l){return this}once(t,l){return this}unbind(t,l){return this}};d.TempleEmitter=y;var fe=new y;d.default=fe});var V=n(h=>{"use strict";var me=h&&h.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(h,"__esModule",{value:!0});var xe=me(p());function de(a){let t=xe.default.get("env")||{};return a?t[a]||null:t}h.default=de});var z=n(u=>{"use strict";var he=u&&u.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(u,"__esModule",{value:!0});u.default=Te;var ue=he(p());function Te(){return ue.default.get("props")||{}}});var K=n(c=>{"use strict";var be=c&&c.__createBinding||(Object.create?function(a,t,l,r){r===void 0&&(r=l);var i=Object.getOwnPropertyDescriptor(t,l);(!i||("get"in i?!t.__esModule:i.writable||i.configurable))&&(i={enumerable:!0,get:function(){return t[l]}}),Object.defineProperty(a,r,i)}:function(a,t,l,r){r===void 0&&(r=l),a[r]=t[l]}),ge=c&&c.__setModuleDefault||(Object.create?function(a,t){Object.defineProperty(a,"default",{enumerable:!0,value:t})}:function(a,t){a.default=t}),ye=c&&c.__importStar||function(a){if(a&&a.__esModule)return a;var t={};if(a!=null)for(var l in a)l!=="default"&&Object.prototype.hasOwnProperty.call(a,l)&&be(t,a,l);return ge(t,a),t},o=c&&c.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(c,"__esModule",{value:!0});c.TempleText=c.TempleException=c.TempleEmitter=c.TempleElement=c.TempleRegistry=c.TempleDocument=c.TempleCollection=c.props=c.emitter=c.env=c.data=void 0;var _e=o(w());c.TempleException=_e.default;var Ee=o(N());c.TempleCollection=Ee.default;var ve=o(W());c.TempleDocument=ve.default;var we=o(M());c.TempleRegistry=we.default;var ke=o(O());c.TempleElement=ke.default;var Y=ye(R());c.emitter=Y.default;Object.defineProperty(c,"TempleEmitter",{enumerable:!0,get:function(){return Y.TempleEmitter}});var Le=o(P());c.TempleText=Le.default;var Ne=o(p());c.data=Ne.default;var je=o(V());c.env=je.default;var Se=o(z());c.props=Se.default});var H=n((Ge,Q)=>{Q.exports={...K()}});var Pe={};le(Pe,{default:()=>_});var e=F(H()),T=F(H());var s=function(a,...t){let l=De(a);for(let r=0;r{document.getElementsByTagName("panel-layout")[0].toggle("left")};return[e.TempleRegistry.createText(`
+`,!1),e.TempleRegistry.createElement("html",{},"{ }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("head",{},"{ }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{charset:"utf-8"},"{ 'charset': `utf-8` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"viewport",content:"width=device-width, initial-scale=1"},"{ 'name': `viewport`, 'content': `width=device-width, initial-scale=1` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("title",{},"{ }",[...this._toNodeList(l)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"description",content:r},"{ 'name': `description`, 'content': description }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:title",content:l},"{ 'property': `og:title`, 'content': title }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:description",content:r},"{ 'property': `og:description`, 'content': description }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:image",content:"https://ossphilippines.github.io/temple/temple-logo.png"},"{ 'property': `og:image`, 'content': `https://ossphilippines.github.io/temple/temple-logo.png` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:url",content:`https://ossphilippines.github.io/temple${t}`},"{ 'property': `og:url`, 'content': `https://ossphilippines.github.io/temple${url}` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:type",content:"website"},"{ 'property': `og:type`, 'content': `website` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:card",content:"summary"},"{ 'name': `twitter:card`, 'content': `summary` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:site",content:"@OSSPhilippines"},"{ 'name': `twitter:site`, 'content': `@OSSPhilippines` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:title",content:l},"{ 'name': `twitter:title`, 'content': title }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:description",content:r},"{ 'name': `twitter:description`, 'content': description }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:image",content:"https://ossphilippines.github.io/temple/temple-logo.png"},"{ 'name': `twitter:image`, 'content': `https://ossphilippines.github.io/temple/temple-logo.png` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"favicon",href:"/temple/favicon.ico"},"{ 'rel': `favicon`, 'href': `/temple/favicon.ico` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"shortcut icon",type:"image/png",href:"/temple/favicon.png"},"{ 'rel': `shortcut icon`, 'type': `image/png`, 'href': `/temple/favicon.png` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/fontawesome/all.css"},"{ 'rel': `stylesheet`, 'type': `text/css`, 'href': `/temple/styles/fontawesome/all.css` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/global.css"},"{ 'rel': `stylesheet`, 'type': `text/css`, 'href': `/temple/styles/global.css` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:`/temple/build/client/${(0,T.env)("BUILD_ID")}.css`},"{ 'rel': `stylesheet`, 'type': `text/css`, 'href': `/temple/build/client/${env('BUILD_ID')}.css` }"),e.TempleRegistry.createText(`
+  
+  `,!1),e.TempleRegistry.createElement("script",{"data-app":(0,T.env)("APP_DATA"),src:`/temple/build/client/${(0,T.env)("BUILD_ID")}.js`},"{ 'data-app': env('APP_DATA'), 'src': `/temple/build/client/${env('BUILD_ID')}.js` }"),e.TempleRegistry.createText(`
+  `,!1),...(0,T.env)("NODE_ENV")==="development"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("script",{src:"/dev.js"},"{ 'src': `/dev.js` }"),e.TempleRegistry.createText(`
+  `,!1)]:[],e.TempleRegistry.createText(`
+`,!1)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("body",{class:"dark bg-t-0 tx-t1 arial"},"{ 'class': `dark bg-t-0 tx-t1 arial` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("panel-layout",{},"{ }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("panel-head",{},"{ }",[e.TempleRegistry.createElement("menu",{class:"flex flex-center-y px-20 py-15 m-0 bg-t-1"},"{ 'class': `flex flex-center-y px-20 py-15 m-0 bg-t-1` }",[e.TempleRegistry.createText(`
+  `,!1),...t!=="/temple/index.html"&&t!=="/temple/500.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-bars cursor-pointer py-5 pr-10 none md-inline-block tx-t-1",click:i},"{ 'class': `fas fa-fw fa-bars cursor-pointer py-5 pr-10 none md-inline-block tx-t-1`, 'click': toggle }",[]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("div",{class:"flex-grow"},"{ 'class': `flex-grow` }",[]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{href:"/temple"},"{ 'href': `/temple` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("img",{alt:"Temple Logo",class:"h-26 mr-10",src:"/temple/temple-icon.png"},"{ 'alt': `Temple Logo`, 'class': `h-26 mr-10`, 'src': `/temple/temple-icon.png` }"),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("h3",{class:"flex-grow tx-uppercase"},"{ 'class': `flex-grow tx-uppercase` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple"},"{ 'class': `tx-white`, 'href': `/temple` }",[e.TempleRegistry.createText("Temple",!1)]),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("nav",{class:"flex flex-center-y"},"{ 'class': `flex flex-center-y` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple/docs/index.html"},"{ 'class': `tx-white`, 'href': `/temple/docs/index.html` }",[e.TempleRegistry.createText("Docs",!1)]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"tx-t-1 tx-5xl ml-10",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},"{ 'class': `tx-t-1 tx-5xl ml-10`, 'href': `https://github.com/OSSPhilippines/temple`, 'target': `_blank` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-github"},"{ 'class': `fab fa-github` }",[]),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"bg-h-cb3837 pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},"{ 'class': `bg-h-cb3837 pill tx-t-1 tx-lg ml-5 p-5 tx-center`, 'href': `https://www.npmjs.com/package/@ossph/temple`, 'target': `_blank` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-npm text-white"},"{ 'class': `fab fa-npm text-white` }",[]),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"bg-h-7289da pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},"{ 'class': `bg-h-7289da pill tx-t-1 tx-lg ml-5 p-5 tx-center`, 'href': `https://discord.gg/open-source-software-ph-905496362982981723`, 'target': `_blank` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-discord text-white"},"{ 'class': `fab fa-discord text-white` }",[]),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]),e.TempleRegistry.createText(`
+`,!1)])]),e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("panel-left",{},"{ }",[e.TempleRegistry.createElement("header",{class:"flex flex-center-y bg-t-2 py-15 pr-5 pl-10"},"{ 'class': `flex flex-center-y bg-t-2 py-15 pr-5 pl-10` }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("a",{href:"/temple"},"{ 'href': `/temple` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("img",{class:"h-26 mr-10",src:"/temple/temple-icon.png",alt:"Temple Logo"},"{ 'class': `h-26 mr-10`, 'src': `/temple/temple-icon.png`, 'alt': `Temple Logo` }"),e.TempleRegistry.createText(`
+  `,!1)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("h3",{class:"flex-grow m-0 tx-uppercase"},"{ 'class': `flex-grow m-0 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple"},"{ 'class': `tx-white`, 'href': `/temple` }",[e.TempleRegistry.createText("Temple",!1)]),e.TempleRegistry.createText(`
+  `,!1)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-left cursor-pointer none md-inline-block",click:i},"{ 'class': `fas fa-fw fa-chevron-left cursor-pointer none md-inline-block`, 'click': toggle }",[]),e.TempleRegistry.createText(`
+`,!1)]),e.TempleRegistry.createText(`
+`,!1),e.TempleRegistry.createElement("nav",{class:"bg-t-1 scroll-auto h-calc-full-60"},"{ 'class': `bg-t-1 scroll-auto h-calc-full-60` }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("h6",{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-0 pt-20 pb-10 pl-10 tx-uppercase"},"{ 'class': `bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-0 pt-20 pb-10 pl-10 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),...this._toNodeList(s("Introduction")),e.TempleRegistry.createText(`
+  `,!1)]),e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/index.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/index.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/index.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("Documentation")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/index.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/index.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("Documentation")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/getting-started.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/getting-started.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/getting-started.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("Getting Started")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/getting-started.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/getting-started.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("Getting Started")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+
+  `,!1),e.TempleRegistry.createElement("h6",{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},"{ 'class': `bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),...this._toNodeList(s("Features")),e.TempleRegistry.createText(`
+  `,!1)]),e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/markup-syntax.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/markup-syntax.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/markup-syntax.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("Markup Syntax")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/markup-syntax.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/markup-syntax.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("Markup Syntax")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/state-management.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/state-management.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/state-management.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("State Management")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/state-management.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/state-management.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("State Management")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/component-strategy.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/component-strategy.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/component-strategy.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("Component Strategy")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-strategy.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/component-strategy.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("Component Strategy")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/compiler-api.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/compiler-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/compiler-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("Compiler API")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/compiler-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/compiler-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("Compiler API")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/client-api.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/client-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/client-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("Client API")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/client-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/client-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("Client API")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+
+  `,!1),e.TempleRegistry.createElement("h6",{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},"{ 'class': `bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),...this._toNodeList(s("Usage")),e.TempleRegistry.createText(`
+  `,!1)]),e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/template-engine.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/template-engine.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/template-engine.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("Template Engine")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/template-engine.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/template-engine.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("Template Engine")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/single-page.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/single-page.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/single-page.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("Single Page App")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/single-page.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/single-page.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("Single Page App")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/static-site.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/static-site.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/static-site.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("Static Site Generator")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/static-site.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/static-site.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("Static Site Generator")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/component-publisher.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/component-publisher.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/component-publisher.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("Component Publisher")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-publisher.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/component-publisher.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("Component Publisher")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/developer-tools.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold mb-100",href:"/temple/docs/developer-tools.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold mb-100`, 'href': `/temple/docs/developer-tools.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("Developer Tools")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 mb-100",href:"/temple/docs/developer-tools.html"},"{ 'class': `block tx-t-1 py-10 pl-10 mb-100`, 'href': `/temple/docs/developer-tools.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(s("Developer Tools")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+`,!1)])]),e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("panel-right",{},"{ }",[e.TempleRegistry.createText(`
+        `,!1),e.TempleRegistry.createElement("menu",{class:"m-0 px-10 py-20 h-calc-full-40 bg-t-2 scroll-auto"},"{ 'class': `m-0 px-10 py-20 h-calc-full-40 bg-t-2 scroll-auto` }",[e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("h6",{class:"tx-muted tx-14 mb-0 mt-0 pb-10 tx-uppercase"},"{ 'class': `tx-muted tx-14 mb-0 mt-0 pb-10 tx-uppercase` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(s("On this page")),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("nav",{class:"tx-14 tx-lh-32"},"{ 'class': `tx-14 tx-lh-32` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-0",href:"#http"},"{ 'class': `block tx-t-0`, 'href': `#http` }",[e.TempleRegistry.createText(`
+              `,!1),...this._toNodeList(s("1. Add HTTP")),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-0",href:"#develop"},"{ 'class': `block tx-t-0`, 'href': `#develop` }",[e.TempleRegistry.createText(`
+              `,!1),...this._toNodeList(s("2. Add Dev Tools")),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-0",href:"#cache"},"{ 'class': `block tx-t-0`, 'href': `#cache` }",[e.TempleRegistry.createText(`
+              `,!1),...this._toNodeList(s("3. Add File Cache")),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-0",href:"#tailwind"},"{ 'class': `block tx-t-0`, 'href': `#tailwind` }",[e.TempleRegistry.createText(`
+              `,!1),...this._toNodeList(s("4. Add TailwindCSS")),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-0",href:"#express"},"{ 'class': `block tx-t-0`, 'href': `#express` }",[e.TempleRegistry.createText(`
+              `,!1),...this._toNodeList(s("5. Add ExpressJS")),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("nav",{class:"pl-20"},"{ 'class': `pl-20` }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1",href:"#http"},"{ 'class': `block tx-t-1`, 'href': `#http` }",[e.TempleRegistry.createText(`
+                `,!1),...this._toNodeList(s("1. Add HTTP")),e.TempleRegistry.createText(`
+              `,!1)]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1",href:"#develop"},"{ 'class': `block tx-t-1`, 'href': `#develop` }",[e.TempleRegistry.createText(`
+                `,!1),...this._toNodeList(s("2. Add Dev Tools")),e.TempleRegistry.createText(`
+              `,!1)]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1",href:"#cache"},"{ 'class': `block tx-t-1`, 'href': `#cache` }",[e.TempleRegistry.createText(`
+                `,!1),...this._toNodeList(s("3. Add File Cache")),e.TempleRegistry.createText(`
+              `,!1)]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1",href:"#tailwind"},"{ 'class': `block tx-t-1`, 'href': `#tailwind` }",[e.TempleRegistry.createText(`
+                `,!1),...this._toNodeList(s("4. Add TailwindCSS")),e.TempleRegistry.createText(`
+              `,!1)]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1",href:"#express"},"{ 'class': `block tx-t-1`, 'href': `#express` }",[e.TempleRegistry.createText(`
+                `,!1),...this._toNodeList(s("5. Add ExpressJS")),e.TempleRegistry.createText(`
+              `,!1)]),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
+        `,!1)]),e.TempleRegistry.createText(`
+      `,!1)]),e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("panel-main",{},"{ }",[e.TempleRegistry.createText(`
+        `,!1),e.TempleRegistry.createElement("api-docs",{},"{ }",[e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("h1",{class:"tx-primary tx-uppercase tx-30 py-20"},"{ 'class': `tx-primary tx-uppercase tx-30 py-20` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(s("Getting Started")),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
+
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            In most cases Temple will be used to render a front end from 
+            a server framework. In this example, we will use the native
+            NodeJS HTTP module to create a server that renders a page
+            using Temple. Start by replacing the 
+            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[...this._toNodeList("src/index.ts")]),e.TempleRegistry.createText(`
+            file with the following code. 
+            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0,lang:"js"},"{ 'inline': true, 'lang': `js` }",[...this._toNodeList("function() {}")]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
+
+          `,!1),e.TempleRegistry.createElement("ide-app",{title:"Terminal",class:"py-20"},"{ 'title': `Terminal`, 'class': `py-20` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("ide-code",{lang:"bash"},"{ 'lang': `bash` }",[e.TempleRegistry.createText(`
+              npm init -y && npm install --save @ossph/temple && npm install --save-dev ts-node typescript @types/node
+            `,!1)]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
+
+          `,!1),e.TempleRegistry.createElement("h2",{class:"tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0"},"{ 'class': `tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(s("1. Add HTTP")),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
+
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            In most cases Temple will be used to render a front end from 
+            a server framework. In this example, we will use the native
+            NodeJS HTTP module to create a server that renders a page
+            using Temple. Start by replacing the 
+            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[...this._toNodeList("src/index.ts")]),e.TempleRegistry.createText(`
+            file with the following code. 
+            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0,lang:"js"},"{ 'inline': true, 'lang': `js` }",[...this._toNodeList("function() {}")]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
+
+          `,!1),e.TempleRegistry.createElement("ide-app",{title:"src/index.ts",class:"py-20"},"{ 'title': `src/index.ts`, 'class': `py-20` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",numbers:!0,trim:!0,detab:14},"{ 'lang': `js`, 'numbers': true, 'trim': true, 'detab': 14 }",[...this._toNodeList(`
+              import temple from '@ossph/temple/compiler';
+              // make a temple compiler
+              const compiler = temple();
+              // render HTML
+              compiler.render('./src/page.dtml').then(console.log);
+              // render CSS
+              compiler.styles('./src/page.dtml').then(console.log);
+              // render JS
+              compiler.client('./src/page.dtml').then(console.log);
+            `)]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
+
+          `,!1),e.TempleRegistry.createElement("h3",{class:"tx-t-1 tx-uppercase tx-22 pt-40 pb-20"},"{ 'class': `tx-t-1 tx-uppercase tx-22 pt-40 pb-20` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(s("1. Add HTTP")),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
+
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            In most cases Temple will be used to render a front end from 
+            a server framework. In this example, we will use the native
+            NodeJS HTTP module to create a server that renders a page
+            using Temple. Start by replacing the 
+            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[...this._toNodeList("src/index.ts")]),e.TempleRegistry.createText(`
+            file with the following code. 
+            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0,lang:"js"},"{ 'inline': true, 'lang': `js` }",[...this._toNodeList("function() {}")]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
+
+          `,!1),e.TempleRegistry.createElement("ide-app",{title:"Basic Example",class:"py-20"},"{ 'title': `Basic Example`, 'class': `py-20` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("div",{class:"flex bg-h-EFEFEF h-full lg-block"},"{ 'class': `flex bg-h-EFEFEF h-full lg-block` }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("ide-code",{class:"basis-half",numbers:!0,trim:!0,detab:14},"{ 'class': `basis-half`, 'numbers': true, 'trim': true, 'detab': 14 }",[...this._toNodeList(`
+                
+                
+                
          Hello {name}!
          
+              `)]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("ide-preview",{class:"bg-white basis-half h-140 lg-h-auto"},"{ 'class': `bg-white basis-half h-140 lg-h-auto` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("h1",{},"{ }",[e.TempleRegistry.createText("Hello world!",!1)]),e.TempleRegistry.createText(`
+              `,!1)]),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
+
+          `,!1),e.TempleRegistry.createElement("tui-alert",{solid:!0,curved:!0,info:!0,class:"py-20 tx-lh-24"},"{ 'solid': true, 'curved': true, 'info': true, 'class': `py-20 tx-lh-24` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-info-circle"},"{ 'class': `fas fa-info-circle` }",[]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("strong",{},"{ }",[e.TempleRegistry.createText("Recommended:",!1)]),e.TempleRegistry.createText(`
+            Download the Temple editor plugin at the `,!1),e.TempleRegistry.createElement("a",{target:"_blank",class:"tx-white tx-underline",href:"https://marketplace.visualstudio.com/items?itemName=ossph.temple-language"},"{ 'target': `_blank`, 'class': `tx-white tx-underline`, 'href': `https://marketplace.visualstudio.com/items?itemName=ossph.temple-language` }",[e.TempleRegistry.createText("Visual Studio Marketplace",!1)]),e.TempleRegistry.createText(`.
+          `,!1)]),e.TempleRegistry.createText(`
+
+          `,!1),e.TempleRegistry.createElement("ide-app",{height:410,title:"With NodeJS HTTP"},"{ 'height': 410, 'title': `With NodeJS HTTP` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("app-head",{},"{ }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("div",{class:"flex scroll-x-auto pt-5 pl-5"},"{ 'class': `flex scroll-x-auto pt-5 pl-5` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("tui-tab",{on:!0,class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"http",selector:"#index-ts"},"{ 'on': true, 'class': `relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0`, 'active': `bg-black tx-white`, 'inactive': `bg-t-1 tx-muted`, 'group': `http`, 'selector': `#index-ts` }",[e.TempleRegistry.createText(`
+                  src/index.ts
+                `,!1)]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("tui-tab",{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"http",selector:"#page-dtml"},"{ 'class': `relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0`, 'active': `bg-black tx-white`, 'inactive': `bg-t-1 tx-muted`, 'group': `http`, 'selector': `#page-dtml` }",[e.TempleRegistry.createText(`
+                  src/page.dtml
+                `,!1)]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("tui-tab",{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"http",selector:"#package-json"},"{ 'class': `relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bx-1 bt-1 bdb-0`, 'active': `bg-black tx-white`, 'inactive': `bg-t-1 tx-muted`, 'group': `http`, 'selector': `#package-json` }",[e.TempleRegistry.createText(`
+                  package.json
+                `,!1)]),e.TempleRegistry.createText(`
+              `,!1)]),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("app-left",{},"{ }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("h5",{class:"p-5"},"{ 'class': `p-5` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-down"},"{ 'class': `fas fa-fw fa-chevron-down` }",[]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("span",{},"{ }",[e.TempleRegistry.createText("src",!1)]),e.TempleRegistry.createText(`
+              `,!1)]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("tui-tab",{on:!0,class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"http",selector:"#index-ts"},"{ 'on': true, 'class': `pl-15 pt-10 block`, 'active': `tx-white`, 'inactive': `tx-muted`, 'group': `http`, 'selector': `#index-ts` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},"{ 'class': `fas fa-fw fa-file` }",[]),e.TempleRegistry.createText(`
+                index.ts
+              `,!1)]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("tui-tab",{class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"http",selector:"#page-dtml"},"{ 'class': `pl-15 pt-10 block`, 'active': `tx-white`, 'inactive': `tx-muted`, 'group': `http`, 'selector': `#page-dtml` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},"{ 'class': `fas fa-fw fa-file` }",[]),e.TempleRegistry.createText(`
+                page.dtml
+              `,!1)]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("tui-tab",{class:"pt-10 block",active:"tx-white",inactive:"tx-muted",group:"http",selector:"#package-json"},"{ 'class': `pt-10 block`, 'active': `tx-white`, 'inactive': `tx-muted`, 'group': `http`, 'selector': `#package-json` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},"{ 'class': `fas fa-fw fa-file` }",[]),e.TempleRegistry.createText(`
+                package.json
+              `,!1)]),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("app-main",{},"{ }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("ide-code",{id:"index-ts",lang:"js",numbers:!0,trim:!0,detab:16},"{ 'id': `index-ts`, 'lang': `js`, 'numbers': true, 'trim': true, 'detab': 16 }",[...this._toNodeList(`
+                import http from 'http';
+                import temple from '@ossph/temple/compiler';
+
+                // create temple compiler
+                const compiler = temple();
+                // create http server
+                const server = http.createServer(async (req, res) => {
+                  // if build asset...
+                  if (req.url?.startsWith('/build/')) {
+                    // get filename ie. abc123.js
+                    const filename = req.url.substring(7);
+                    // get asset
+                    const { type, content } = await compiler.asset(filename);
+                    // send response
+                    res.writeHead(200, { 'Content-Type': type });
+                    return res.end(content);
+                  // if home page
+                  } else if (req.url === '/') {
+                    // render and send response
+                    res.writeHead(200, { 'Content-Type': 'text/html' });
+                    return res.end(await compiler.render('./src/page.dtml', {
+                      title: 'Hello World'
+                    }));
+                  }
+                });
+                // listen on port 3000
+                server.listen(3000);
+              `)]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("ide-code",{id:"page-dtml",style:"display:none",numbers:!0,trim:!0,detab:16},"{ 'id': `page-dtml`, 'style': `display:none`, 'numbers': true, 'trim': true, 'detab': 16 }",[...this._toNodeList(`
+                
+                
+                
+                  
+                    {title}
+                    
+                    
+                  
+                  
+                    
          {title}
          
+                  
+                
+              `)]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("ide-code",{id:"package-json",style:"display:none",lang:"js",numbers:!0,trim:!0,detab:16},"{ 'id': `package-json`, 'style': `display:none`, 'lang': `js`, 'numbers': true, 'trim': true, 'detab': 16 }",[...this._toNodeList(`
+                {
+                  "name": "my-project",
+                  "version": "1.0.0",
+                  "private": true,
+                  "scripts": {
+                    "dev": "ts-node ./src/index.ts"
+                  },
+                  "dependencies": {
+                    "@ossph/temple": "0.1.6"
+                  },
+                  "devDependencies": {
+                    "@types/node": "22.1.0",
+                    "ts-node": "10.9.2",
+                    "typescript": "5.5.4"
+                  }
+                }
+              `)]),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
+
+          `,!1),e.TempleRegistry.createElement("api-ui",{},"{ }"),e.TempleRegistry.createText(`
+
+          `,!1),e.TempleRegistry.createElement("nav",{class:"flex"},"{ 'class': `flex` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"tx-primary py-40",href:"/temple/docs/getting-started.html"},"{ 'class': `tx-primary py-40`, 'href': `/temple/docs/getting-started.html` }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-left tx-t-1"},"{ 'class': `fas fa-fw fa-chevron-left tx-t-1` }",[]),e.TempleRegistry.createText(`
+              `,!1),...this._toNodeList(s("Getting Started")),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"flex-grow tx-right tx-primary py-40",href:"/temple/docs/getting-started.html"},"{ 'class': `flex-grow tx-right tx-primary py-40`, 'href': `/temple/docs/getting-started.html` }",[e.TempleRegistry.createText(`
+              `,!1),...this._toNodeList(s("Getting Started")),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-right tx-t-1"},"{ 'class': `fas fa-fw fa-chevron-right tx-t-1` }",[]),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
+        `,!1)]),e.TempleRegistry.createText(`
+      `,!1)]),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]),e.TempleRegistry.createText(`
+`,!1)])]}};return se(Pe);})();
diff --git a/docs/build/server/a67341498153885a2fc0.js b/docs/build/server/a67341498153885a2fc0.js
index a1d0985..18ab870 100644
--- a/docs/build/server/a67341498153885a2fc0.js
+++ b/docs/build/server/a67341498153885a2fc0.js
@@ -1,215 +1,346 @@
-var TempleAPI=(()=>{var ee=Object.create;var b=Object.defineProperty;var te=Object.getOwnPropertyDescriptor;var ae=Object.getOwnPropertyNames;var re=Object.getPrototypeOf,se=Object.prototype.hasOwnProperty;var n=(a,t)=>()=>(t||a((t={exports:{}}).exports,t),t.exports),le=(a,t)=>{for(var r in t)b(a,r,{get:t[r],enumerable:!0})},J=(a,t,r,s)=>{if(t&&typeof t=="object"||typeof t=="function")for(let i of ae(t))!se.call(a,i)&&i!==r&&b(a,i,{get:()=>t[i],enumerable:!(s=te(t,i))||s.enumerable});return a};var R=(a,t,r)=>(r=a!=null?ee(re(a)):{},J(t||!a||!a.__esModule?b(r,"default",{value:a,enumerable:!0}):r,a)),ie=a=>J(b({},"__esModule",{value:!0}),a);var L=n(k=>{"use strict";Object.defineProperty(k,"__esModule",{value:!0});var j=class extends Error{static for(t,...r){return r.forEach(function(s){t=t.replace("%s",s)}),new this(t)}static forErrorsFound(t){let r=new this("Invalid Parameters");return r.errors=t,r}static require(t,r,...s){if(!t){for(let i of s)r=r.replace("%s",i);throw new this(r)}}constructor(t,r=500){super(),this.errors={},this.start=0,this.end=0,this.message=t,this.name=this.constructor.name,this.code=r}withCode(t){return this.code=t,this}withPosition(t,r){return this.start=t,this.end=r,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};k.default=j});var S=n(N=>{"use strict";Object.defineProperty(N,"__esModule",{value:!0});var D=class{constructor(t=[]){this._elements=new Set,t.forEach(r=>this._elements.add(r))}add(t){this._elements.add(t)}toArray(){return Array.from(this._elements)}toString(){return Array.from(this._elements).filter(Boolean).map(t=>t.toString()).join("")}};N.default=D});var d=n(A=>{"use strict";Object.defineProperty(A,"__esModule",{value:!0});var ce=new Map;A.default=ce});var v=n(m=>{"use strict";var ne=m&&m.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(m,"__esModule",{value:!0});var oe=ne(S()),pe=["area","base","br","col","embed","hr","img","input","link","meta","param","source","track","wbr"],P=class{static render(t){return t.filter(Boolean).map(r=>r.toString()).join("")}get name(){return this._name}get attributes(){return this._attributes}get children(){return this._children}constructor(t,r={},s=[]){this._attributes={},this._name=t,this._attributes=r,this._children=new oe.default(s)}toString(){let t=Object.entries(this._attributes),r=t.length>0?" "+t.map(([i,o])=>{if(typeof o=="string")return`${i}="${o}"`;if(typeof o=="boolean")return o?i:""}).join(" "):"";if(pe.includes(this._name))return`<${this._name}${r} />`;let s=this._children.toString();return`<${this._name}${r}>${s}`}};m.default=P});var q=n(I=>{"use strict";Object.defineProperty(I,"__esModule",{value:!0});var O=class{get value(){return this._escape?this._value.replace(/&/g,"&").replace(//g,">"):this._value}constructor(t,r=!1){this._escape=r,this._value=t}toString(){return this.value}};I.default=O});var M=n(f=>{"use strict";var F=f&&f.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(f,"__esModule",{value:!0});var de=F(q()),me=F(v()),C=class{static createElement(t,r,s=[]){return new me.default(t,r,s)}static createText(t,r=!0){return new de.default(t,r)}};f.default=C});var V=n(u=>{"use strict";var w=u&&u.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(u,"__esModule",{value:!0});var fe=w(L()),$=w(d()),ue=w(v()),he=w(M()),B=class{render(t={}){$.default.set("props",t||{}),$.default.set("env",Object.assign(Object.assign({},process.env||{}),{BUILD_ID:this.id(),APP_DATA:btoa(JSON.stringify(Object.assign(Object.assign({},Object.fromEntries($.default.entries())),{env:Object.assign(Object.assign({},Object.fromEntries(Object.entries(process.env||{}).filter(i=>i[0].startsWith("PUBLIC_")))),{BUILD_ID:this.id()})})))}));let r=this.template(),s=ue.default.render(r).trim();if(!s.toLowerCase().startsWith(" tag.");return`
-${s}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:Array.isArray(t)&&t.every(r=>typeof r=="object"&&typeof r.nodeType=="number")?t:[he.default.createText(String(t))]}};u.default=B});var Y=n(h=>{"use strict";Object.defineProperty(h,"__esModule",{value:!0});h.TempleEmitter=void 0;var _=class{emit(t,r){return this}on(t,r){return this}once(t,r){return this}unbind(t,r){return this}};h.TempleEmitter=_;var xe=new _;h.default=xe});var z=n(x=>{"use strict";var Te=x&&x.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(x,"__esModule",{value:!0});var ge=Te(d());function Ee(a){let t=ge.default.get("env")||{};return a?t[a]||null:t}x.default=Ee});var H=n(T=>{"use strict";var be=T&&T.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(T,"__esModule",{value:!0});T.default=we;var ve=be(d());function we(){return ve.default.get("props")||{}}});var G=n(g=>{"use strict";var _e=g&&g.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(g,"__esModule",{value:!0});g.default=je;var ye=_e(H());function je(){return(0,ye.default)().class}});var K=n(U=>{"use strict";Object.defineProperty(U,"__esModule",{value:!0});U.default=ke;function ke(a){let t={getter:()=>r.raw,setter:s=>s},r={raw:a,getter(s){return t.getter=s,r},setter(s){return t.setter=s,r}};return Object.defineProperty(r,"value",{get(){return t.getter()},set(s){r.raw=t.setter(s)}}),r}});var X=n(l=>{"use strict";var Le=l&&l.__createBinding||(Object.create?function(a,t,r,s){s===void 0&&(s=r);var i=Object.getOwnPropertyDescriptor(t,r);(!i||("get"in i?!t.__esModule:i.writable||i.configurable))&&(i={enumerable:!0,get:function(){return t[r]}}),Object.defineProperty(a,s,i)}:function(a,t,r,s){s===void 0&&(s=r),a[s]=t[r]}),De=l&&l.__setModuleDefault||(Object.create?function(a,t){Object.defineProperty(a,"default",{enumerable:!0,value:t})}:function(a,t){a.default=t}),Ne=l&&l.__importStar||function(a){if(a&&a.__esModule)return a;var t={};if(a!=null)for(var r in a)r!=="default"&&Object.prototype.hasOwnProperty.call(a,r)&&Le(t,a,r);return De(t,a),t},p=l&&l.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(l,"__esModule",{value:!0});l.TempleText=l.TempleException=l.TempleEmitter=l.TempleElement=l.TempleRegistry=l.TempleDocument=l.TempleCollection=l.signal=l.classnames=l.props=l.emitter=l.env=l.data=void 0;var Se=p(L());l.TempleException=Se.default;var Ae=p(S());l.TempleCollection=Ae.default;var Pe=p(V());l.TempleDocument=Pe.default;var Oe=p(M());l.TempleRegistry=Oe.default;var Ie=p(v());l.TempleElement=Ie.default;var Q=Ne(Y());l.emitter=Q.default;Object.defineProperty(l,"TempleEmitter",{enumerable:!0,get:function(){return Q.TempleEmitter}});var qe=p(q());l.TempleText=qe.default;var Ce=p(d());l.data=Ce.default;var Me=p(z());l.env=Me.default;var $e=p(H());l.props=$e.default;var Be=p(G());l.classnames=Be.default;var He=p(K());l.signal=He.default});var W=n((st,Z)=>{Z.exports={...X()}});var We={};le(We,{default:()=>y});var e=R(W()),E=R(W());var c=function(a,...t){let r=Ue(a);for(let s=0;s{document.body.classList.toggle("panel-left-open")},o="https://github.com/OSSPhilippines/temple/tree/main/examples";return[e.TempleRegistry.createText(`
-`,!1),e.TempleRegistry.createElement("html",{},[e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("head",{},[e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{charset:"utf-8"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"viewport",content:"width=device-width, initial-scale=1"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("title",{},[...this._toNodeList(r)]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"description",content:s}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:title",content:r}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:description",content:s}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:image",content:"https://ossphilippines.github.io/temple/temple-logo.png"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:url",content:`https://ossphilippines.github.io/temple${t}`}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:type",content:"website"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:card",content:"summary"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:site",content:"@OSSPhilippines"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:title",content:r}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:description",content:s}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:image",content:"https://ossphilippines.github.io/temple/temple-logo.png"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"favicon",href:"/temple/favicon.ico"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"shortcut icon",type:"image/png",href:"/temple/favicon.png"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/fontawesome/all.css"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/theme.css"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:`/temple/build/client/${(0,E.env)("BUILD_ID")}.css`}),e.TempleRegistry.createText(`
+var TempleAPI=(()=>{var X=Object.create;var g=Object.defineProperty;var Z=Object.getOwnPropertyDescriptor;var ee=Object.getOwnPropertyNames;var te=Object.getPrototypeOf,ae=Object.prototype.hasOwnProperty;var n=(a,t)=>()=>(t||a((t={exports:{}}).exports,t),t.exports),se=(a,t)=>{for(var s in t)g(a,s,{get:t[s],enumerable:!0})},H=(a,t,s,r)=>{if(t&&typeof t=="object"||typeof t=="function")for(let i of ee(t))!ae.call(a,i)&&i!==s&&g(a,i,{get:()=>t[i],enumerable:!(r=Z(t,i))||r.enumerable});return a};var U=(a,t,s)=>(s=a!=null?X(te(a)):{},H(t||!a||!a.__esModule?g(s,"default",{value:a,enumerable:!0}):s,a)),le=a=>H(g({},"__esModule",{value:!0}),a);var _=n(E=>{"use strict";Object.defineProperty(E,"__esModule",{value:!0});var w=class extends Error{static for(t,...s){return s.forEach(function(r){t=t.replace("%s",r)}),new this(t)}static forErrorsFound(t){let s=new this("Invalid Parameters");return s.errors=t,s}static require(t,s,...r){if(!t){for(let i of r)s=s.replace("%s",i);throw new this(s)}}constructor(t,s=500){super(),this.errors={},this.start=0,this.end=0,this.message=t,this.name=this.constructor.name,this.code=s}withCode(t){return this.code=t,this}withPosition(t,s){return this.start=t,this.end=s,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};E.default=w});var L=n(j=>{"use strict";Object.defineProperty(j,"__esModule",{value:!0});var k=class{get length(){return this._elements.size}constructor(t=[]){this._elements=new Set,t.forEach(s=>this._elements.add(s))}add(t){this._elements.add(t)}toArray(){return Array.from(this._elements)}toString(){return Array.from(this._elements).filter(Boolean).map(t=>t.toString()).join("")}};j.default=k});var d=n(N=>{"use strict";Object.defineProperty(N,"__esModule",{value:!0});var re=new Map;N.default=re});var A=n(S=>{"use strict";Object.defineProperty(S,"__esModule",{value:!0});var D=class{get value(){return this._escape?this._value.replace(/&/g,"&").replace(//g,">"):this._value}constructor(t,s=!1){this._escape=s,this._value=t}toString(){return this.value}};S.default=D});var I=n(m=>{"use strict";var ce=m&&m.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(m,"__esModule",{value:!0});var ie=ce(L()),ne=["area","base","br","col","embed","hr","img","input","link","meta","param","source","track","wbr"],P=class{get attributes(){return this._attributes}get children(){return this._children}get name(){return this._name}get props(){return this._props}constructor(t,s={},r="",i=[]){this._attributes={},this._name=t,this._attributes=s,this._props=r,this._children=new ie.default(i)}toString(){let t=Object.entries(this._attributes),s=t.length>0?" "+t.map(([i,o])=>{if(typeof o=="string")return`${i}="${o}"`;if(typeof o=="boolean")return o?i:""}).join(" "):"";if(ne.includes(this._name))return`<${this._name}${s} />`;let r=this._children.toString();return`<${this._name}${s}>${r}`}};m.default=P});var q=n(f=>{"use strict";var R=f&&f.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(f,"__esModule",{value:!0});var oe=R(A()),J=R(I()),O=class{static render(t){return t.filter(Boolean).map(s=>s.toString()).join("")}static registry(t,s=new Set){return t.forEach(r=>{r instanceof J.default&&(["html","head","body"].includes(r.name)||s.add(r),r.name!=="head"&&r.children.length>0&&this.registry(r.children.toArray(),s))}),s}static createElement(t,s,r,i=[]){return new J.default(t,s,r,i)}static createText(t,s=!0){return new oe.default(t,s)}};f.default=O});var F=n(x=>{"use strict";var B=x&&x.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(x,"__esModule",{value:!0});var pe=B(_()),C=B(d()),$=B(q()),M=class{bindings(){let t=$.default.registry(this.template());return`{ ${Array.from(t.values()).map((r,i)=>r.props!=="{ }"?`'${i}': ${r.props}`:"").filter(r=>r!=="").join(", ")} }`}render(t={}){C.default.set("props",t||{}),C.default.set("env",Object.assign(Object.assign({},process.env||{}),{BUILD_ID:this.id(),APP_DATA:btoa(JSON.stringify(Object.assign(Object.assign({},Object.fromEntries(C.default.entries())),{env:Object.assign(Object.assign({},Object.fromEntries(Object.entries(process.env||{}).filter(i=>i[0].startsWith("PUBLIC_")))),{BUILD_ID:this.id()})})))}));let s=this.template(),r=$.default.render(s).trim();if(!r.toLowerCase().startsWith(" tag.");return`
+${r}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:Array.isArray(t)&&t.every(s=>typeof s=="object"&&typeof s.nodeType=="number")?t:[$.default.createText(String(t))]}};x.default=M});var V=n(u=>{"use strict";Object.defineProperty(u,"__esModule",{value:!0});u.TempleEmitter=void 0;var y=class{emit(t,s){return this}on(t,s){return this}once(t,s){return this}unbind(t,s){return this}};u.TempleEmitter=y;var de=new y;u.default=de});var G=n(h=>{"use strict";var me=h&&h.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(h,"__esModule",{value:!0});var fe=me(d());function xe(a){let t=fe.default.get("env")||{};return a?t[a]||null:t}h.default=xe});var z=n(b=>{"use strict";var ue=b&&b.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(b,"__esModule",{value:!0});b.default=be;var he=ue(d());function be(){return he.default.get("props")||{}}});var K=n(c=>{"use strict";var Te=c&&c.__createBinding||(Object.create?function(a,t,s,r){r===void 0&&(r=s);var i=Object.getOwnPropertyDescriptor(t,s);(!i||("get"in i?!t.__esModule:i.writable||i.configurable))&&(i={enumerable:!0,get:function(){return t[s]}}),Object.defineProperty(a,r,i)}:function(a,t,s,r){r===void 0&&(r=s),a[r]=t[s]}),ge=c&&c.__setModuleDefault||(Object.create?function(a,t){Object.defineProperty(a,"default",{enumerable:!0,value:t})}:function(a,t){a.default=t}),ye=c&&c.__importStar||function(a){if(a&&a.__esModule)return a;var t={};if(a!=null)for(var s in a)s!=="default"&&Object.prototype.hasOwnProperty.call(a,s)&&Te(t,a,s);return ge(t,a),t},p=c&&c.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(c,"__esModule",{value:!0});c.TempleText=c.TempleException=c.TempleEmitter=c.TempleElement=c.TempleRegistry=c.TempleDocument=c.TempleCollection=c.props=c.emitter=c.env=c.data=void 0;var ve=p(_());c.TempleException=ve.default;var we=p(L());c.TempleCollection=we.default;var Ee=p(F());c.TempleDocument=Ee.default;var _e=p(q());c.TempleRegistry=_e.default;var ke=p(I());c.TempleElement=ke.default;var Y=ye(V());c.emitter=Y.default;Object.defineProperty(c,"TempleEmitter",{enumerable:!0,get:function(){return Y.TempleEmitter}});var je=p(A());c.TempleText=je.default;var Le=p(d());c.data=Le.default;var Ne=p(G());c.env=Ne.default;var De=p(z());c.props=De.default});var W=n((Re,Q)=>{Q.exports={...K()}});var Ae={};se(Ae,{default:()=>v});var e=U(W()),T=U(W());var l=function(a,...t){let s=Se(a);for(let r=0;r{document.getElementsByTagName("panel-layout")[0].toggle("left")},o="https://github.com/OSSPhilippines/temple/tree/main/examples";return[e.TempleRegistry.createText(`
+`,!1),e.TempleRegistry.createElement("html",{},"{ }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("head",{},"{ }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{charset:"utf-8"},"{ 'charset': `utf-8` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"viewport",content:"width=device-width, initial-scale=1"},"{ 'name': `viewport`, 'content': `width=device-width, initial-scale=1` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("title",{},"{ }",[...this._toNodeList(s)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"description",content:r},"{ 'name': `description`, 'content': description }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:title",content:s},"{ 'property': `og:title`, 'content': title }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:description",content:r},"{ 'property': `og:description`, 'content': description }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:image",content:"https://ossphilippines.github.io/temple/temple-logo.png"},"{ 'property': `og:image`, 'content': `https://ossphilippines.github.io/temple/temple-logo.png` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:url",content:`https://ossphilippines.github.io/temple${t}`},"{ 'property': `og:url`, 'content': `https://ossphilippines.github.io/temple${url}` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:type",content:"website"},"{ 'property': `og:type`, 'content': `website` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:card",content:"summary"},"{ 'name': `twitter:card`, 'content': `summary` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:site",content:"@OSSPhilippines"},"{ 'name': `twitter:site`, 'content': `@OSSPhilippines` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:title",content:s},"{ 'name': `twitter:title`, 'content': title }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:description",content:r},"{ 'name': `twitter:description`, 'content': description }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:image",content:"https://ossphilippines.github.io/temple/temple-logo.png"},"{ 'name': `twitter:image`, 'content': `https://ossphilippines.github.io/temple/temple-logo.png` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"favicon",href:"/temple/favicon.ico"},"{ 'rel': `favicon`, 'href': `/temple/favicon.ico` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"shortcut icon",type:"image/png",href:"/temple/favicon.png"},"{ 'rel': `shortcut icon`, 'type': `image/png`, 'href': `/temple/favicon.png` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/fontawesome/all.css"},"{ 'rel': `stylesheet`, 'type': `text/css`, 'href': `/temple/styles/fontawesome/all.css` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/global.css"},"{ 'rel': `stylesheet`, 'type': `text/css`, 'href': `/temple/styles/global.css` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:`/temple/build/client/${(0,T.env)("BUILD_ID")}.css`},"{ 'rel': `stylesheet`, 'type': `text/css`, 'href': `/temple/build/client/${env('BUILD_ID')}.css` }"),e.TempleRegistry.createText(`
   
-  `,!1),e.TempleRegistry.createElement("script",{"data-app":(0,E.env)("APP_DATA"),src:`/temple/build/client/${(0,E.env)("BUILD_ID")}.js`}),e.TempleRegistry.createText(`
-  `,!1),...(0,E.env)("NODE_ENV")==="development"?[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("script",{src:"/dev.js"}),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("script",{"data-app":(0,T.env)("APP_DATA"),src:`/temple/build/client/${(0,T.env)("BUILD_ID")}.js`},"{ 'data-app': env('APP_DATA'), 'src': `/temple/build/client/${env('BUILD_ID')}.js` }"),e.TempleRegistry.createText(`
+  `,!1),...(0,T.env)("NODE_ENV")==="development"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("script",{src:"/dev.js"},"{ 'src': `/dev.js` }"),e.TempleRegistry.createText(`
   `,!1)]:[],e.TempleRegistry.createText(`
 `,!1)]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("body",{class:"dark panel with-head with-left with-right"},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("header",{class:"head panel-head"},[e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("i",{class:"menu fas fa-fw fa-bars",click:i},[]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("a",{href:"/temple"},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("img",{src:"/temple/temple-icon.png",alt:"Temple Logo"}),e.TempleRegistry.createText(`
-  `,!1)]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("h3",{},[e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple"},[e.TempleRegistry.createText("Temple",!1)])]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("nav",{},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple/docs/index.html"},[e.TempleRegistry.createText("Docs",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{class:"github",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-github"},[]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("body",{class:"dark bg-t-0 tx-t-1 arial"},"{ 'class': `dark bg-t-0 tx-t-1 arial` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("panel-layout",{},"{ }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("panel-head",{},"{ }",[e.TempleRegistry.createElement("menu",{class:"flex flex-center-y px-20 py-15 m-0 bg-t-1"},"{ 'class': `flex flex-center-y px-20 py-15 m-0 bg-t-1` }",[e.TempleRegistry.createText(`
+  `,!1),...t!=="/temple/index.html"&&t!=="/temple/500.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-bars cursor-pointer py-5 pr-10 none md-inline-block tx-t-1",click:i},"{ 'class': `fas fa-fw fa-bars cursor-pointer py-5 pr-10 none md-inline-block tx-t-1`, 'click': toggle }",[]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("div",{class:"flex-grow"},"{ 'class': `flex-grow` }",[]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{href:"/temple"},"{ 'href': `/temple` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("img",{alt:"Temple Logo",class:"h-26 mr-10",src:"/temple/temple-icon.png"},"{ 'alt': `Temple Logo`, 'class': `h-26 mr-10`, 'src': `/temple/temple-icon.png` }"),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{class:"npm",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-npm text-white"},[]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("h3",{class:"flex-grow tx-uppercase"},"{ 'class': `flex-grow tx-uppercase` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple"},"{ 'class': `tx-white`, 'href': `/temple` }",[e.TempleRegistry.createText("Temple",!1)]),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{class:"discord",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-discord text-white"},[]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("nav",{class:"flex flex-center-y"},"{ 'class': `flex flex-center-y` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple/docs/index.html"},"{ 'class': `tx-white`, 'href': `/temple/docs/index.html` }",[e.TempleRegistry.createText("Docs",!1)]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"tx-t-1 tx-5xl ml-10",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},"{ 'class': `tx-t-1 tx-5xl ml-10`, 'href': `https://github.com/OSSPhilippines/temple`, 'target': `_blank` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-github"},"{ 'class': `fab fa-github` }",[]),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
-  `,!1)]),e.TempleRegistry.createText(`
-`,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("aside",{class:"left panel-left"},[e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("header",{},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("img",{src:"/temple/temple-icon.png",alt:"Temple Logo"}),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"bg-h-cb3837 pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},"{ 'class': `bg-h-cb3837 pill tx-t-1 tx-lg ml-5 p-5 tx-center`, 'href': `https://www.npmjs.com/package/@ossph/temple`, 'target': `_blank` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-npm text-white"},"{ 'class': `fab fa-npm text-white` }",[]),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("h3",{},[e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple"},[e.TempleRegistry.createText("Temple",!1)])]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("i",{class:"toggle fas fa-fw fa-chevron-left",click:i},[]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"bg-h-7289da pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},"{ 'class': `bg-h-7289da pill tx-t-1 tx-lg ml-5 p-5 tx-center`, 'href': `https://discord.gg/open-source-software-ph-905496362982981723`, 'target': `_blank` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-discord text-white"},"{ 'class': `fab fa-discord text-white` }",[]),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]),e.TempleRegistry.createText(`
+`,!1)])]),e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("panel-left",{},"{ }",[e.TempleRegistry.createElement("header",{class:"flex flex-center-y bg-t-2 py-15 pr-5 pl-10"},"{ 'class': `flex flex-center-y bg-t-2 py-15 pr-5 pl-10` }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("a",{href:"/temple"},"{ 'href': `/temple` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("img",{class:"h-26 mr-10",src:"/temple/temple-icon.png",alt:"Temple Logo"},"{ 'class': `h-26 mr-10`, 'src': `/temple/temple-icon.png`, 'alt': `Temple Logo` }"),e.TempleRegistry.createText(`
   `,!1)]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("nav",{},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("h6",{},[e.TempleRegistry.createText("Introduction",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/index.html"},[e.TempleRegistry.createText("Documentation",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/getting-started.html"},[e.TempleRegistry.createText("Getting Started",!1)]),e.TempleRegistry.createText(`
-
-    `,!1),e.TempleRegistry.createElement("h6",{},[e.TempleRegistry.createText("Features",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/markup-syntax.html"},[e.TempleRegistry.createText("Markup Syntax",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/state-management.html"},[e.TempleRegistry.createText("State Management",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/component-strategy.html"},[e.TempleRegistry.createText("Component Strategy",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/compiler-api.html"},[e.TempleRegistry.createText("Compiler API",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/client-api.html"},[e.TempleRegistry.createText("Client API",!1)]),e.TempleRegistry.createText(`
-
-    `,!1),e.TempleRegistry.createElement("h6",{},[e.TempleRegistry.createText("Usage",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/template-engine.html"},[e.TempleRegistry.createText("Template Engine",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/single-page.html"},[e.TempleRegistry.createText("Single Page App",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/static-site.html"},[e.TempleRegistry.createText("Static Site Generator",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/component-publisher.html"},[e.TempleRegistry.createText("Component Publisher",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/developer-tools.html"},[e.TempleRegistry.createText("Developer Tools",!1)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("h3",{class:"flex-grow m-0 tx-uppercase"},"{ 'class': `flex-grow m-0 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple"},"{ 'class': `tx-white`, 'href': `/temple` }",[e.TempleRegistry.createText("Temple",!1)]),e.TempleRegistry.createText(`
   `,!1)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-left cursor-pointer none md-inline-block",click:i},"{ 'class': `fas fa-fw fa-chevron-left cursor-pointer none md-inline-block`, 'click': toggle }",[]),e.TempleRegistry.createText(`
 `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("aside",{class:"panel-right right"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("h6",{},[...this._toNodeList(c("On this page"))]),e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("nav",{},[e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("a",{href:"#http"},[...this._toNodeList(c("1. Add HTTP"))]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("a",{href:"#develop"},[...this._toNodeList(c("2. Add Dev Tools"))]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("a",{href:"#cache"},[...this._toNodeList(c("3. Add File Cache"))]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("a",{href:"#tailwind"},[...this._toNodeList(c("4. Add TailwindCSS"))]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("a",{href:"#express"},[...this._toNodeList(c("5. Add ExpressJS"))]),e.TempleRegistry.createText(`
-      `,!1)]),e.TempleRegistry.createText(`
+`,!1),e.TempleRegistry.createElement("nav",{class:"bg-t-1 scroll-auto h-calc-full-60"},"{ 'class': `bg-t-1 scroll-auto h-calc-full-60` }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("h6",{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-0 pt-20 pb-10 pl-10 tx-uppercase"},"{ 'class': `bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-0 pt-20 pb-10 pl-10 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),...this._toNodeList(l("Introduction")),e.TempleRegistry.createText(`
+  `,!1)]),e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/index.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/index.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/index.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("Documentation")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/index.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/index.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("Documentation")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/getting-started.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/getting-started.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/getting-started.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("Getting Started")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/getting-started.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/getting-started.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("Getting Started")),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("panel-main",{class:"panel-main"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("div",{class:"docs container"},[e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("h1",{},[...this._toNodeList(c("Getting Started"))]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          To try out Temple, run the following commands in terminal: 
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("ide-app",{title:"Terminal"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("ide-code",{lang:"bash"},[e.TempleRegistry.createText(`
-            npm init -y && npm install --save @ossph/temple && npm install --save-dev ts-node typescript @types/node
+  `,!1),e.TempleRegistry.createElement("h6",{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},"{ 'class': `bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),...this._toNodeList(l("Features")),e.TempleRegistry.createText(`
+  `,!1)]),e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/markup-syntax.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/markup-syntax.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/markup-syntax.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("Markup Syntax")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/markup-syntax.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/markup-syntax.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("Markup Syntax")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/state-management.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/state-management.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/state-management.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("State Management")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/state-management.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/state-management.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("State Management")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/component-strategy.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/component-strategy.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/component-strategy.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("Component Strategy")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-strategy.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/component-strategy.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("Component Strategy")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/compiler-api.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/compiler-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/compiler-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("Compiler API")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/compiler-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/compiler-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("Compiler API")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/client-api.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/client-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/client-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("Client API")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/client-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/client-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("Client API")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+
+  `,!1),e.TempleRegistry.createElement("h6",{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},"{ 'class': `bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),...this._toNodeList(l("Usage")),e.TempleRegistry.createText(`
+  `,!1)]),e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/template-engine.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/template-engine.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/template-engine.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("Template Engine")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/template-engine.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/template-engine.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("Template Engine")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/single-page.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/single-page.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/single-page.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("Single Page App")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/single-page.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/single-page.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("Single Page App")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/static-site.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/static-site.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/static-site.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("Static Site Generator")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/static-site.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/static-site.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("Static Site Generator")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/component-publisher.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/component-publisher.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/component-publisher.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("Component Publisher")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-publisher.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/component-publisher.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("Component Publisher")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/developer-tools.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold mb-100",href:"/temple/docs/developer-tools.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold mb-100`, 'href': `/temple/docs/developer-tools.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("Developer Tools")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 mb-100",href:"/temple/docs/developer-tools.html"},"{ 'class': `block tx-t-1 py-10 pl-10 mb-100`, 'href': `/temple/docs/developer-tools.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(l("Developer Tools")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+`,!1)])]),e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("panel-right",{},"{ }",[e.TempleRegistry.createText(`
+        `,!1),e.TempleRegistry.createElement("menu",{class:"m-0 px-10 py-20 h-calc-full-40 bg-t-2 scroll-auto"},"{ 'class': `m-0 px-10 py-20 h-calc-full-40 bg-t-2 scroll-auto` }",[e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("h6",{class:"tx-muted tx-14 mb-0 mt-0 pb-10 tx-uppercase"},"{ 'class': `tx-muted tx-14 mb-0 mt-0 pb-10 tx-uppercase` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(l("On this page")),e.TempleRegistry.createText(`
           `,!1)]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("tui-alert",{solid:!0,curved:!0,info:!0},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-info-circle"},[]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("strong",{},[e.TempleRegistry.createText("Recommended:",!1)]),e.TempleRegistry.createText(`
-          Download the Temple editor plugin at the `,!1),e.TempleRegistry.createElement("a",{target:"_blank",href:"https://marketplace.visualstudio.com/items?itemName=ossph.temple-language"},[e.TempleRegistry.createText("Visual Studio Marketplace",!1)]),e.TempleRegistry.createText(`.
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Create a server file called
-          `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("src/index.ts",!1)]),e.TempleRegistry.createText(` 
-          with the following code that uses the compiler.
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("ide-app",{title:"src/index.ts"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",numbers:!0,trim:!0,detab:12},[...this._toNodeList(`
-            import temple from '@ossph/temple/compiler';
-            // make a temple compiler
-            const compiler = temple();
-            // render HTML
-            compiler.render('./src/page.dtml').then(console.log);
-            // render CSS
-            compiler.styles('./src/page.dtml').then(console.log);
-            // render JS
-            compiler.client('./src/page.dtml').then(console.log);
-          `)]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Last, create a document file called
-          `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("src/page.dtml",!1)]),e.TempleRegistry.createText(` 
-          with the following template code.
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("ide-app",{title:"src/page.dtml"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("ide-code",{numbers:!0,trim:!0,detab:12},[...this._toNodeList(`
-            
-            
-            
-              
-                {title}
-                
-                
-              
-              
-                
          {title}
          
-              
-            
-          `)]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          To try out the basic implementation of Temple and see the 
-          results, just run the following command in terminal.
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("ide-app",{title:"Terminal"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("ide-code",{lang:"bash"},[e.TempleRegistry.createText(`
-            npx ts-node src/index.ts
+          `,!1),e.TempleRegistry.createElement("nav",{class:"tx-14 tx-lh-32"},"{ 'class': `tx-14 tx-lh-32` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-0",href:"#http"},"{ 'class': `block tx-t-0`, 'href': `#http` }",[e.TempleRegistry.createText(`
+              `,!1),...this._toNodeList(l("1. Add HTTP")),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-0",href:"#develop"},"{ 'class': `block tx-t-0`, 'href': `#develop` }",[e.TempleRegistry.createText(`
+              `,!1),...this._toNodeList(l("2. Add Dev Tools")),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-0",href:"#cache"},"{ 'class': `block tx-t-0`, 'href': `#cache` }",[e.TempleRegistry.createText(`
+              `,!1),...this._toNodeList(l("3. Add File Cache")),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-0",href:"#tailwind"},"{ 'class': `block tx-t-0`, 'href': `#tailwind` }",[e.TempleRegistry.createText(`
+              `,!1),...this._toNodeList(l("4. Add TailwindCSS")),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-0",href:"#express"},"{ 'class': `block tx-t-0`, 'href': `#express` }",[e.TempleRegistry.createText(`
+              `,!1),...this._toNodeList(l("5. Add ExpressJS")),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
           `,!1)]),e.TempleRegistry.createText(`
         `,!1)]),e.TempleRegistry.createText(`
+      `,!1)]),e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("panel-main",{},"{ }",[e.TempleRegistry.createText(`
+        `,!1),e.TempleRegistry.createElement("api-docs",{},"{ }",[e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("h1",{class:"tx-primary tx-uppercase tx-30 py-20"},"{ 'class': `tx-primary tx-uppercase tx-30 py-20` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(l("Getting Started")),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("a",{name:"http"},[]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("h2",{},[...this._toNodeList(c("1. Add HTTP"))]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            To try out Temple, run the following commands in terminal: 
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("ide-app",{title:"Terminal",class:"py-20"},"{ 'title': `Terminal`, 'class': `py-20` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("ide-code",{lang:"bash"},"{ 'lang': `bash` }",[e.TempleRegistry.createText(`
+              npm init -y && npm install --save @ossph/temple && npm install --save-dev ts-node typescript @types/node
+            `,!1)]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("tui-alert",{solid:!0,curved:!0,info:!0,class:"py-20 tx-lh-24"},"{ 'solid': true, 'curved': true, 'info': true, 'class': `py-20 tx-lh-24` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-info-circle"},"{ 'class': `fas fa-info-circle` }",[]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("strong",{},"{ }",[e.TempleRegistry.createText("Recommended:",!1)]),e.TempleRegistry.createText(`
+            Download the Temple editor plugin at the `,!1),e.TempleRegistry.createElement("a",{target:"_blank",class:"tx-white tx-underline",href:"https://marketplace.visualstudio.com/items?itemName=ossph.temple-language"},"{ 'target': `_blank`, 'class': `tx-white tx-underline`, 'href': `https://marketplace.visualstudio.com/items?itemName=ossph.temple-language` }",[e.TempleRegistry.createText("Visual Studio Marketplace",!1)]),e.TempleRegistry.createText(`.
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            Create a server file called
+            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("src/index.ts",!1)]),e.TempleRegistry.createText(` 
+            with the following code that uses the compiler.
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          In most cases Temple will be used to render a front end from 
-          a server framework. In this example, we will use the native
-          NodeJS HTTP module to create a server that renders a page
-          using Temple. Start by replacing the 
-          `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList("'src/index.ts'")]),e.TempleRegistry.createText(`
-          file with the following code. 
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("ide-app",{title:"src/index.ts",class:"py-20"},"{ 'title': `src/index.ts`, 'class': `py-20` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("ide-code",{class:"scroll-auto",lang:"js",numbers:!0,trim:!0,detab:14},"{ 'class': `scroll-auto`, 'lang': `js`, 'numbers': true, 'trim': true, 'detab': 14 }",[...this._toNodeList(`
+              import temple from '@ossph/temple/compiler';
+              // make a temple compiler
+              const compiler = temple();
+              // render HTML
+              compiler.render('./src/page.dtml').then(console.log);
+              // render CSS
+              compiler.styles('./src/page.dtml').then(console.log);
+              // render JS
+              compiler.client('./src/page.dtml').then(console.log);
+            `)]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            Last, create a document file called
+            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("src/page.dtml",!1)]),e.TempleRegistry.createText(` 
+            with the following template code.
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("ide-app",{title:"src/page.dtml",class:"py-20"},"{ 'title': `src/page.dtml`, 'class': `py-20` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("ide-code",{class:"scroll-auto",numbers:!0,trim:!0,detab:14},"{ 'class': `scroll-auto`, 'numbers': true, 'trim': true, 'detab': 14 }",[...this._toNodeList(`
+              
+              
+              
+                
+                  {title}
+                  
+                  
+                
+                
+                  
          {title}
          
+                
+              
+            `)]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            To try out the basic implementation of Temple and see the 
+            results, just run the following command in terminal.
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("ide-app",{title:"Terminal",class:"py-20"},"{ 'title': `Terminal`, 'class': `py-20` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("ide-code",{lang:"bash"},"{ 'lang': `bash` }",[e.TempleRegistry.createText(`
+              npx ts-node src/index.ts
+            `,!1)]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("tui-alert",{solid:!0,curved:!0,info:!0},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-info-circle"},[]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("strong",{},[e.TempleRegistry.createText("Optional:",!1)]),e.TempleRegistry.createText(` You can also check your other 
-          files to make sure you are following along.
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("a",{name:"http"},"{ 'name': `http` }",[]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("h2",{class:"tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0"},"{ 'class': `tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(l("1. Add HTTP")),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
+
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            In most cases Temple will be used to render a front end from 
+            a server framework. In this example, we will use the native
+            NodeJS HTTP module to create a server that renders a page
+            using Temple. Start by replacing the 
+            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[...this._toNodeList("'src/index.ts'")]),e.TempleRegistry.createText(`
+            file with the following code. 
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("ide-app",{panel:410,title:"With NodeJS HTTP"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("div",{class:"panel-head"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("div",{class:"tabs"},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("tui-tab",{class:"tab active",group:"http",selector:"#index-ts"},[e.TempleRegistry.createText(`
-                src/index.ts
+          `,!1),e.TempleRegistry.createElement("tui-alert",{solid:!0,curved:!0,info:!0,class:"py-20 tx-lh-24"},"{ 'solid': true, 'curved': true, 'info': true, 'class': `py-20 tx-lh-24` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-info-circle"},"{ 'class': `fas fa-info-circle` }",[]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("strong",{},"{ }",[e.TempleRegistry.createText("Optional:",!1)]),e.TempleRegistry.createText(` You can also check your other 
+            files to make sure you are following along.
+          `,!1)]),e.TempleRegistry.createText(`
+
+          `,!1),e.TempleRegistry.createElement("ide-app",{height:410,title:"With NodeJS HTTP"},"{ 'height': 410, 'title': `With NodeJS HTTP` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("app-head",{},"{ }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("div",{class:"flex bd-h-333333 bd-solid bdx-0 bdt-0 bdl-1 scroll-x-auto pt-5 pl-5"},"{ 'class': `flex bd-h-333333 bd-solid bdx-0 bdt-0 bdl-1 scroll-x-auto pt-5 pl-5` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("tui-tab",{on:!0,class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"http",selector:"#http-index-ts"},"{ 'on': true, 'class': `relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0`, 'active': `bg-black tx-white`, 'inactive': `bg-t-1 tx-muted`, 'group': `http`, 'selector': `#http-index-ts` }",[e.TempleRegistry.createText(`
+                  src/index.ts
+                `,!1)]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("tui-tab",{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"http",selector:"#http-page-dtml"},"{ 'class': `relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0`, 'active': `bg-black tx-white`, 'inactive': `bg-t-1 tx-muted`, 'group': `http`, 'selector': `#http-page-dtml` }",[e.TempleRegistry.createText(`
+                  src/page.dtml
+                `,!1)]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("tui-tab",{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"http",selector:"#http-package-json"},"{ 'class': `relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0`, 'active': `bg-black tx-white`, 'inactive': `bg-t-1 tx-muted`, 'group': `http`, 'selector': `#http-package-json` }",[e.TempleRegistry.createText(`
+                  package.json
+                `,!1)]),e.TempleRegistry.createText(`
+              `,!1)]),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("app-left",{},"{ }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("h5",{class:"p-5"},"{ 'class': `p-5` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-down"},"{ 'class': `fas fa-fw fa-chevron-down` }",[]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("span",{},"{ }",[e.TempleRegistry.createText("src",!1)]),e.TempleRegistry.createText(`
+              `,!1)]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("tui-tab",{on:!0,class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"http",selector:"#http-index-ts"},"{ 'on': true, 'class': `pl-15 pt-10 block`, 'active': `tx-white`, 'inactive': `tx-muted`, 'group': `http`, 'selector': `#http-index-ts` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},"{ 'class': `fas fa-fw fa-file` }",[]),e.TempleRegistry.createText(`
+                index.ts
               `,!1)]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("tui-tab",{class:"tab",group:"http",selector:"#page-dtml"},[e.TempleRegistry.createText(`
-                src/page.dtml
+              `,!1),e.TempleRegistry.createElement("tui-tab",{class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"http",selector:"#http-page-dtml"},"{ 'class': `pl-15 pt-10 block`, 'active': `tx-white`, 'inactive': `tx-muted`, 'group': `http`, 'selector': `#http-page-dtml` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},"{ 'class': `fas fa-fw fa-file` }",[]),e.TempleRegistry.createText(`
+                page.dtml
               `,!1)]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("tui-tab",{class:"tab",group:"http",selector:"#package-json"},[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("tui-tab",{class:"pt-10 block",active:"tx-white",inactive:"tx-muted",group:"http",selector:"#http-package-json"},"{ 'class': `pt-10 block`, 'active': `tx-white`, 'inactive': `tx-muted`, 'group': `http`, 'selector': `#http-package-json` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},"{ 'class': `fas fa-fw fa-file` }",[]),e.TempleRegistry.createText(`
                 package.json
               `,!1)]),e.TempleRegistry.createText(`
             `,!1)]),e.TempleRegistry.createText(`
-          `,!1)]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("div",{class:"panel-left"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("h5",{class:"folder"},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-down"},[]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("span",{},[e.TempleRegistry.createText("src",!1)]),e.TempleRegistry.createText(`
-            `,!1)]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("tui-tab",{class:"shift-1 block active",group:"http",selector:"#index-ts"},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},[]),e.TempleRegistry.createText(`
-              index.ts
-            `,!1)]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("tui-tab",{class:"shift-1 block",group:"http",selector:"#page-dtml"},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},[]),e.TempleRegistry.createText(`
-              page.dtml
-            `,!1)]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("tui-tab",{class:"block",group:"http",selector:"#package-json"},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},[]),e.TempleRegistry.createText(`
-              package.json
-            `,!1)]),e.TempleRegistry.createText(`
-          `,!1)]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("div",{class:"panel-main"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("main",{},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("ide-code",{id:"index-ts",lang:"js",numbers:!0,trim:!0,detab:16},[...this._toNodeList(`
+            `,!1),e.TempleRegistry.createElement("app-main",{},"{ }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("ide-code",{id:"http-index-ts",lang:"js",numbers:!0,trim:!0,detab:16},"{ 'id': `http-index-ts`, 'lang': `js`, 'numbers': true, 'trim': true, 'detab': 16 }",[...this._toNodeList(`
                 import http from 'http';
                 import temple from '@ossph/temple/compiler';
 
@@ -238,7 +369,7 @@ ${s}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:
                 // listen on port 3000
                 server.listen(3000);
               `)]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("ide-code",{id:"page-dtml",style:"display:none",numbers:!0,trim:!0,detab:16},[...this._toNodeList(`
+              `,!1),e.TempleRegistry.createElement("ide-code",{id:"http-page-dtml",style:"display:none",numbers:!0,trim:!0,detab:16},"{ 'id': `http-page-dtml`, 'style': `display:none`, 'numbers': true, 'trim': true, 'detab': 16 }",[...this._toNodeList(`
                 
@@ -258,7 +389,7 @@ ${s}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:
                   
                 
               `)]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("ide-code",{id:"package-json",style:"display:none",lang:"js",numbers:!0,trim:!0,detab:16},[...this._toNodeList(`
+              `,!1),e.TempleRegistry.createElement("ide-code",{id:"http-package-json",style:"display:none",lang:"js",numbers:!0,trim:!0,detab:16},"{ 'id': `http-package-json`, 'style': `display:none`, 'lang': `js`, 'numbers': true, 'trim': true, 'detab': 16 }",[...this._toNodeList(`
                 {
                   "name": "my-project",
                   "version": "1.0.0",
@@ -267,7 +398,7 @@ ${s}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:
                     "dev": "ts-node ./src/index.ts"
                   },
                   "dependencies": {
-                    "@ossph/temple": "0.1.4"
+                    "@ossph/temple": "0.1.6"
                   },
                   "devDependencies": {
                     "@types/node": "22.1.0",
@@ -278,167 +409,155 @@ ${s}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:
               `)]),e.TempleRegistry.createText(`
             `,!1)]),e.TempleRegistry.createText(`
           `,!1)]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          To run your first Temple web app, just run the following 
-          command in terminal.
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("ide-app",{title:"Terminal"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("ide-code",{lang:"bash"},[e.TempleRegistry.createText(`
-            npx ts-node src/index.ts
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            To run your first Temple web app, just run the following 
+            command in terminal.
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("ide-app",{title:"Terminal",class:"py-20"},"{ 'title': `Terminal`, 'class': `py-20` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("ide-code",{lang:"bash"},"{ 'lang': `bash` }",[e.TempleRegistry.createText(`
+              npx ts-node src/index.ts
+            `,!1)]),e.TempleRegistry.createText(`
           `,!1)]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
-
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          You can now check 
-          `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},[e.TempleRegistry.createText("http://localhost:3000/",!1)]),e.TempleRegistry.createText(` 
-          in your browser to see your Temple application. The 
-          `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},[e.TempleRegistry.createText("temple()",!1)]),e.TempleRegistry.createText(` 
-          function takes in the following options, all of 
-          which are optional.
-        `,!1)]),e.TempleRegistry.createText(`
-
-        `,!1),e.TempleRegistry.createElement("api-ui",{start:"TempleOptions"}),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          The example above also uses two rendering methods
-          `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},[e.TempleRegistry.createText("async compiler.asset()",!1)]),e.TempleRegistry.createText(` which 
-          returns the rendered source code of a build file and 
-          `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},[e.TempleRegistry.createText("async compiler.render()",!1)]),e.TempleRegistry.createText(` which
-          returns the rendered source code of a template file.
-          The compiler provides several other methods for
-          generating source code in JavaScript, CSS, and HTML.
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            You can now check 
+            `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},"{ 'lang': `js`, 'inline': true }",[e.TempleRegistry.createText("http://localhost:3000/",!1)]),e.TempleRegistry.createText(` 
+            in your browser to see your Temple application. The 
+            `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},"{ 'lang': `js`, 'inline': true }",[e.TempleRegistry.createText("temple()",!1)]),e.TempleRegistry.createText(` 
+            function takes in the following options, all of 
+            which are optional.
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("api-ui",{start:"Render Methods"}),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("api-ui",{start:"Render Methods"},"{ 'start': `Render Methods` }"),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("a",{name:"develop"},[]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("h2",{},[...this._toNodeList(c("2. Add Developer Tools"))]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("a",{name:"develop"},"{ 'name': `develop` }",[]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("h2",{class:"tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0"},"{ 'class': `tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(l("2. Add Developer Tools")),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Temple provides a separate package for a better development 
-          experience when working with server frameworks that utilize 
-          the native http module. Start by installing adding 
-          `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},[...this._toNodeList("@ossph/temple-dev")]),e.TempleRegistry.createText(`
-          to your project.
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("ide-app",{title:"Terminal"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("ide-code",{lang:"bash"},[e.TempleRegistry.createText(`
-            npm install --save-dev @ossph/temple-dev
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            Temple provides a separate package for a better development 
+            experience when working with server frameworks that utilize 
+            the native http module. Start by installing adding 
+            `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},"{ 'lang': `js`, 'inline': true }",[...this._toNodeList("@ossph/temple-dev")]),e.TempleRegistry.createText(`
+            to your project.
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("ide-app",{title:"Terminal",class:"py-20"},"{ 'title': `Terminal`, 'class': `py-20` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("ide-code",{lang:"bash"},"{ 'lang': `bash` }",[e.TempleRegistry.createText(`
+              npm install --save-dev @ossph/temple-dev
+            `,!1)]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            Next, import the `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},"{ 'lang': `js`, 'inline': true }",[...this._toNodeList("dev()")]),e.TempleRegistry.createText(` 
+            function from the package and use it in your existing 
+            `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},"{ 'lang': `js`, 'inline': true }",[...this._toNodeList("src/index.ts")]),e.TempleRegistry.createText(` 
+            file to create a development server as shown in the example below.
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("ide-app",{title:"src/index.ts",class:"py-20"},"{ 'title': `src/index.ts`, 'class': `py-20` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",numbers:!0,trim:!0,detab:14},"{ 'lang': `js`, 'numbers': true, 'trim': true, 'detab': 14 }",[...this._toNodeList(`
+              // ...
+              import { dev } from '@ossph/temple-dev';
+              // ...create temple compiler...
+              // 1. create dev tools
+              const { router, refresh } = dev();
+
+              const server = http.createServer(async (req, res) => {
+                // 2. Add dev router
+                if (router(req, res)) return;
+
+                if (req.url?.startsWith('/build/')) {
+                  // ...
+                } else if (req.url === '/') {
+                  // 3. sync builder with refresh server
+                  refresh.sync(compiler.fromSource('./src/page.dtml'));
+                  // ... compile and send response ...
+                }
+              });
+              //...listen on port 3000...
+            `)]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            The `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0,lang:"js"},"{ 'inline': true, 'lang': `js` }",[...this._toNodeList("dev()")]),e.TempleRegistry.createText(` export 
+            from  `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0,lang:"js"},"{ 'inline': true, 'lang': `js` }",[...this._toNodeList("@ossph/temple-dev")]),e.TempleRegistry.createText(`
+            exports tools that supports development mode and accepts the 
+            following options.
           `,!1)]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Next, import the `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},[...this._toNodeList("dev()")]),e.TempleRegistry.createText(` 
-          function from the package and use it in your existing 
-          `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},[...this._toNodeList("src/index.ts")]),e.TempleRegistry.createText(` 
-          file to create a development server as shown in the example below.
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("ide-app",{title:"src/index.ts"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",numbers:!0,trim:!0,detab:12},[...this._toNodeList(`
-            // ...
-            import { dev } from '@ossph/temple-dev';
-            // ...create temple compiler...
-            // 1. create dev tools
-            const { router, refresh } = dev();
-
-            const server = http.createServer(async (req, res) => {
-              // 2. Add dev router
-              if (router(req, res)) return;
-
-              if (req.url?.startsWith('/build/')) {
-                // ...
-              } else if (req.url === '/') {
-                // 3. sync builder with refresh server
-                refresh.sync(compiler.fromSource('./src/page.dtml'));
-                // ... compile and send response ...
-              }
-            });
-            //...listen on port 3000...
-          `)]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          The `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0,lang:"js"},[...this._toNodeList("dev()")]),e.TempleRegistry.createText(` export 
-          from  `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0,lang:"js"},[...this._toNodeList("@ossph/temple-dev")]),e.TempleRegistry.createText(`
-          exports tools that supports development mode and accepts the 
-          following options.
-        `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("api-ui",{start:"DeveloperOptions"}),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("api-ui",{start:"DeveloperOptions"},"{ 'start': `DeveloperOptions` }"),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          This returns several tools you can use in your server app.
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            This returns several tools you can use in your server app.
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("api-ui",{start:"Developer Tools"}),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("api-ui",{start:"Developer Tools"},"{ 'start': `Developer Tools` }"),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Lastly, update the document file 
-          `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},[...this._toNodeList("src/page.dtml")]),e.TempleRegistry.createText(` 
-          to include the development script 
-          `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList('')]),e.TempleRegistry.createText(` 
-          as shown below.
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("ide-app",{title:"src/page.dtml"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("ide-code",{numbers:!0,trim:!0,detab:12},[...this._toNodeList(`
-            
-            
-            
-              
-                
-                
-                
-              
-              
-                
-              
-            
-          `)]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            Lastly, update the document file 
+            `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},"{ 'lang': `js`, 'inline': true }",[...this._toNodeList("src/page.dtml")]),e.TempleRegistry.createText(` 
+            to include the development script 
+            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[...this._toNodeList('')]),e.TempleRegistry.createText(` 
+            as shown below.
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("ide-app",{title:"src/page.dtml",class:"py-20"},"{ 'title': `src/page.dtml`, 'class': `py-20` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("ide-code",{numbers:!0,trim:!0,detab:14},"{ 'numbers': true, 'trim': true, 'detab': 14 }",[...this._toNodeList(`
+              
+              
+              
+                
+                  
+                  
+                  
+                
+                
+                  
+                
+              
+            `)]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          The project should now look like the example below.
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            The project should now look like the example below.
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("ide-app",{panel:410,title:"With Developer Tools"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("div",{class:"panel-head"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("div",{class:"tabs"},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("tui-tab",{class:"tab active",group:"develop",selector:"#index-ts"},[e.TempleRegistry.createText(`
-                src/index.ts
+          `,!1),e.TempleRegistry.createElement("ide-app",{height:410,title:"With Developer Tools",class:"py-20"},"{ 'height': 410, 'title': `With Developer Tools`, 'class': `py-20` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("app-head",{},"{ }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("div",{class:"flex bd-h-333333 bd-solid bdx-0 bdt-0 bdl-1 scroll-x-auto pt-5 pl-5"},"{ 'class': `flex bd-h-333333 bd-solid bdx-0 bdt-0 bdl-1 scroll-x-auto pt-5 pl-5` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("tui-tab",{on:!0,class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"develop",selector:"#develop-index-ts"},"{ 'on': true, 'class': `relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0`, 'active': `bg-black tx-white`, 'inactive': `bg-t-1 tx-muted`, 'group': `develop`, 'selector': `#develop-index-ts` }",[e.TempleRegistry.createText(`
+                  src/index.ts
+                `,!1)]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("tui-tab",{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"develop",selector:"#develop-page-dtml"},"{ 'class': `relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0`, 'active': `bg-black tx-white`, 'inactive': `bg-t-1 tx-muted`, 'group': `develop`, 'selector': `#develop-page-dtml` }",[e.TempleRegistry.createText(`
+                  src/page.dtml
+                `,!1)]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("tui-tab",{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"develop",selector:"#develop-package-json"},"{ 'class': `relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0`, 'active': `bg-black tx-white`, 'inactive': `bg-t-1 tx-muted`, 'group': `develop`, 'selector': `#develop-package-json` }",[e.TempleRegistry.createText(`
+                  package.json
+                `,!1)]),e.TempleRegistry.createText(`
               `,!1)]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("tui-tab",{class:"tab",group:"develop",selector:"#page-dtml"},[e.TempleRegistry.createText(`
-                src/page.dtml
+            `,!1)]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("app-left",{},"{ }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("h5",{class:"p-5"},"{ 'class': `p-5` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-down"},"{ 'class': `fas fa-fw fa-chevron-down` }",[]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("span",{},"{ }",[e.TempleRegistry.createText("src",!1)]),e.TempleRegistry.createText(`
+              `,!1)]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("tui-tab",{on:!0,class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"develop",selector:"#develop-index-ts"},"{ 'on': true, 'class': `pl-15 pt-10 block`, 'active': `tx-white`, 'inactive': `tx-muted`, 'group': `develop`, 'selector': `#develop-index-ts` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},"{ 'class': `fas fa-fw fa-file` }",[]),e.TempleRegistry.createText(`
+                index.ts
+              `,!1)]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("tui-tab",{class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"develop",selector:"#develop-page-dtml"},"{ 'class': `pl-15 pt-10 block`, 'active': `tx-white`, 'inactive': `tx-muted`, 'group': `develop`, 'selector': `#develop-page-dtml` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},"{ 'class': `fas fa-fw fa-file` }",[]),e.TempleRegistry.createText(`
+                page.dtml
               `,!1)]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("tui-tab",{class:"tab",group:"develop",selector:"#package-json"},[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("tui-tab",{class:"pt-10 block",active:"tx-white",inactive:"tx-muted",group:"develop",selector:"#develop-package-json"},"{ 'class': `pt-10 block`, 'active': `tx-white`, 'inactive': `tx-muted`, 'group': `develop`, 'selector': `#develop-package-json` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},"{ 'class': `fas fa-fw fa-file` }",[]),e.TempleRegistry.createText(`
                 package.json
               `,!1)]),e.TempleRegistry.createText(`
             `,!1)]),e.TempleRegistry.createText(`
-          `,!1)]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("div",{class:"panel-left"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("h5",{class:"folder"},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-down"},[]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("span",{},[e.TempleRegistry.createText("src",!1)]),e.TempleRegistry.createText(`
-            `,!1)]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("tui-tab",{class:"shift-1 block active",group:"develop",selector:"#index-ts"},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},[]),e.TempleRegistry.createText(`
-              index.ts
-            `,!1)]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("tui-tab",{class:"shift-1 block",group:"develop",selector:"#page-dtml"},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},[]),e.TempleRegistry.createText(`
-              page.dtml
-            `,!1)]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("tui-tab",{class:"block",group:"develop",selector:"#package-json"},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},[]),e.TempleRegistry.createText(`
-              package.json
-            `,!1)]),e.TempleRegistry.createText(`
-          `,!1)]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("div",{class:"panel-main"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("main",{},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("ide-code",{id:"index-ts",lang:"js",numbers:!0,trim:!0,detab:16},[...this._toNodeList(`
+            `,!1),e.TempleRegistry.createElement("app-main",{},"{ }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("ide-code",{id:"develop-index-ts",lang:"js",numbers:!0,trim:!0,detab:16},"{ 'id': `develop-index-ts`, 'lang': `js`, 'numbers': true, 'trim': true, 'detab': 16 }",[...this._toNodeList(`
                 import http from 'http';
                 import temple from '@ossph/temple/compiler';
                 import { dev } from '@ossph/temple-dev';
@@ -468,7 +587,7 @@ ${s}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:
                 });
                 server.listen(3000);
               `)]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("ide-code",{id:"page-dtml",style:"display:none",numbers:!0,trim:!0,detab:16},[...this._toNodeList(`
+              `,!1),e.TempleRegistry.createElement("ide-code",{id:"develop-page-dtml",style:"display:none",numbers:!0,trim:!0,detab:16},"{ 'id': `develop-page-dtml`, 'style': `display:none`, 'numbers': true, 'trim': true, 'detab': 16 }",[...this._toNodeList(`
                 
@@ -489,7 +608,7 @@ ${s}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:
                   
                 
               `)]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("ide-code",{id:"package-json",style:"display:none",lang:"js",numbers:!0,trim:!0,detab:16},[...this._toNodeList(`
+              `,!1),e.TempleRegistry.createElement("ide-code",{id:"develop-package-json",style:"display:none",lang:"js",numbers:!0,trim:!0,detab:16},"{ 'id': `develop-package-json`, 'style': `display:none`, 'lang': `js`, 'numbers': true, 'trim': true, 'detab': 16 }",[...this._toNodeList(`
                 {
                   "name": "my-project",
                   "version": "1.0.0",
@@ -498,10 +617,10 @@ ${s}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:
                     "dev": "ts-node ./src/index.ts"
                   },
                   "dependencies": {
-                    "@ossph/temple": "0.1.4"
+                    "@ossph/temple": "0.1.6"
                   },
                   "devDependencies": {
-                    "@ossph/temple-dev": "0.1.4",
+                    "@ossph/temple-dev": "0.1.6",
                     "@types/node": "22.1.0",
                     "ts-node": "10.9.2",
                     "typescript": "5.5.4"
@@ -510,357 +629,359 @@ ${s}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:
               `)]),e.TempleRegistry.createText(`
             `,!1)]),e.TempleRegistry.createText(`
           `,!1)]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Re-run the following command in terminal. It shouldn't look 
-          like anything has changed, but the development server is now
-          running in the background. Try to change
-          `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},[...this._toNodeList("src/page.dtml")]),e.TempleRegistry.createText(`.
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("ide-app",{title:"Terminal"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("ide-code",{lang:"bash"},[e.TempleRegistry.createText(`
-            npx ts-node src/index.ts
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            Re-run the following command in terminal. It shouldn't look 
+            like anything has changed, but the development server is now
+            running in the background. Try to change
+            `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},"{ 'lang': `js`, 'inline': true }",[...this._toNodeList("src/page.dtml")]),e.TempleRegistry.createText(`.
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("ide-app",{title:"Terminal",class:"py-20"},"{ 'title': `Terminal`, 'class': `py-20` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("ide-code",{lang:"bash"},"{ 'lang': `bash` }",[e.TempleRegistry.createText(`
+              npx ts-node src/index.ts
+            `,!1)]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            Whenever `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},"{ 'lang': `js`, 'inline': true }",[...this._toNodeList("src/page.dtml")]),e.TempleRegistry.createText(` 
+            is saved, the development server will automatically refresh 
+            the page. Components will also be updated in real-time without
+            the page reloading.
           `,!1)]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Whenever `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},[...this._toNodeList("src/page.dtml")]),e.TempleRegistry.createText(` 
-          is saved, the development server will automatically refresh 
-          the page. Components will also be updated in real-time without
-          the page reloading.
-        `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("a",{name:"cache"},[]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("h2",{},[...this._toNodeList(c("3. Add Cache Files"))]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("a",{name:"cache"},"{ 'name': `cache` }",[]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("h2",{class:"tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0"},"{ 'class': `tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(l("3. Add Cache Files")),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Temple has an out-of-the-box cache and build strategy that
-          can be used to store and serve pre-compiled files. To use the
-          cache, you just need to import it from the 
-          `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},[...this._toNodeList("@ossph/temple/compiler")]),e.TempleRegistry.createText(` 
-          module and use it like the following example.
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            Temple has an out-of-the-box cache and build strategy that
+            can be used to store and serve pre-compiled files. To use the
+            cache, you just need to import it from the 
+            `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},"{ 'lang': `js`, 'inline': true }",[...this._toNodeList("@ossph/temple/compiler")]),e.TempleRegistry.createText(` 
+            module and use it like the following example.
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("ide-app",{title:"src/index.ts"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",numbers:!0,trim:!0,detab:12},[...this._toNodeList(`
-            // ...
-            import path from 'path';
-            import { cache } from '@ossph/temple/compiler';
-            // ...create temple compiler...
-            // 1. use cache
-            compiler.use(cache({
-              buildPath: path.join(__dirname, '../build')
-            }));
-            // ...create dev tools...
-            // ...create http server...
-            // ...listen on port 3000...
-          `)]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("ide-app",{title:"src/index.ts",class:"py-20"},"{ 'title': `src/index.ts`, 'class': `py-20` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",numbers:!0,trim:!0,detab:14},"{ 'lang': `js`, 'numbers': true, 'trim': true, 'detab': 14 }",[...this._toNodeList(`
+              // ...
+              import path from 'path';
+              import { cache } from '@ossph/temple/compiler';
+              // ...create temple compiler...
+              // 1. use cache
+              compiler.use(cache({
+                buildPath: path.join(__dirname, '../build')
+              }));
+              // ...create dev tools...
+              // ...create http server...
+              // ...listen on port 3000...
+            `)]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          The `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},[...this._toNodeList("src/index.ts")]),e.TempleRegistry.createText(` 
-          file should now look like the example below.
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            The `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},"{ 'lang': `js`, 'inline': true }",[...this._toNodeList("src/index.ts")]),e.TempleRegistry.createText(` 
+            file should now look like the example below.
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("ide-app",{title:"src/index.ts"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",numbers:!0,trim:!0,detab:12},[...this._toNodeList(`
-            import path from 'path';
-            import http from 'http';
-            import temple, { cache } from '@ossph/temple/compiler';
-            import { dev } from '@ossph/temple-dev';
-
-            const compiler = temple();
-            // 1. use cache
-            compiler.use(cache({
-              buildPath: path.join(__dirname, '../build')
-            }));
-            const { router, refresh } = dev();
-            const server = http.createServer(async (req, res) => {
-              if (router(req, res)) return;
-              if (req.url?.startsWith('/build/')) {
-                const filename = req.url.substring(7);
-                const { type, content } = await compiler.asset(filename);
-                res.writeHead(200, { 'Content-Type': type });
-                return res.end(content);
-              } else if (req.url === '/') {
-                refresh.sync(compiler.fromSource('./src/page.dtml'));
-                res.writeHead(200, { 'Content-Type': 'text/html' });
-                return res.end(await compiler.render('./src/page.dtml', {
-                  title: 'Hello World'
-                }));
-              }
-            });
-            server.listen(3000);
-          `)]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("ide-app",{title:"src/index.ts",class:"py-20"},"{ 'title': `src/index.ts`, 'class': `py-20` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",numbers:!0,trim:!0,detab:14},"{ 'lang': `js`, 'numbers': true, 'trim': true, 'detab': 14 }",[...this._toNodeList(`
+              import path from 'path';
+              import http from 'http';
+              import temple, { cache } from '@ossph/temple/compiler';
+              import { dev } from '@ossph/temple-dev';
+
+              const compiler = temple();
+              // 1. use cache
+              compiler.use(cache({
+                buildPath: path.join(__dirname, '../build')
+              }));
+              const { router, refresh } = dev();
+              const server = http.createServer(async (req, res) => {
+                if (router(req, res)) return;
+                if (req.url?.startsWith('/build/')) {
+                  const filename = req.url.substring(7);
+                  const { type, content } = await compiler.asset(filename);
+                  res.writeHead(200, { 'Content-Type': type });
+                  return res.end(content);
+                } else if (req.url === '/') {
+                  refresh.sync(compiler.fromSource('./src/page.dtml'));
+                  res.writeHead(200, { 'Content-Type': 'text/html' });
+                  return res.end(await compiler.render('./src/page.dtml', {
+                    title: 'Hello World'
+                  }));
+                }
+              });
+              server.listen(3000);
+            `)]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Re-run the following command in terminal to start the cache 
-          server.
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("ide-app",{title:"Terminal"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("ide-code",{lang:"bash"},[e.TempleRegistry.createText(`
-            npx ts-node src/index.ts
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            Re-run the following command in terminal to start the cache 
+            server.
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("ide-app",{title:"Terminal",class:"py-20"},"{ 'title': `Terminal`, 'class': `py-20` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("ide-code",{lang:"bash"},"{ 'lang': `bash` }",[e.TempleRegistry.createText(`
+              npx ts-node src/index.ts
+            `,!1)]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            Load 
+            `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},"{ 'lang': `js`, 'inline': true }",[e.TempleRegistry.createText("http://localhost:3000/",!1)]),e.TempleRegistry.createText(` 
+            in your browser. After loading you should see files that were 
+            generated in a new build folder found in your project root. 
+            The `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},"{ 'lang': `js`, 'inline': true }",[e.TempleRegistry.createText("cache()",!1)]),e.TempleRegistry.createText(` plugin is 
+            just a wrapper that listens for build related events and
+            stores the generated files in the specified build path.
           `,!1)]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Load 
-          `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},[e.TempleRegistry.createText("http://localhost:3000/",!1)]),e.TempleRegistry.createText(` 
-          in your browser. After loading you should see files that were 
-          generated in a new build folder found in your project root. 
-          The `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",inline:!0},[e.TempleRegistry.createText("cache()",!1)]),e.TempleRegistry.createText(` plugin is 
-          just a wrapper that listens for build related events and
-          stores the generated files in the specified build path.
-        `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("ide-app",{panel:400,title:"cache.ts (Internal)"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",numbers:!0,trim:!0,detab:12},[...this._toNodeList(`
-            emitter.on('manifest-resolved', (event: Event) => {
-              const manifest = event.params.manifest as Manifest
-              //write the manifest to the file system
-              writeFile(paths.manifest, manifest.toJson());
-            });
-
-            // on pre render, try to use cache if live
-            emitter.on('render', (event: Event) => {
-              //if not live, dont retrieve from cache
-              if (environment !== 'production') return;
-              //extract props and builder from params
-              const props = (event.params.props || {}) as Hash;
-              const builder = event.params.builder as Builder;
-              //get fs and id ie. abc123c
-              const { fs, id } = builder.document;
-              //get cache file path ie. /path/to/docs/build/client/abc123c.js
-              const cache = path.join(paths.build, 'server', \`\${id}.js\`);
-              //if production and cache file exists
-              if (fs.existsSync(cache)) {
-                //get the build object
-                const build = compiler.fromCache(cache);
-                //render the document
-                const html = build.document.render(props);
-                //return the cached content
-                event.set(html);
-              }
-            });
-
-            // on post render, cache (dev and live)
-            emitter.on('rendered', (event: Event) => {
-              //extract build and builder from params
-              const builder = event.params.builder as Builder;
-              const html = event.params.html as string;
-              //get fs and id ie. abc123c
-              const { id } = builder.document;
-              //get cache file path ie. /path/to/docs/build/client/abc123c.html
-              const cache = path.join(paths.build, 'client', \`\${id}.html\`);
-              //write the server source code to cache
-              writeFile(cache, html);
-            });
-
-            // on pre client build, try to use cache if live
-            emitter.on('build-client', (event: Event) => {
-              //if not live, dont retrieve from cache
-              if (environment !== 'production') return;
-              //extract builder from params
-              const builder = event.params.builder as Builder;
-              //get fs and id ie. abc123c
-              const id = builder.document.id;
-              //get cache file path ie. /path/to/docs/build/client/abc123c.js
-              const cache = path.join(paths.build, 'client', \`\${id}.js\`);
-              //if cache file exists, send it
-              if (fs.existsSync(cache)) {
-                event.set(fs.readFileSync(cache, 'utf8'));
+          `,!1),e.TempleRegistry.createElement("ide-app",{height:400,title:"cache.ts (Internal)",class:"py-20"},"{ 'height': 400, 'title': `cache.ts (Internal)`, 'class': `py-20` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",numbers:!0,trim:!0,detab:14},"{ 'lang': `js`, 'numbers': true, 'trim': true, 'detab': 14 }",[...this._toNodeList(`
+              emitter.on('manifest-resolved', (event: Event) => {
+                const manifest = event.params.manifest as Manifest
+                //write the manifest to the file system
+                writeFile(paths.manifest, manifest.toJson());
+              });
+
+              // on pre render, try to use cache if live
+              emitter.on('render', (event: Event) => {
+                //if not live, dont retrieve from cache
+                if (environment !== 'production') return;
+                //extract props and builder from params
+                const props = (event.params.props || {}) as Hash;
+                const builder = event.params.builder as Builder;
+                //get fs and id ie. abc123c
+                const { fs, id } = builder.document;
+                //get cache file path ie. /path/to/docs/build/client/abc123c.js
+                const cache = path.join(paths.build, 'server', \`\${id}.js\`);
+                //if production and cache file exists
+                if (fs.existsSync(cache)) {
+                  //get the build object
+                  const build = compiler.fromCache(cache);
+                  //render the document
+                  const html = build.document.render(props);
+                  //return the cached content
+                  event.set(html);
+                }
+              });
+
+              // on post render, cache (dev and live)
+              emitter.on('rendered', (event: Event) => {
+                //extract build and builder from params
+                const builder = event.params.builder as Builder;
+                const html = event.params.html as string;
+                //get fs and id ie. abc123c
+                const { id } = builder.document;
+                //get cache file path ie. /path/to/docs/build/client/abc123c.html
+                const cache = path.join(paths.build, 'client', \`\${id}.html\`);
+                //write the server source code to cache
+                writeFile(cache, html);
+              });
+
+              // on pre client build, try to use cache if live
+              emitter.on('build-client', (event: Event) => {
+                //if not live, dont retrieve from cache
+                if (environment !== 'production') return;
+                //extract builder from params
+                const builder = event.params.builder as Builder;
+                //get fs and id ie. abc123c
+                const id = builder.document.id;
+                //get cache file path ie. /path/to/docs/build/client/abc123c.js
+                const cache = path.join(paths.build, 'client', \`\${id}.js\`);
+                //if cache file exists, send it
+                if (fs.existsSync(cache)) {
+                  event.set(fs.readFileSync(cache, 'utf8'));
+                }
+              });
+
+              // on post client build, cache (dev and live)
+              emitter.on('built-client', (event: Event) => {
+                //extract builder and sourcecode from params
+                const builder = event.params.builder as Builder;
+                const sourceCode = event.params.sourceCode as string;
+                //get fs and id ie. abc123c
+                const id = builder.document.id;
+                //get cache file path ie. /path/to/docs/build/client/abc123c.js
+                const cache = path.join(paths.build, 'client', \`\${id}.js\`);
+                //write the client source code to cache
+                writeFile(cache, sourceCode);
+              });
+
+              // on pre markup build, try to use cache if live
+              emitter.on('build-markup', /* ... */);
+              //on post markup build, cache (dev and live)
+              emitter.on('built-markup', /* ... */);
+              //on pre server build, try to use cache if live
+              emitter.on('build-server', /* ... */);
+              //on post server build, cache (dev and live)
+              emitter.on('built-server', /* ... */);
+              //on pre styles build, try to use cache if live
+              emitter.on('build-styles', /* ... */);
+              //on post styles build, cache (dev and live)
+              emitter.on('built-styles', /* ... */);
+
+              // Initialize: if there's a manifest
+              if (fs.existsSync(paths.manifest)) {
+                //load the manifest file
+                compiler.manifest.load(
+                  JSON.parse(fs.readFileSync(paths.manifest, 'utf-8'))
+                );
               }
-            });
-
-            // on post client build, cache (dev and live)
-            emitter.on('built-client', (event: Event) => {
-              //extract builder and sourcecode from params
-              const builder = event.params.builder as Builder;
-              const sourceCode = event.params.sourceCode as string;
-              //get fs and id ie. abc123c
-              const id = builder.document.id;
-              //get cache file path ie. /path/to/docs/build/client/abc123c.js
-              const cache = path.join(paths.build, 'client', \`\${id}.js\`);
-              //write the client source code to cache
-              writeFile(cache, sourceCode);
-            });
-
-            // on pre markup build, try to use cache if live
-            emitter.on('build-markup', /* ... */);
-            //on post markup build, cache (dev and live)
-            emitter.on('built-markup', /* ... */);
-            //on pre server build, try to use cache if live
-            emitter.on('build-server', /* ... */);
-            //on post server build, cache (dev and live)
-            emitter.on('built-server', /* ... */);
-            //on pre styles build, try to use cache if live
-            emitter.on('build-styles', /* ... */);
-            //on post styles build, cache (dev and live)
-            emitter.on('built-styles', /* ... */);
-
-            // Initialize: if there's a manifest
-            if (fs.existsSync(paths.manifest)) {
-              //load the manifest file
-              compiler.manifest.load(
-                JSON.parse(fs.readFileSync(paths.manifest, 'utf-8'))
-              );
-            }
-          `)]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
-
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          This means you can also use your own cache strategy by 
-          listening to the events emitted by the compiler. The
-          following table lists all the events that the compiler
-          emits during the build cycle of a document.
-        `,!1)]),e.TempleRegistry.createText(`
+            `)]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("api-ui",{start:"EventEmitter"}),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            This means you can also use your own cache strategy by 
+            listening to the events emitted by the compiler. The
+            following table lists all the events that the compiler
+            emits during the build cycle of a document.
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("a",{name:"tailwind"},[]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("h2",{},[...this._toNodeList(c("4. Add TailwindCSS"))]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("api-ui",{start:"EventEmitter"},"{ 'start': `EventEmitter` }"),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Tailwind is an atomic CSS collection of styles that favours 
-          small, single-purpose classes with their selector names based 
-          on its visual function. It works by using a build process to
-          read your source files to generate its styles based only on 
-          what is being used. This makes using Tailwind optimal because
-          it doesn't bloat your CSS with unused styles.
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("a",{name:"tailwind"},"{ 'name': `tailwind` }",[]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("h2",{class:"tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0"},"{ 'class': `tx-primary tx-uppercase tx-26 pt-40 pb-10 mb-20 bd-solid bd-t-1 bdb-1 bdt-0 bdx-0` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(l("4. Add TailwindCSS")),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          At the same time, web components with the
-          `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[...this._toNodeList("
-            
-            
-              
-                
-              
-              
-                
          {title}
          
-              
-            
-          `)]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            Lastly, in `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0,lang:"js"},"{ 'inline': true, 'lang': `js` }",[...this._toNodeList("src/page.dtml")]),e.TempleRegistry.createText(`
+            add the Tailwind directives inside the 
+            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[...this._toNodeList("
+              
+              
+                
+                  
+                
+                
+                  
          {title}
          
+                
+              
+            `)]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Check to see if the project files look like the example below.
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            Check to see if the project files look like the example below.
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("ide-app",{panel:410,title:"With TailwindCSS"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("div",{class:"panel-head"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("div",{class:"tabs"},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("tui-tab",{class:"tab active",group:"tailwind",selector:"#index-ts"},[e.TempleRegistry.createText(`
-                src/index.ts
+          `,!1),e.TempleRegistry.createElement("ide-app",{height:410,title:"With TailwindCSS",class:"py-20"},"{ 'height': 410, 'title': `With TailwindCSS`, 'class': `py-20` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("app-head",{},"{ }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("div",{class:"flex bd-h-333333 bd-solid bdx-0 bdt-0 bdl-1 scroll-x-auto pt-5 pl-5"},"{ 'class': `flex bd-h-333333 bd-solid bdx-0 bdt-0 bdl-1 scroll-x-auto pt-5 pl-5` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("tui-tab",{on:!0,class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"tailwind",selector:"#tailwind-index-ts"},"{ 'on': true, 'class': `relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0`, 'active': `bg-black tx-white`, 'inactive': `bg-t-1 tx-muted`, 'group': `tailwind`, 'selector': `#tailwind-index-ts` }",[e.TempleRegistry.createText(`
+                  src/index.ts
+                `,!1)]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("tui-tab",{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"tailwind",selector:"#tailwind-page-dtml"},"{ 'class': `relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0`, 'active': `bg-black tx-white`, 'inactive': `bg-t-1 tx-muted`, 'group': `tailwind`, 'selector': `#tailwind-page-dtml` }",[e.TempleRegistry.createText(`
+                  src/page.dtml
+                `,!1)]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("tui-tab",{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"tailwind",selector:"#tailwind-package-json"},"{ 'class': `relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0`, 'active': `bg-black tx-white`, 'inactive': `bg-t-1 tx-muted`, 'group': `tailwind`, 'selector': `#tailwind-package-json` }",[e.TempleRegistry.createText(`
+                  package.json
+                `,!1)]),e.TempleRegistry.createText(`
               `,!1)]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("tui-tab",{class:"tab",group:"tailwind",selector:"#page-dtml"},[e.TempleRegistry.createText(`
-                src/page.dtml
+            `,!1)]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("app-left",{},"{ }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("h5",{class:"p-5"},"{ 'class': `p-5` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-down"},"{ 'class': `fas fa-fw fa-chevron-down` }",[]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("span",{},"{ }",[e.TempleRegistry.createText("src",!1)]),e.TempleRegistry.createText(`
+              `,!1)]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("tui-tab",{on:!0,class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"tailwind",selector:"#tailwind-index-ts"},"{ 'on': true, 'class': `pl-15 pt-10 block`, 'active': `tx-white`, 'inactive': `tx-muted`, 'group': `tailwind`, 'selector': `#tailwind-index-ts` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},"{ 'class': `fas fa-fw fa-file` }",[]),e.TempleRegistry.createText(`
+                index.ts
+              `,!1)]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("tui-tab",{class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"tailwind",selector:"#tailwind-page-dtml"},"{ 'class': `pl-15 pt-10 block`, 'active': `tx-white`, 'inactive': `tx-muted`, 'group': `tailwind`, 'selector': `#tailwind-page-dtml` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},"{ 'class': `fas fa-fw fa-file` }",[]),e.TempleRegistry.createText(`
+                page.dtml
               `,!1)]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("tui-tab",{class:"tab",group:"tailwind",selector:"#package-json"},[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("tui-tab",{class:"pt-10 block",active:"tx-white",inactive:"tx-muted",group:"tailwind",selector:"#tailwind-package-json"},"{ 'class': `pt-10 block`, 'active': `tx-white`, 'inactive': `tx-muted`, 'group': `tailwind`, 'selector': `#tailwind-package-json` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},"{ 'class': `fas fa-fw fa-file` }",[]),e.TempleRegistry.createText(`
                 package.json
               `,!1)]),e.TempleRegistry.createText(`
             `,!1)]),e.TempleRegistry.createText(`
-          `,!1)]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("div",{class:"panel-left"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("h5",{class:"folder"},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-down"},[]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("span",{},[e.TempleRegistry.createText("src",!1)]),e.TempleRegistry.createText(`
-            `,!1)]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("tui-tab",{class:"shift-1 block active",group:"tailwind",selector:"#index-ts"},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},[]),e.TempleRegistry.createText(`
-              index.ts
-            `,!1)]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("tui-tab",{class:"shift-1 block",group:"tailwind",selector:"#page-dtml"},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},[]),e.TempleRegistry.createText(`
-              page.dtml
-            `,!1)]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("tui-tab",{class:"block",group:"tailwind",selector:"#package-json"},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},[]),e.TempleRegistry.createText(`
-              package.json
-            `,!1)]),e.TempleRegistry.createText(`
-          `,!1)]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("div",{class:"panel-main"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("main",{},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("ide-code",{id:"index-ts",lang:"js",numbers:!0,trim:!0,detab:16},[...this._toNodeList(`
+            `,!1),e.TempleRegistry.createElement("app-main",{},"{ }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("ide-code",{id:"tailwind-index-ts",lang:"js",numbers:!0,trim:!0,detab:16},"{ 'id': `tailwind-index-ts`, 'lang': `js`, 'numbers': true, 'trim': true, 'detab': 16 }",[...this._toNodeList(`
                 import path from 'path';
                 import http from 'http';
                 import temple, { cache } from '@ossph/temple/compiler';
@@ -897,7 +1018,7 @@ ${s}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:
                 });
                 server.listen(3000);
               `)]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("ide-code",{id:"page-dtml",style:"display:none",numbers:!0,trim:!0,detab:16},[...this._toNodeList(`
+              `,!1),e.TempleRegistry.createElement("ide-code",{id:"tailwind-page-dtml",style:"display:none",numbers:!0,trim:!0,detab:16},"{ 'id': `tailwind-page-dtml`, 'style': `display:none`, 'numbers': true, 'trim': true, 'detab': 16 }",[...this._toNodeList(`
                 
-          
-          
-            
-              
-              
-                
-              
-            
-            
-              
-            
-          
-        `)]),e.TempleRegistry.createText(`
-
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Check to see if the project files look like the example below.
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            And you can now case for development mode in 
+            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0,lang:"js"},"{ 'inline': true, 'lang': `js` }",[...this._toNodeList("src/page.dtml")]),e.TempleRegistry.createText(`
+            like in the example below
+          `,!1)]),e.TempleRegistry.createText(`
+
+          `,!1),e.TempleRegistry.createElement("ide-code",{numbers:!0,trim:!0,detab:12,class:"py-20"},"{ 'numbers': true, 'trim': true, 'detab': 12, 'class': `py-20` }",[...this._toNodeList(`
+            
+            
+            
+              
+                
+                
+                  
+                
+              
+              
+                
+              
+            
+          `)]),e.TempleRegistry.createText(`
+
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            Check to see if the project files look like the example below.
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("ide-app",{panel:410,title:"With ExpressJS"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("div",{class:"panel-head"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("div",{class:"tabs"},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("tui-tab",{class:"tab active",group:"express",selector:"#index-ts"},[e.TempleRegistry.createText(`
-                src/index.ts
+          `,!1),e.TempleRegistry.createElement("ide-app",{height:410,title:"With ExpressJS",class:"py-20"},"{ 'height': 410, 'title': `With ExpressJS`, 'class': `py-20` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("app-head",{},"{ }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("div",{class:"flex bd-h-333333 bd-solid bdx-0 bdt-0 bdl-1 scroll-x-auto pt-5 pl-5"},"{ 'class': `flex bd-h-333333 bd-solid bdx-0 bdt-0 bdl-1 scroll-x-auto pt-5 pl-5` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("tui-tab",{on:!0,class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"express",selector:"#express-index-ts"},"{ 'on': true, 'class': `relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0`, 'active': `bg-black tx-white`, 'inactive': `bg-t-1 tx-muted`, 'group': `express`, 'selector': `#express-index-ts` }",[e.TempleRegistry.createText(`
+                  src/index.ts
+                `,!1)]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("tui-tab",{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"express",selector:"#express-page-dtml"},"{ 'class': `relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0`, 'active': `bg-black tx-white`, 'inactive': `bg-t-1 tx-muted`, 'group': `express`, 'selector': `#express-page-dtml` }",[e.TempleRegistry.createText(`
+                  src/page.dtml
+                `,!1)]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("tui-tab",{class:"relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0",active:"bg-black tx-white",inactive:"bg-t-1 tx-muted",group:"express",selector:"#express-package-json"},"{ 'class': `relative ml-2 p-10 curve-t-sm bd-solid bd-t-1 bdx-1 bdt-1 bdb-0`, 'active': `bg-black tx-white`, 'inactive': `bg-t-1 tx-muted`, 'group': `express`, 'selector': `#express-package-json` }",[e.TempleRegistry.createText(`
+                  package.json
+                `,!1)]),e.TempleRegistry.createText(`
               `,!1)]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("tui-tab",{class:"tab",group:"express",selector:"#page-dtml"},[e.TempleRegistry.createText(`
-                src/page.dtml
+            `,!1)]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("app-left",{},"{ }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("h5",{class:"p-5"},"{ 'class': `p-5` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-down"},"{ 'class': `fas fa-fw fa-chevron-down` }",[]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("span",{},"{ }",[e.TempleRegistry.createText("src",!1)]),e.TempleRegistry.createText(`
+              `,!1)]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("tui-tab",{on:!0,class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"express",selector:"#express-index-ts"},"{ 'on': true, 'class': `pl-15 pt-10 block`, 'active': `tx-white`, 'inactive': `tx-muted`, 'group': `express`, 'selector': `#express-index-ts` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},"{ 'class': `fas fa-fw fa-file` }",[]),e.TempleRegistry.createText(`
+                index.ts
               `,!1)]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("tui-tab",{class:"tab",group:"express",selector:"#package-json"},[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("tui-tab",{class:"pl-15 pt-10 block",active:"tx-white",inactive:"tx-muted",group:"express",selector:"#express-page-dtml"},"{ 'class': `pl-15 pt-10 block`, 'active': `tx-white`, 'inactive': `tx-muted`, 'group': `express`, 'selector': `#express-page-dtml` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},"{ 'class': `fas fa-fw fa-file` }",[]),e.TempleRegistry.createText(`
+                page.dtml
+              `,!1)]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("tui-tab",{class:"pt-10 block",active:"tx-white",inactive:"tx-muted",group:"express",selector:"#express-package-json"},"{ 'class': `pt-10 block`, 'active': `tx-white`, 'inactive': `tx-muted`, 'group': `express`, 'selector': `#express-package-json` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},"{ 'class': `fas fa-fw fa-file` }",[]),e.TempleRegistry.createText(`
                 package.json
               `,!1)]),e.TempleRegistry.createText(`
             `,!1)]),e.TempleRegistry.createText(`
-          `,!1)]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("div",{class:"panel-left"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("h5",{class:"folder"},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-down"},[]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("span",{},[e.TempleRegistry.createText("src",!1)]),e.TempleRegistry.createText(`
-            `,!1)]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("tui-tab",{class:"shift-1 block active",group:"express",selector:"#index-ts"},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},[]),e.TempleRegistry.createText(`
-              index.ts
-            `,!1)]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("tui-tab",{class:"shift-1 block",group:"express",selector:"#page-dtml"},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},[]),e.TempleRegistry.createText(`
-              page.dtml
-            `,!1)]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("tui-tab",{class:"block",group:"express",selector:"#package-json"},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-file"},[]),e.TempleRegistry.createText(`
-              package.json
-            `,!1)]),e.TempleRegistry.createText(`
-          `,!1)]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("div",{class:"panel-main"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("main",{},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("ide-code",{id:"index-ts",lang:"js",numbers:!0,trim:!0,detab:16},[...this._toNodeList(`
+            `,!1),e.TempleRegistry.createElement("app-main",{},"{ }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("ide-code",{id:"express-index-ts",lang:"js",numbers:!0,trim:!0,detab:16},"{ 'id': `express-index-ts`, 'lang': `js`, 'numbers': true, 'trim': true, 'detab': 16 }",[...this._toNodeList(`
                 import path from 'path';
                 import express from 'express';
                 import temple, { cache } from '@ossph/temple/compiler';
@@ -1164,7 +1285,7 @@ ${s}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:
                   console.log('HTTP server is running on http://localhost:3000');
                 });
               `)]),e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("ide-code",{id:"page-dtml",style:"display:none",numbers:!0,trim:!0,detab:16},[...this._toNodeList(`
+              `,!1),e.TempleRegistry.createElement("ide-code",{id:"express-page-dtml",style:"display:none",numbers:!0,trim:!0,detab:16},"{ 'id': `express-page-dtml`, 'style': `display:none`, 'numbers': true, 'trim': true, 'detab': 16 }",[...this._toNodeList(`
                 
-              
-              
          Hello {name}!
          
-            `)]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("ide-preview",{},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("div",{},[e.TempleRegistry.createText(`
-                `,!1),e.TempleRegistry.createElement("h1",{},[...this._toNodeList(i("Hello world!"))]),e.TempleRegistry.createText(`
+        `,!1),e.TempleRegistry.createElement("section",{class:"m-auto wm-960 px-20"},"{ 'class': `m-auto wm-960 px-20` }",[e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"p-20 tx-center tx-lh-36 tx-18"},"{ 'p': true, 'trim': true, 'class': `p-20 tx-center tx-lh-36 tx-18` }",[e.TempleRegistry.createText(`
+            Temple is a modern HTML markup language and a server first 
+            template engine with a built-in parser/compiler that 
+            generates web components and supports reactivity.
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("ide-app",{class:"block",title:"Basic Example"},"{ 'class': `block`, 'title': `Basic Example` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("div",{class:"flex bg-white md-block"},"{ 'class': `flex bg-white md-block` }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("ide-code",{numbers:!0,trim:!0,detab:14,class:"basis-half"},"{ 'numbers': true, 'trim': true, 'detab': 14, 'class': `basis-half` }",[...this._toNodeList(`
+                
+                
+                
          Hello {name}!
          
+              `)]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("ide-preview",{class:"basis-half"},"{ 'class': `basis-half` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("div",{},"{ }",[e.TempleRegistry.createText(`
+                  `,!1),e.TempleRegistry.createElement("h1",{},"{ }",[...this._toNodeList(i("Hello world!"))]),e.TempleRegistry.createText(`
+                `,!1)]),e.TempleRegistry.createText(`
               `,!1)]),e.TempleRegistry.createText(`
             `,!1)]),e.TempleRegistry.createText(`
           `,!1)]),e.TempleRegistry.createText(`
         `,!1)]),e.TempleRegistry.createText(`
-      `,!1)]),e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("section",{class:"section-bullets"},[e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("ul",{},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("h3",{},[...this._toNodeList(i("Expressive Markup"))]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-              Any data type as attributes. Easily express logic with 
-              markup directives like if, each, and try catch. 
+        `,!1),e.TempleRegistry.createElement("section",{class:"bg-t-1 m-auto py-40 px-20 tx-center"},"{ 'class': `bg-t-1 m-auto py-40 px-20 tx-center` }",[e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("ul",{class:"flex flex-center list-none p-0 tx-center md-block"},"{ 'class': `flex flex-center list-none p-0 tx-center md-block` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("li",{class:"w-third wm-300 md-wm-400 md-w-auto md-m-auto"},"{ 'class': `w-third wm-300 md-wm-400 md-w-auto md-m-auto` }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("div",{class:"p-10"},"{ 'class': `p-10` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("h3",{class:"mb-20 tx-uppercase"},"{ 'class': `mb-20 tx-uppercase` }",[e.TempleRegistry.createText(`
+                  `,!1),...this._toNodeList(i("Expressive Markup")),e.TempleRegistry.createText(`
+                `,!1)]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-16 tx-lh-24"},"{ 'p': true, 'trim': true, 'class': `tx-16 tx-lh-24` }",[e.TempleRegistry.createText(`
+                  Any data type as attributes. Easily express logic with 
+                  markup directives like if, each, and try catch. 
+                `,!1)]),e.TempleRegistry.createText(`
+              `,!1)]),e.TempleRegistry.createText(`
             `,!1)]),e.TempleRegistry.createText(`
-          `,!1)]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("h3",{},[...this._toNodeList(i("Reactive Signals"))]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-              Easily transition from backend logic to reactive states.
-              No Hydration and no memoization needed.
+            `,!1),e.TempleRegistry.createElement("li",{class:"w-third wm-300 md-wm-400 md-w-auto md-m-auto md-mt-20"},"{ 'class': `w-third wm-300 md-wm-400 md-w-auto md-m-auto md-mt-20` }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("div",{class:"p-10"},"{ 'class': `p-10` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("h3",{class:"mb-20 tx-uppercase"},"{ 'class': `mb-20 tx-uppercase` }",[e.TempleRegistry.createText(`
+                  `,!1),...this._toNodeList(i("Reactive Signals")),e.TempleRegistry.createText(`
+                `,!1)]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-16 tx-lh-24"},"{ 'p': true, 'trim': true, 'class': `tx-16 tx-lh-24` }",[e.TempleRegistry.createText(`
+                  Easily transition from backend logic to reactive states.
+                  No Hydration and no memoization needed.
+                `,!1)]),e.TempleRegistry.createText(`
+              `,!1)]),e.TempleRegistry.createText(`
             `,!1)]),e.TempleRegistry.createText(`
-          `,!1)]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("li",{},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("h3",{},[...this._toNodeList(i("Bare Metal"))]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-              Work with the DOM directly. Import any web components 
-              from any source. Works with Lit, HTMX.
+            `,!1),e.TempleRegistry.createElement("li",{class:"w-third wm-300 md-wm-400 md-w-auto md-m-auto md-mt-20"},"{ 'class': `w-third wm-300 md-wm-400 md-w-auto md-m-auto md-mt-20` }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("div",{class:"p-10"},"{ 'class': `p-10` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("h3",{class:"mb-20 tx-uppercase"},"{ 'class': `mb-20 tx-uppercase` }",[e.TempleRegistry.createText(`
+                  `,!1),...this._toNodeList(i("Bare Metal")),e.TempleRegistry.createText(`
+                `,!1)]),e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-16 tx-lh-24"},"{ 'p': true, 'trim': true, 'class': `tx-16 tx-lh-24` }",[e.TempleRegistry.createText(`
+                  Work with the DOM directly. Import any web components 
+                  from any source. Works with Lit, HTMX.
+                `,!1)]),e.TempleRegistry.createText(`
+              `,!1)]),e.TempleRegistry.createText(`
             `,!1)]),e.TempleRegistry.createText(`
           `,!1)]),e.TempleRegistry.createText(`
         `,!1)]),e.TempleRegistry.createText(`
-      `,!1)]),e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("section",{class:"section-interactive"},[e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("h3",{},[...this._toNodeList(i("Server Setup"))]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Temple can be used with popular server 
-          frameworks in just a few lines of code.
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("ide-app",{title:"Server Example"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",numbers:!0,trim:!0,detab:12},[...this._toNodeList(`
-            import temple from '@ossph/temple/compiler';
-            //make a temple compiler
-            const compiler = temple();
-            //render HTML
-            const results = compiler.render('./page.dtml');
-          `)]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
-
-        `,!1),e.TempleRegistry.createElement("h3",{},[...this._toNodeList(i("Props"))]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Import your component props and use immediately
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("ide-app",{title:"Props Example"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("div",{class:"split-view"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("ide-code",{numbers:!0,trim:!0,detab:14},[...this._toNodeList(`
-              
-              
-              
          Hello {name}!
          
+        `,!1),e.TempleRegistry.createElement("section",{class:"m-auto wm-960 px-20 py-40"},"{ 'class': `m-auto wm-960 px-20 py-40` }",[e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("h3",{class:"mt-40 mb-20 tx-center tx-uppercase"},"{ 'class': `mt-40 mb-20 tx-center tx-uppercase` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(i("Server Setup")),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-center tx-lh-24 mb-20"},"{ 'p': true, 'trim': true, 'class': `tx-center tx-lh-24 mb-20` }",[e.TempleRegistry.createText(`
+            Temple can be used with popular server 
+            frameworks in just a few lines of code.
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("ide-app",{title:"Server Example"},"{ 'title': `Server Example` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("ide-code",{lang:"js",numbers:!0,trim:!0,detab:12},"{ 'lang': `js`, 'numbers': true, 'trim': true, 'detab': 12 }",[...this._toNodeList(`
+              import temple from '@ossph/temple/compiler';
+              //make a temple compiler
+              const compiler = temple();
+              //render HTML
+              const results = compiler.render('./page.dtml');
             `)]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("ide-preview",{},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("div",{},[e.TempleRegistry.createText(`
-                `,!1),e.TempleRegistry.createElement("h1",{},[...this._toNodeList(i("Hello world!"))]),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
+
+          `,!1),e.TempleRegistry.createElement("h3",{class:"mt-40 mb-20 tx-center tx-uppercase"},"{ 'class': `mt-40 mb-20 tx-center tx-uppercase` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(i("Props")),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-center tx-lh-24 mb-20"},"{ 'p': true, 'trim': true, 'class': `tx-center tx-lh-24 mb-20` }",[e.TempleRegistry.createText(`
+            Import your component props and use immediately
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("ide-app",{title:"Props Example"},"{ 'title': `Props Example` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("div",{class:"flex bg-white md-block"},"{ 'class': `flex bg-white md-block` }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("ide-code",{numbers:!0,trim:!0,detab:14,class:"basis-half"},"{ 'numbers': true, 'trim': true, 'detab': 14, 'class': `basis-half` }",[...this._toNodeList(`
+                
+                
+                
          Hello {name}!
          
+              `)]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("ide-preview",{class:"basis-half"},"{ 'class': `basis-half` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("div",{},"{ }",[e.TempleRegistry.createText(`
+                  `,!1),e.TempleRegistry.createElement("h1",{},"{ }",[...this._toNodeList(i("Hello world!"))]),e.TempleRegistry.createText(`
+                `,!1)]),e.TempleRegistry.createText(`
               `,!1)]),e.TempleRegistry.createText(`
             `,!1)]),e.TempleRegistry.createText(`
           `,!1)]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("h3",{},[...this._toNodeList(i("Reactive Signals"))]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Use signals to manage state changes and re-renders.
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("ide-app",{title:"Signal Example"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("div",{class:"split-view"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("ide-code",{numbers:!0,trim:!0,detab:14},[...this._toNodeList(`
-              
-              
-              
          Hello {name.value}
          
-            `)]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("ide-preview",{},[e.TempleRegistry.createText(`
-              `,!1),e.TempleRegistry.createElement("div",{},[e.TempleRegistry.createText(`
-                `,!1),e.TempleRegistry.createElement("h1",{},[...this._toNodeList(i("Hello world!"))]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("h3",{class:"mt-40 mb-20 tx-center tx-uppercase"},"{ 'class': `mt-40 mb-20 tx-center tx-uppercase` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(i("Reactive Signals")),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-center tx-lh-24 mb-20"},"{ 'p': true, 'trim': true, 'class': `tx-center tx-lh-24 mb-20` }",[e.TempleRegistry.createText(`
+            Use signals to manage state changes and re-renders.
+          `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("ide-app",{title:"Signal Example"},"{ 'title': `Signal Example` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("div",{class:"flex bg-white md-block"},"{ 'class': `flex bg-white md-block` }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("ide-code",{numbers:!0,trim:!0,detab:14,class:"basis-half"},"{ 'numbers': true, 'trim': true, 'detab': 14, 'class': `basis-half` }",[...this._toNodeList(`
+                
+                
+                
          Hello {name.value}
          
+              `)]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("ide-preview",{class:"basis-half"},"{ 'class': `basis-half` }",[e.TempleRegistry.createText(`
+                `,!1),e.TempleRegistry.createElement("div",{},"{ }",[e.TempleRegistry.createText(`
+                  `,!1),e.TempleRegistry.createElement("h1",{},"{ }",[...this._toNodeList(i("Hello world!"))]),e.TempleRegistry.createText(`
+                `,!1)]),e.TempleRegistry.createText(`
               `,!1)]),e.TempleRegistry.createText(`
             `,!1)]),e.TempleRegistry.createText(`
           `,!1)]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("h3",{},[...this._toNodeList(i("Components and Templates"))]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Import components and templates for reusability.
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("ide-app",{title:"Import Example"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("div",{class:"split-view"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("ide-code",{numbers:!0,trim:!0,detab:14},[...this._toNodeList(`
-              
-              
-              
-              Hello
-            `)]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("ide-code",{class:"div",trim:!0,detab:14},[...this._toNodeList(`
-              
-              
-              
          {children} {name}
          
-            `)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("h3",{class:"mt-40 mb-20 tx-center tx-uppercase"},"{ 'class': `mt-40 mb-20 tx-center tx-uppercase` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(i("Components and Templates")),e.TempleRegistry.createText(`
           `,!1)]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
-
-        `,!1),e.TempleRegistry.createElement("h3",{},[...this._toNodeList(i("Conditionals and Iterations"))]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Case for conditions and iterations in an expressive way.
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("ide-app",{title:"Conditional + Iteration Example"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("div",{class:"split-view"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("ide-code",{numbers:!0,trim:!0,detab:14},[...this._toNodeList(`
-              
-
-              
-                
          Hello {name}
          
-                        
-            `)]),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("ide-code",{class:"div",trim:!0,detab:14},[...this._toNodeList(`
-              
-              
            
-                
-                  
          • {i}: {item}
            • 
-                            
-              
          
-            `)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-center tx-lh-24 mb-20"},"{ 'p': true, 'trim': true, 'class': `tx-center tx-lh-24 mb-20` }",[e.TempleRegistry.createText(`
+            Import components and templates for reusability.
           `,!1)]),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
-      `,!1)]),e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("section",{class:"section-servers"},[e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("h3",{},[...this._toNodeList(i("Works With Popular Server Frameworks"))]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("div",{},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("a",{href:"https://expressjs.com/",target:"_blank"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("img",{src:"https://upload.wikimedia.org/wikipedia/commons/6/64/Expressjs.png",alt:"Express"}),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("ide-app",{title:"Import Example"},"{ 'title': `Import Example` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("div",{class:"flex bg-white md-block"},"{ 'class': `flex bg-white md-block` }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("ide-code",{numbers:!0,trim:!0,detab:14,class:"basis-half"},"{ 'numbers': true, 'trim': true, 'detab': 14, 'class': `basis-half` }",[...this._toNodeList(`
+                
+                
+                
+                Hello
+              `)]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("ide-code",{class:"div basis-half",trim:!0,detab:14},"{ 'class': `div basis-half`, 'trim': true, 'detab': 14 }",[...this._toNodeList(`
+                
+                
+                
          {children} {name}
          
+              `)]),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
           `,!1)]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("a",{href:"https://fastify.dev/",target:"_blank"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("img",{src:"https://upload.wikimedia.org/wikipedia/commons/0/0a/Fastify_logo.svg",alt:"Fastify"}),e.TempleRegistry.createText(`
+
+          `,!1),e.TempleRegistry.createElement("h3",{class:"mt-40 mb-20 tx-center tx-uppercase"},"{ 'class': `mt-40 mb-20 tx-center tx-uppercase` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(i("Conditionals and Iterations")),e.TempleRegistry.createText(`
           `,!1)]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("a",{href:"https://hapi.dev/",target:"_blank"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("img",{src:"https://raw.githubusercontent.com/hapijs/assets/master/images/hapi.png",alt:"Hapi"}),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-center tx-lh-24 mb-20"},"{ 'p': true, 'trim': true, 'class': `tx-center tx-lh-24 mb-20` }",[e.TempleRegistry.createText(`
+            Case for conditions and iterations in an expressive way.
           `,!1)]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("a",{href:"https://koajs.com/",target:"_blank"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("img",{src:"https://cdn.icon-icons.com/icons2/2699/PNG/512/koajs_logo_icon_168379.png",alt:"Koa"}),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("ide-app",{title:"Conditional + Iteration Example"},"{ 'title': `Conditional + Iteration Example` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("div",{class:"flex bg-white md-block"},"{ 'class': `flex bg-white md-block` }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("ide-code",{numbers:!0,trim:!0,detab:14,class:"basis-half"},"{ 'numbers': true, 'trim': true, 'detab': 14, 'class': `basis-half` }",[...this._toNodeList(`
+                
+
+                
+                  
          Hello {name}
          
+                          
+              `)]),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("ide-code",{class:"div basis-half",trim:!0,detab:14},"{ 'class': `div basis-half`, 'trim': true, 'detab': 14 }",[...this._toNodeList(`
+                
+                
            
+                  
+                    
          • {i}: {item}
            • 
+                              
+                
          
+              `)]),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
           `,!1)]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("a",{href:"https://nestjs.com/",target:"_blank"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("img",{src:"https://cdn.icon-icons.com/icons2/2699/PNG/512/nestjs_logo_icon_169927.png",alt:"NestJS"}),e.TempleRegistry.createText(`
+        `,!1)]),e.TempleRegistry.createText(`
+        `,!1),e.TempleRegistry.createElement("section",{class:"m-auto px-20 py-40 tx-center bg-h-cccccc"},"{ 'class': `m-auto px-20 py-40 tx-center bg-h-cccccc` }",[e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("h3",{class:"tx-h-242424 tx-30 tx-uppercase"},"{ 'class': `tx-h-242424 tx-30 tx-uppercase` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(i("Works With Popular Server Frameworks")),e.TempleRegistry.createText(`
           `,!1)]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("a",{href:"http://restify.com/",target:"_blank"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("img",{src:"https://raw.githubusercontent.com/restify/node-restify/gh-images/logo/png/restify_logo_black_transp_288x288.png?raw=true",alt:"Restify"}),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("div",{class:"flex flex-center flex-wrap mx-auto mt-40 mb-0 sm-block"},"{ 'class': `flex flex-center flex-wrap mx-auto mt-40 mb-0 sm-block` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"block basis-third mb-20",href:"https://expressjs.com/",target:"_blank"},"{ 'class': `block basis-third mb-20`, 'href': `https://expressjs.com/`, 'target': `_blank` }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("img",{class:"h-60",src:"https://upload.wikimedia.org/wikipedia/commons/6/64/Expressjs.png",alt:"Express"},"{ 'class': `h-60`, 'src': `https://upload.wikimedia.org/wikipedia/commons/6/64/Expressjs.png`, 'alt': `Express` }"),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"block basis-third mb-20",href:"https://fastify.dev/",target:"_blank"},"{ 'class': `block basis-third mb-20`, 'href': `https://fastify.dev/`, 'target': `_blank` }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("img",{class:"h-60",src:"https://upload.wikimedia.org/wikipedia/commons/0/0a/Fastify_logo.svg",alt:"Fastify"},"{ 'class': `h-60`, 'src': `https://upload.wikimedia.org/wikipedia/commons/0/0a/Fastify_logo.svg`, 'alt': `Fastify` }"),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"block basis-third mb-20",href:"https://hapi.dev/",target:"_blank"},"{ 'class': `block basis-third mb-20`, 'href': `https://hapi.dev/`, 'target': `_blank` }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("img",{class:"h-60",src:"https://raw.githubusercontent.com/hapijs/assets/master/images/hapi.png",alt:"Hapi"},"{ 'class': `h-60`, 'src': `https://raw.githubusercontent.com/hapijs/assets/master/images/hapi.png`, 'alt': `Hapi` }"),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"block basis-third mb-20",href:"https://koajs.com/",target:"_blank"},"{ 'class': `block basis-third mb-20`, 'href': `https://koajs.com/`, 'target': `_blank` }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("img",{class:"h-60",src:"https://cdn.icon-icons.com/icons2/2699/PNG/512/koajs_logo_icon_168379.png",alt:"Koa"},"{ 'class': `h-60`, 'src': `https://cdn.icon-icons.com/icons2/2699/PNG/512/koajs_logo_icon_168379.png`, 'alt': `Koa` }"),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"block basis-third mb-20",href:"https://nestjs.com/",target:"_blank"},"{ 'class': `block basis-third mb-20`, 'href': `https://nestjs.com/`, 'target': `_blank` }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("img",{class:"h-60",src:"https://cdn.icon-icons.com/icons2/2699/PNG/512/nestjs_logo_icon_169927.png",alt:"NestJS"},"{ 'class': `h-60`, 'src': `https://cdn.icon-icons.com/icons2/2699/PNG/512/nestjs_logo_icon_169927.png`, 'alt': `NestJS` }"),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"block basis-third mb-20",href:"http://restify.com/",target:"_blank"},"{ 'class': `block basis-third mb-20`, 'href': `http://restify.com/`, 'target': `_blank` }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("img",{class:"h-60",src:"https://raw.githubusercontent.com/restify/node-restify/gh-images/logo/png/restify_logo_black_transp_288x288.png?raw=true",alt:"Restify"},"{ 'class': `h-60`, 'src': `https://raw.githubusercontent.com/restify/node-restify/gh-images/logo/png/restify_logo_black_transp_288x288.png?raw=true`, 'alt': `Restify` }"),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
           `,!1)]),e.TempleRegistry.createText(`
         `,!1)]),e.TempleRegistry.createText(`
-      `,!1)]),e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("section",{class:"section-testimonials"},[e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("h3",{},[...this._toNodeList(i("Temple Loves Developers!"))]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("section",{},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("tweet-box",{name:"Joff Tiquez",handle:"@jrtiquez",href:"https://twitter.com/jrtiquez",src:"https://github.com/jofftiquez.png"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("p",{},[e.TempleRegistry.createText("Im a vue developer. No need for this. OSSPH does not support this project.",!1)]),e.TempleRegistry.createText(`
+        `,!1),e.TempleRegistry.createElement("section",{class:"bg-t-1 m-auto py-40 px-20"},"{ 'class': `bg-t-1 m-auto py-40 px-20` }",[e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("h3",{class:"tx-26 tx-center"},"{ 'class': `tx-26 tx-center` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(i("Temple Loves Developers!")),e.TempleRegistry.createText(`
           `,!1)]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("tweet-box",{name:"Primeagen",handle:"@theprimeagen",href:"https://twitter.com/ThePrimeagen",src:"https://pbs.twimg.com/profile_images/1759330620160049152/2i_wkOoK_400x400.jpg"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("p",{},[e.TempleRegistry.createText("Temple? Never heard of it...",!1),e.TempleRegistry.createElement("br",{}),e.TempleRegistry.createText('"The Name..."',!1)]),e.TempleRegistry.createText(`
-          `,!1)]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("tweet-box",{name:"Kristian Quirapas",handle:"@YourCompanyCTO",href:"https://twitter.com/YourCompanyCTO",src:"https://avatars.githubusercontent.com/u/85150796?v=4"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("p",{},[e.TempleRegistry.createText("Temple is good news for Node developers. I'm a rust developer so it don't matter to me.",!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("section",{class:"flex flex-wrap md-block"},"{ 'class': `flex flex-wrap md-block` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("tweet-box",{class:"block basis-third lg-basis-half",name:"Joff Tiquez",handle:"@jrtiquez",href:"https://twitter.com/jrtiquez",src:"https://github.com/jofftiquez.png"},"{ 'class': `block basis-third lg-basis-half`, 'name': `Joff Tiquez`, 'handle': `@jrtiquez`, 'href': `https://twitter.com/jrtiquez`, 'src': `https://github.com/jofftiquez.png` }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("p",{},"{ }",[e.TempleRegistry.createText("Im a vue developer. No need for this. OSSPH does not support this project.",!1)]),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("tweet-box",{class:"block basis-third lg-basis-half",name:"Primeagen",handle:"@theprimeagen",href:"https://twitter.com/ThePrimeagen",src:"https://pbs.twimg.com/profile_images/1759330620160049152/2i_wkOoK_400x400.jpg"},"{ 'class': `block basis-third lg-basis-half`, 'name': `Primeagen`, 'handle': `@theprimeagen`, 'href': `https://twitter.com/ThePrimeagen`, 'src': `https://pbs.twimg.com/profile_images/1759330620160049152/2i_wkOoK_400x400.jpg` }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("p",{},"{ }",[e.TempleRegistry.createText("Temple? Never heard of it...",!1),e.TempleRegistry.createElement("br",{},"{ }"),e.TempleRegistry.createText('"The Name..."',!1)]),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("tweet-box",{class:"block basis-third lg-basis-half",name:"Kristian Quirapas",handle:"@YourCompanyCTO",href:"https://twitter.com/YourCompanyCTO",src:"https://avatars.githubusercontent.com/u/85150796?v=4"},"{ 'class': `block basis-third lg-basis-half`, 'name': `Kristian Quirapas`, 'handle': `@YourCompanyCTO`, 'href': `https://twitter.com/YourCompanyCTO`, 'src': `https://avatars.githubusercontent.com/u/85150796?v=4` }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("p",{},"{ }",[e.TempleRegistry.createText("Temple is good news for Node developers. I'm a rust developer so it don't matter to me.",!1)]),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("tweet-box",{class:"block basis-third lg-basis-half",name:"Drizzle Team",handle:"@drizzle.team",href:"https://twitter.com/DrizzleORM",src:"https://pbs.twimg.com/profile_images/1767809210060877824/mAtEmNk0_400x400.jpg"},"{ 'class': `block basis-third lg-basis-half`, 'name': `Drizzle Team`, 'handle': `@drizzle.team`, 'href': `https://twitter.com/DrizzleORM`, 'src': `https://pbs.twimg.com/profile_images/1767809210060877824/mAtEmNk0_400x400.jpg` }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("p",{},"{ }",[e.TempleRegistry.createText("Temple copied this section from us. We are the original.",!1)]),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("tweet-box",{class:"block basis-third lg-basis-half",name:"Chris B",handle:"@cblanquera",href:"https://twitter.com/cblanquera",src:"https://avatars.githubusercontent.com/u/120378?v=4"},"{ 'class': `block basis-third lg-basis-half`, 'name': `Chris B`, 'handle': `@cblanquera`, 'href': `https://twitter.com/cblanquera`, 'src': `https://avatars.githubusercontent.com/u/120378?v=4` }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("p",{},"{ }",[e.TempleRegistry.createText("After creating the Temple project, I am really excited to get back to ReactJS.",!1)]),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("tweet-box",{class:"block basis-third lg-basis-half",name:"Theo",handle:"@t3dotgg",href:"https://twitter.com/t3dotgg",src:"https://yt3.googleusercontent.com/4NapxEtLcHQ6wN2zA_DMmkOk47RFb_gy6sjSmUZGg_ARHjlIUjFsrNFddrcKMkTYpBNxCp3J=s160-c-k-c0x00ffffff-no-rj"},"{ 'class': `block basis-third lg-basis-half`, 'name': `Theo`, 'handle': `@t3dotgg`, 'href': `https://twitter.com/t3dotgg`, 'src': `https://yt3.googleusercontent.com/4NapxEtLcHQ6wN2zA_DMmkOk47RFb_gy6sjSmUZGg_ARHjlIUjFsrNFddrcKMkTYpBNxCp3J=s160-c-k-c0x00ffffff-no-rj` }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("p",{},"{ }",[e.TempleRegistry.createText("Temple? no thanks. Keep your stack front end. App router for life.",!1)]),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
           `,!1)]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("tweet-box",{name:"Drizzle Team",handle:"@drizzle.team",href:"https://twitter.com/DrizzleORM",src:"https://pbs.twimg.com/profile_images/1767809210060877824/mAtEmNk0_400x400.jpg"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("p",{},[e.TempleRegistry.createText("Temple copied this section from us. We are the original.",!1)]),e.TempleRegistry.createText(`
+        `,!1)]),e.TempleRegistry.createText(`
+        `,!1),e.TempleRegistry.createElement("section",{class:"m-auto py-40 px-20 tx-center"},"{ 'class': `m-auto py-40 px-20 tx-center` }",[e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("h3",{class:"tx-26 mb-20"},"{ 'class': `tx-26 mb-20` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(i("What are you waiting for?")),e.TempleRegistry.createText(`
           `,!1)]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("tweet-box",{name:"Chris B",handle:"@cblanquera",href:"https://twitter.com/cblanquera",src:"https://avatars.githubusercontent.com/u/120378?v=4"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("p",{},[e.TempleRegistry.createText("After creating the Temple project, I am really excited to get back to ReactJS.",!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("tui-button",{primary:!0,xl:!0,rounded:!0,class:"inline-block",style:"margin-right:10px;",href:"/temple/docs/getting-started.html"},"{ 'primary': true, 'xl': true, 'rounded': true, 'class': `inline-block`, 'style': `margin-right:10px;`, 'href': `/temple/docs/getting-started.html` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(i("Get Started")),e.TempleRegistry.createText(`
           `,!1)]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("tweet-box",{name:"Theo",handle:"@t3dotgg",href:"https://twitter.com/t3dotgg",src:"https://yt3.googleusercontent.com/4NapxEtLcHQ6wN2zA_DMmkOk47RFb_gy6sjSmUZGg_ARHjlIUjFsrNFddrcKMkTYpBNxCp3J=s160-c-k-c0x00ffffff-no-rj"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("p",{},[e.TempleRegistry.createText("Temple? no thanks. Keep your stack front end. App router for life.",!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("tui-button",{secondary:!0,xl:!0,rounded:!0,class:"inline-block",href:"/temple/docs/index.html"},"{ 'secondary': true, 'xl': true, 'rounded': true, 'class': `inline-block`, 'href': `/temple/docs/index.html` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(i("Read the Docs")),e.TempleRegistry.createText(`
           `,!1)]),e.TempleRegistry.createText(`
         `,!1)]),e.TempleRegistry.createText(`
+        `,!1),e.TempleRegistry.createElement("footer",{class:"foot"},"{ 'class': `foot` }",[]),e.TempleRegistry.createText(`
       `,!1)]),e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("section",{class:"section-action"},[e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("h3",{},[...this._toNodeList(i("What are you waiting for?"))]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("tui-button",{primary:!0,xl:!0,rounded:!0,style:"margin-right:10px;",href:"/temple/docs/getting-started.html"},[e.TempleRegistry.createText(`
-          `,!1),...this._toNodeList(i("Get Started")),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("tui-button",{secondary:!0,xl:!0,rounded:!0,href:"/temple/docs/index.html"},[e.TempleRegistry.createText(`
-          `,!1),...this._toNodeList(i("Read the Docs")),e.TempleRegistry.createText(`
-        `,!1)]),e.TempleRegistry.createText(`
-      `,!1)]),e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("footer",{class:"foot"},[]),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
   `,!1)]),e.TempleRegistry.createText(`
-`,!1)])]}};return ie($e);})();
+`,!1)])]}};return re(Pe);})();
diff --git a/docs/build/server/f859bf7a335e9eba03e0.js b/docs/build/server/f859bf7a335e9eba03e0.js
index 3a30bc4..dce82dd 100644
--- a/docs/build/server/f859bf7a335e9eba03e0.js
+++ b/docs/build/server/f859bf7a335e9eba03e0.js
@@ -1,111 +1,227 @@
-var TempleAPI=(()=>{var ee=Object.create;var E=Object.defineProperty;var te=Object.getOwnPropertyDescriptor;var ae=Object.getOwnPropertyNames;var re=Object.getPrototypeOf,le=Object.prototype.hasOwnProperty;var c=(a,t)=>()=>(t||a((t={exports:{}}).exports,t),t.exports),se=(a,t)=>{for(var r in t)E(a,r,{get:t[r],enumerable:!0})},F=(a,t,r,l)=>{if(t&&typeof t=="object"||typeof t=="function")for(let n of ae(t))!le.call(a,n)&&n!==r&&E(a,n,{get:()=>t[n],enumerable:!(l=te(t,n))||l.enumerable});return a};var G=(a,t,r)=>(r=a!=null?ee(re(a)):{},F(t||!a||!a.__esModule?E(r,"default",{value:a,enumerable:!0}):r,a)),ne=a=>F(E({},"__esModule",{value:!0}),a);var O=c(j=>{"use strict";Object.defineProperty(j,"__esModule",{value:!0});var P=class extends Error{static for(t,...r){return r.forEach(function(l){t=t.replace("%s",l)}),new this(t)}static forErrorsFound(t){let r=new this("Invalid Parameters");return r.errors=t,r}static require(t,r,...l){if(!t){for(let n of l)r=r.replace("%s",n);throw new this(r)}}constructor(t,r=500){super(),this.errors={},this.start=0,this.end=0,this.message=t,this.name=this.constructor.name,this.code=r}withCode(t){return this.code=t,this}withPosition(t,r){return this.start=t,this.end=r,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};j.default=P});var q=c(M=>{"use strict";Object.defineProperty(M,"__esModule",{value:!0});var D=class{constructor(t=[]){this._elements=new Set,t.forEach(r=>this._elements.add(r))}add(t){this._elements.add(t)}toArray(){return Array.from(this._elements)}toString(){return Array.from(this._elements).filter(Boolean).map(t=>t.toString()).join("")}};M.default=D});var u=c(S=>{"use strict";Object.defineProperty(S,"__esModule",{value:!0});var ce=new Map;S.default=ce});var b=c(m=>{"use strict";var ie=m&&m.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(m,"__esModule",{value:!0});var oe=ie(q()),fe=["area","base","br","col","embed","hr","img","input","link","meta","param","source","track","wbr"],A=class{static render(t){return t.filter(Boolean).map(r=>r.toString()).join("")}get name(){return this._name}get attributes(){return this._attributes}get children(){return this._children}constructor(t,r={},l=[]){this._attributes={},this._name=t,this._attributes=r,this._children=new oe.default(l)}toString(){let t=Object.entries(this._attributes),r=t.length>0?" "+t.map(([n,f])=>{if(typeof f=="string")return`${n}="${f}"`;if(typeof f=="boolean")return f?n:""}).join(" "):"";if(fe.includes(this._name))return`<${this._name}${r} />`;let l=this._children.toString();return`<${this._name}${r}>${l}`}};m.default=A});var L=c(C=>{"use strict";Object.defineProperty(C,"__esModule",{value:!0});var I=class{get value(){return this._escape?this._value.replace(/&/g,"&").replace(//g,">"):this._value}constructor(t,r=!1){this._escape=r,this._value=t}toString(){return this.value}};C.default=I});var k=c(p=>{"use strict";var J=p&&p.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(p,"__esModule",{value:!0});var ue=J(L()),me=J(b()),$=class{static createElement(t,r,l=[]){return new me.default(t,r,l)}static createText(t,r=!0){return new ue.default(t,r)}};p.default=$});var V=c(h=>{"use strict";var y=h&&h.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(h,"__esModule",{value:!0});var pe=y(O()),B=y(u()),he=y(b()),de=y(k()),N=class{render(t={}){B.default.set("props",t||{}),B.default.set("env",Object.assign(Object.assign({},process.env||{}),{BUILD_ID:this.id(),APP_DATA:btoa(JSON.stringify(Object.assign(Object.assign({},Object.fromEntries(B.default.entries())),{env:Object.assign(Object.assign({},Object.fromEntries(Object.entries(process.env||{}).filter(n=>n[0].startsWith("PUBLIC_")))),{BUILD_ID:this.id()})})))}));let r=this.template(),l=he.default.render(r).trim();if(!l.toLowerCase().startsWith(" tag.");return`
-${l}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:Array.isArray(t)&&t.every(r=>typeof r=="object"&&typeof r.nodeType=="number")?t:[de.default.createText(String(t))]}};h.default=N});var Y=c(d=>{"use strict";Object.defineProperty(d,"__esModule",{value:!0});d.TempleEmitter=void 0;var v=class{emit(t,r){return this}on(t,r){return this}once(t,r){return this}unbind(t,r){return this}};d.TempleEmitter=v;var Te=new v;d.default=Te});var z=c(T=>{"use strict";var _e=T&&T.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(T,"__esModule",{value:!0});var xe=_e(u());function ge(a){let t=xe.default.get("env")||{};return a?t[a]||null:t}T.default=ge});var U=c(_=>{"use strict";var Ee=_&&_.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(_,"__esModule",{value:!0});_.default=ye;var be=Ee(u());function ye(){return be.default.get("props")||{}}});var H=c(x=>{"use strict";var ve=x&&x.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(x,"__esModule",{value:!0});x.default=Pe;var we=ve(U());function Pe(){return(0,we.default)().class}});var K=c(R=>{"use strict";Object.defineProperty(R,"__esModule",{value:!0});R.default=je;function je(a){let t={getter:()=>r.raw,setter:l=>l},r={raw:a,getter(l){return t.getter=l,r},setter(l){return t.setter=l,r}};return Object.defineProperty(r,"value",{get(){return t.getter()},set(l){r.raw=t.setter(l)}}),r}});var X=c(s=>{"use strict";var Oe=s&&s.__createBinding||(Object.create?function(a,t,r,l){l===void 0&&(l=r);var n=Object.getOwnPropertyDescriptor(t,r);(!n||("get"in n?!t.__esModule:n.writable||n.configurable))&&(n={enumerable:!0,get:function(){return t[r]}}),Object.defineProperty(a,l,n)}:function(a,t,r,l){l===void 0&&(l=r),a[l]=t[r]}),De=s&&s.__setModuleDefault||(Object.create?function(a,t){Object.defineProperty(a,"default",{enumerable:!0,value:t})}:function(a,t){a.default=t}),Me=s&&s.__importStar||function(a){if(a&&a.__esModule)return a;var t={};if(a!=null)for(var r in a)r!=="default"&&Object.prototype.hasOwnProperty.call(a,r)&&Oe(t,a,r);return De(t,a),t},i=s&&s.__importDefault||function(a){return a&&a.__esModule?a:{default:a}};Object.defineProperty(s,"__esModule",{value:!0});s.TempleText=s.TempleException=s.TempleEmitter=s.TempleElement=s.TempleRegistry=s.TempleDocument=s.TempleCollection=s.signal=s.classnames=s.props=s.emitter=s.env=s.data=void 0;var qe=i(O());s.TempleException=qe.default;var Se=i(q());s.TempleCollection=Se.default;var Ae=i(V());s.TempleDocument=Ae.default;var Ie=i(k());s.TempleRegistry=Ie.default;var Ce=i(b());s.TempleElement=Ce.default;var Q=Me(Y());s.emitter=Q.default;Object.defineProperty(s,"TempleEmitter",{enumerable:!0,get:function(){return Q.TempleEmitter}});var Le=i(L());s.TempleText=Le.default;var $e=i(u());s.data=$e.default;var ke=i(z());s.env=ke.default;var Be=i(U());s.props=Be.default;var Ne=i(H());s.classnames=Ne.default;var Ue=i(K());s.signal=Ue.default});var W=c((rt,Z)=>{Z.exports={...X()}});var We={};se(We,{default:()=>w});var e=G(W()),g=G(W());var o=function(a,...t){let r=Re(a);for(let l=0;l{document.body.classList.toggle("panel-left-open")};return[e.TempleRegistry.createText(`
-`,!1),e.TempleRegistry.createElement("html",{},[e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("head",{},[e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{charset:"utf-8"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"viewport",content:"width=device-width, initial-scale=1"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("title",{},[...this._toNodeList(r)]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"description",content:l}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:title",content:r}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:description",content:l}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:image",content:"https://ossphilippines.github.io/temple/temple-logo.png"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:url",content:`https://ossphilippines.github.io/temple${t}`}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{property:"og:type",content:"website"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:card",content:"summary"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:site",content:"@OSSPhilippines"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:title",content:r}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:description",content:l}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:image",content:"https://ossphilippines.github.io/temple/temple-logo.png"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"favicon",href:"/temple/favicon.ico"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"shortcut icon",type:"image/png",href:"/temple/favicon.png"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/fontawesome/all.css"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/theme.css"}),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:`/temple/build/client/${(0,g.env)("BUILD_ID")}.css`}),e.TempleRegistry.createText(`
+var TempleAPI=(()=>{var X=Object.create;var g=Object.defineProperty;var Z=Object.getOwnPropertyDescriptor;var ee=Object.getOwnPropertyNames;var te=Object.getPrototypeOf,le=Object.prototype.hasOwnProperty;var i=(l,t)=>()=>(t||l((t={exports:{}}).exports,t),t.exports),ae=(l,t)=>{for(var a in t)g(l,a,{get:t[a],enumerable:!0})},G=(l,t,a,s)=>{if(t&&typeof t=="object"||typeof t=="function")for(let n of ee(t))!le.call(l,n)&&n!==a&&g(l,n,{get:()=>t[n],enumerable:!(s=Z(t,n))||s.enumerable});return l};var R=(l,t,a)=>(a=l!=null?X(te(l)):{},G(t||!l||!l.__esModule?g(a,"default",{value:l,enumerable:!0}):a,l)),se=l=>G(g({},"__esModule",{value:!0}),l);var w=i(v=>{"use strict";Object.defineProperty(v,"__esModule",{value:!0});var E=class extends Error{static for(t,...a){return a.forEach(function(s){t=t.replace("%s",s)}),new this(t)}static forErrorsFound(t){let a=new this("Invalid Parameters");return a.errors=t,a}static require(t,a,...s){if(!t){for(let n of s)a=a.replace("%s",n);throw new this(a)}}constructor(t,a=500){super(),this.errors={},this.start=0,this.end=0,this.message=t,this.name=this.constructor.name,this.code=a}withCode(t){return this.code=t,this}withPosition(t,a){return this.start=t,this.end=a,this}toJSON(){return{error:!0,code:this.code,message:this.message}}};v.default=E});var L=i(P=>{"use strict";Object.defineProperty(P,"__esModule",{value:!0});var k=class{get length(){return this._elements.size}constructor(t=[]){this._elements=new Set,t.forEach(a=>this._elements.add(a))}add(t){this._elements.add(t)}toArray(){return Array.from(this._elements)}toString(){return Array.from(this._elements).filter(Boolean).map(t=>t.toString()).join("")}};P.default=k});var p=i(D=>{"use strict";Object.defineProperty(D,"__esModule",{value:!0});var re=new Map;D.default=re});var N=i(O=>{"use strict";Object.defineProperty(O,"__esModule",{value:!0});var j=class{get value(){return this._escape?this._value.replace(/&/g,"&").replace(//g,">"):this._value}constructor(t,a=!1){this._escape=a,this._value=t}toString(){return this.value}};O.default=j});var A=i(f=>{"use strict";var ce=f&&f.__importDefault||function(l){return l&&l.__esModule?l:{default:l}};Object.defineProperty(f,"__esModule",{value:!0});var ne=ce(L()),ie=["area","base","br","col","embed","hr","img","input","link","meta","param","source","track","wbr"],S=class{get attributes(){return this._attributes}get children(){return this._children}get name(){return this._name}get props(){return this._props}constructor(t,a={},s="",n=[]){this._attributes={},this._name=t,this._attributes=a,this._props=s,this._children=new ne.default(n)}toString(){let t=Object.entries(this._attributes),a=t.length>0?" "+t.map(([n,b])=>{if(typeof b=="string")return`${n}="${b}"`;if(typeof b=="boolean")return b?n:""}).join(" "):"";if(ie.includes(this._name))return`<${this._name}${a} />`;let s=this._children.toString();return`<${this._name}${a}>${s}`}};f.default=S});var M=i(m=>{"use strict";var F=m&&m.__importDefault||function(l){return l&&l.__esModule?l:{default:l}};Object.defineProperty(m,"__esModule",{value:!0});var oe=F(N()),W=F(A()),I=class{static render(t){return t.filter(Boolean).map(a=>a.toString()).join("")}static registry(t,a=new Set){return t.forEach(s=>{s instanceof W.default&&(["html","head","body"].includes(s.name)||a.add(s),s.name!=="head"&&s.children.length>0&&this.registry(s.children.toArray(),a))}),a}static createElement(t,a,s,n=[]){return new W.default(t,a,s,n)}static createText(t,a=!0){return new oe.default(t,a)}};m.default=I});var J=i(x=>{"use strict";var B=x&&x.__importDefault||function(l){return l&&l.__esModule?l:{default:l}};Object.defineProperty(x,"__esModule",{value:!0});var pe=B(w()),q=B(p()),C=B(M()),$=class{bindings(){let t=C.default.registry(this.template());return`{ ${Array.from(t.values()).map((s,n)=>s.props!=="{ }"?`'${n}': ${s.props}`:"").filter(s=>s!=="").join(", ")} }`}render(t={}){q.default.set("props",t||{}),q.default.set("env",Object.assign(Object.assign({},process.env||{}),{BUILD_ID:this.id(),APP_DATA:btoa(JSON.stringify(Object.assign(Object.assign({},Object.fromEntries(q.default.entries())),{env:Object.assign(Object.assign({},Object.fromEntries(Object.entries(process.env||{}).filter(n=>n[0].startsWith("PUBLIC_")))),{BUILD_ID:this.id()})})))}));let a=this.template(),s=C.default.render(a).trim();if(!s.toLowerCase().startsWith(" tag.");return`
+${s}`}_toNodeList(t){return typeof t=="object"&&typeof t.nodeType=="number"?[t]:Array.isArray(t)&&t.every(a=>typeof a=="object"&&typeof a.nodeType=="number")?t:[C.default.createText(String(t))]}};x.default=$});var z=i(h=>{"use strict";Object.defineProperty(h,"__esModule",{value:!0});h.TempleEmitter=void 0;var y=class{emit(t,a){return this}on(t,a){return this}once(t,a){return this}unbind(t,a){return this}};h.TempleEmitter=y;var fe=new y;h.default=fe});var V=i(u=>{"use strict";var me=u&&u.__importDefault||function(l){return l&&l.__esModule?l:{default:l}};Object.defineProperty(u,"__esModule",{value:!0});var xe=me(p());function he(l){let t=xe.default.get("env")||{};return l?t[l]||null:t}u.default=he});var Y=i(d=>{"use strict";var ue=d&&d.__importDefault||function(l){return l&&l.__esModule?l:{default:l}};Object.defineProperty(d,"__esModule",{value:!0});d.default=Te;var de=ue(p());function Te(){return de.default.get("props")||{}}});var K=i(c=>{"use strict";var be=c&&c.__createBinding||(Object.create?function(l,t,a,s){s===void 0&&(s=a);var n=Object.getOwnPropertyDescriptor(t,a);(!n||("get"in n?!t.__esModule:n.writable||n.configurable))&&(n={enumerable:!0,get:function(){return t[a]}}),Object.defineProperty(l,s,n)}:function(l,t,a,s){s===void 0&&(s=a),l[s]=t[a]}),ge=c&&c.__setModuleDefault||(Object.create?function(l,t){Object.defineProperty(l,"default",{enumerable:!0,value:t})}:function(l,t){l.default=t}),ye=c&&c.__importStar||function(l){if(l&&l.__esModule)return l;var t={};if(l!=null)for(var a in l)a!=="default"&&Object.prototype.hasOwnProperty.call(l,a)&&be(t,l,a);return ge(t,l),t},o=c&&c.__importDefault||function(l){return l&&l.__esModule?l:{default:l}};Object.defineProperty(c,"__esModule",{value:!0});c.TempleText=c.TempleException=c.TempleEmitter=c.TempleElement=c.TempleRegistry=c.TempleDocument=c.TempleCollection=c.props=c.emitter=c.env=c.data=void 0;var _e=o(w());c.TempleException=_e.default;var Ee=o(L());c.TempleCollection=Ee.default;var ve=o(J());c.TempleDocument=ve.default;var we=o(M());c.TempleRegistry=we.default;var ke=o(A());c.TempleElement=ke.default;var H=ye(z());c.emitter=H.default;Object.defineProperty(c,"TempleEmitter",{enumerable:!0,get:function(){return H.TempleEmitter}});var Pe=o(N());c.TempleText=Pe.default;var Le=o(p());c.data=Le.default;var De=o(V());c.env=De.default;var je=o(Y());c.props=je.default});var U=i((Fe,Q)=>{Q.exports={...K()}});var Ne={};ae(Ne,{default:()=>_});var e=R(U()),T=R(U());var r=function(l,...t){let a=Oe(l);for(let s=0;s{document.getElementsByTagName("panel-layout")[0].toggle("left")};return[e.TempleRegistry.createText(`
+`,!1),e.TempleRegistry.createElement("html",{},"{ }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("head",{},"{ }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{charset:"utf-8"},"{ 'charset': `utf-8` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"viewport",content:"width=device-width, initial-scale=1"},"{ 'name': `viewport`, 'content': `width=device-width, initial-scale=1` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("title",{},"{ }",[...this._toNodeList(a)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"description",content:s},"{ 'name': `description`, 'content': description }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:title",content:a},"{ 'property': `og:title`, 'content': title }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:description",content:s},"{ 'property': `og:description`, 'content': description }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:image",content:"https://ossphilippines.github.io/temple/temple-logo.png"},"{ 'property': `og:image`, 'content': `https://ossphilippines.github.io/temple/temple-logo.png` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:url",content:`https://ossphilippines.github.io/temple${t}`},"{ 'property': `og:url`, 'content': `https://ossphilippines.github.io/temple${url}` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{property:"og:type",content:"website"},"{ 'property': `og:type`, 'content': `website` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:card",content:"summary"},"{ 'name': `twitter:card`, 'content': `summary` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:site",content:"@OSSPhilippines"},"{ 'name': `twitter:site`, 'content': `@OSSPhilippines` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:title",content:a},"{ 'name': `twitter:title`, 'content': title }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:description",content:s},"{ 'name': `twitter:description`, 'content': description }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("meta",{name:"twitter:image",content:"https://ossphilippines.github.io/temple/temple-logo.png"},"{ 'name': `twitter:image`, 'content': `https://ossphilippines.github.io/temple/temple-logo.png` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"favicon",href:"/temple/favicon.ico"},"{ 'rel': `favicon`, 'href': `/temple/favicon.ico` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"shortcut icon",type:"image/png",href:"/temple/favicon.png"},"{ 'rel': `shortcut icon`, 'type': `image/png`, 'href': `/temple/favicon.png` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/fontawesome/all.css"},"{ 'rel': `stylesheet`, 'type': `text/css`, 'href': `/temple/styles/fontawesome/all.css` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:"/temple/styles/global.css"},"{ 'rel': `stylesheet`, 'type': `text/css`, 'href': `/temple/styles/global.css` }"),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("link",{rel:"stylesheet",type:"text/css",href:`/temple/build/client/${(0,T.env)("BUILD_ID")}.css`},"{ 'rel': `stylesheet`, 'type': `text/css`, 'href': `/temple/build/client/${env('BUILD_ID')}.css` }"),e.TempleRegistry.createText(`
   
-  `,!1),e.TempleRegistry.createElement("script",{"data-app":(0,g.env)("APP_DATA"),src:`/temple/build/client/${(0,g.env)("BUILD_ID")}.js`}),e.TempleRegistry.createText(`
-  `,!1),...(0,g.env)("NODE_ENV")==="development"?[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("script",{src:"/dev.js"}),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("script",{"data-app":(0,T.env)("APP_DATA"),src:`/temple/build/client/${(0,T.env)("BUILD_ID")}.js`},"{ 'data-app': env('APP_DATA'), 'src': `/temple/build/client/${env('BUILD_ID')}.js` }"),e.TempleRegistry.createText(`
+  `,!1),...(0,T.env)("NODE_ENV")==="development"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("script",{src:"/dev.js"},"{ 'src': `/dev.js` }"),e.TempleRegistry.createText(`
   `,!1)]:[],e.TempleRegistry.createText(`
 `,!1)]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("body",{class:"dark panel with-head with-left"},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("header",{class:"head panel-head"},[e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("i",{class:"menu fas fa-fw fa-bars",click:n},[]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("a",{href:"/temple"},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("img",{src:"/temple/temple-icon.png",alt:"Temple Logo"}),e.TempleRegistry.createText(`
-  `,!1)]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("h3",{},[e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple"},[e.TempleRegistry.createText("Temple",!1)])]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("nav",{},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple/docs/index.html"},[e.TempleRegistry.createText("Docs",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{class:"github",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-github"},[]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("body",{class:"dark bg-t-0 tx-t1 arial"},"{ 'class': `dark bg-t-0 tx-t1 arial` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("panel-layout",{},"{ }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("panel-head",{},"{ }",[e.TempleRegistry.createElement("menu",{class:"flex flex-center-y px-20 py-15 m-0 bg-t-1"},"{ 'class': `flex flex-center-y px-20 py-15 m-0 bg-t-1` }",[e.TempleRegistry.createText(`
+  `,!1),...t!=="/temple/index.html"&&t!=="/temple/500.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-bars cursor-pointer py-5 pr-10 none md-inline-block tx-t-1",click:n},"{ 'class': `fas fa-fw fa-bars cursor-pointer py-5 pr-10 none md-inline-block tx-t-1`, 'click': toggle }",[]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("div",{class:"flex-grow"},"{ 'class': `flex-grow` }",[]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{href:"/temple"},"{ 'href': `/temple` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("img",{alt:"Temple Logo",class:"h-26 mr-10",src:"/temple/temple-icon.png"},"{ 'alt': `Temple Logo`, 'class': `h-26 mr-10`, 'src': `/temple/temple-icon.png` }"),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("h3",{class:"flex-grow tx-uppercase"},"{ 'class': `flex-grow tx-uppercase` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple"},"{ 'class': `tx-white`, 'href': `/temple` }",[e.TempleRegistry.createText("Temple",!1)]),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("nav",{class:"flex flex-center-y"},"{ 'class': `flex flex-center-y` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple/docs/index.html"},"{ 'class': `tx-white`, 'href': `/temple/docs/index.html` }",[e.TempleRegistry.createText("Docs",!1)]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"tx-t-1 tx-5xl ml-10",href:"https://github.com/OSSPhilippines/temple",target:"_blank"},"{ 'class': `tx-t-1 tx-5xl ml-10`, 'href': `https://github.com/OSSPhilippines/temple`, 'target': `_blank` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-github"},"{ 'class': `fab fa-github` }",[]),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{class:"npm",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-npm text-white"},[]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"bg-h-cb3837 pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://www.npmjs.com/package/@ossph/temple",target:"_blank"},"{ 'class': `bg-h-cb3837 pill tx-t-1 tx-lg ml-5 p-5 tx-center`, 'href': `https://www.npmjs.com/package/@ossph/temple`, 'target': `_blank` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-npm text-white"},"{ 'class': `fab fa-npm text-white` }",[]),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{class:"discord",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-discord text-white"},[]),e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"bg-h-7289da pill tx-t-1 tx-lg ml-5 p-5 tx-center",href:"https://discord.gg/open-source-software-ph-905496362982981723",target:"_blank"},"{ 'class': `bg-h-7289da pill tx-t-1 tx-lg ml-5 p-5 tx-center`, 'href': `https://discord.gg/open-source-software-ph-905496362982981723`, 'target': `_blank` }",[e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("i",{class:"fab fa-discord text-white"},"{ 'class': `fab fa-discord text-white` }",[]),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
   `,!1)]),e.TempleRegistry.createText(`
+`,!1)])]),e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("panel-left",{},"{ }",[e.TempleRegistry.createElement("header",{class:"flex flex-center-y bg-t-2 py-15 pr-5 pl-10"},"{ 'class': `flex flex-center-y bg-t-2 py-15 pr-5 pl-10` }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("a",{href:"/temple"},"{ 'href': `/temple` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("img",{class:"h-26 mr-10",src:"/temple/temple-icon.png",alt:"Temple Logo"},"{ 'class': `h-26 mr-10`, 'src': `/temple/temple-icon.png`, 'alt': `Temple Logo` }"),e.TempleRegistry.createText(`
+  `,!1)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("h3",{class:"flex-grow m-0 tx-uppercase"},"{ 'class': `flex-grow m-0 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple"},"{ 'class': `tx-white`, 'href': `/temple` }",[e.TempleRegistry.createText("Temple",!1)]),e.TempleRegistry.createText(`
+  `,!1)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-left cursor-pointer none md-inline-block",click:n},"{ 'class': `fas fa-fw fa-chevron-left cursor-pointer none md-inline-block`, 'click': toggle }",[]),e.TempleRegistry.createText(`
 `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("aside",{class:"left panel-left"},[e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("header",{},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("img",{src:"/temple/temple-icon.png",alt:"Temple Logo"}),e.TempleRegistry.createText(`
-    `,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("h3",{},[e.TempleRegistry.createElement("a",{class:"tx-white",href:"/temple"},[e.TempleRegistry.createText("Temple",!1)])]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("i",{class:"toggle fas fa-fw fa-chevron-left",click:n},[]),e.TempleRegistry.createText(`
+`,!1),e.TempleRegistry.createElement("nav",{class:"bg-t-1 scroll-auto h-calc-full-60"},"{ 'class': `bg-t-1 scroll-auto h-calc-full-60` }",[e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("h6",{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-0 pt-20 pb-10 pl-10 tx-uppercase"},"{ 'class': `bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-0 pt-20 pb-10 pl-10 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),...this._toNodeList(r("Introduction")),e.TempleRegistry.createText(`
   `,!1)]),e.TempleRegistry.createText(`
-  `,!1),e.TempleRegistry.createElement("nav",{},[e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("h6",{},[e.TempleRegistry.createText("Introduction",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/index.html"},[e.TempleRegistry.createText("Documentation",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/getting-started.html"},[e.TempleRegistry.createText("Getting Started",!1)]),e.TempleRegistry.createText(`
-
-    `,!1),e.TempleRegistry.createElement("h6",{},[e.TempleRegistry.createText("Features",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/markup-syntax.html"},[e.TempleRegistry.createText("Markup Syntax",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/state-management.html"},[e.TempleRegistry.createText("State Management",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/component-strategy.html"},[e.TempleRegistry.createText("Component Strategy",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/compiler-api.html"},[e.TempleRegistry.createText("Compiler API",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/client-api.html"},[e.TempleRegistry.createText("Client API",!1)]),e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/index.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/index.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/index.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Documentation")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/index.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/index.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Documentation")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/getting-started.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/getting-started.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/getting-started.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Getting Started")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/getting-started.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/getting-started.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Getting Started")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
 
-    `,!1),e.TempleRegistry.createElement("h6",{},[e.TempleRegistry.createText("Usage",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/template-engine.html"},[e.TempleRegistry.createText("Template Engine",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/single-page.html"},[e.TempleRegistry.createText("Single Page App",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/static-site.html"},[e.TempleRegistry.createText("Static Site Generator",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/component-publisher.html"},[e.TempleRegistry.createText("Component Publisher",!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("a",{href:"/temple/docs/developer-tools.html"},[e.TempleRegistry.createText("Developer Tools",!1)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("h6",{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},"{ 'class': `bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),...this._toNodeList(r("Features")),e.TempleRegistry.createText(`
   `,!1)]),e.TempleRegistry.createText(`
-`,!1)]),e.TempleRegistry.createText(`
-    `,!1),e.TempleRegistry.createElement("panel-main",{class:"panel-main"},[e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("div",{class:"docs container"},[e.TempleRegistry.createText(`
-        `,!1),e.TempleRegistry.createElement("h1",{},[...this._toNodeList(o("Client API"))]),e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/markup-syntax.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/markup-syntax.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/markup-syntax.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Markup Syntax")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/markup-syntax.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/markup-syntax.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Markup Syntax")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/state-management.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/state-management.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/state-management.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("State Management")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/state-management.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/state-management.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("State Management")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/component-strategy.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/component-strategy.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/component-strategy.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Component Strategy")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-strategy.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/component-strategy.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Component Strategy")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/compiler-api.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/compiler-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/compiler-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Compiler API")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/compiler-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/compiler-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Compiler API")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/client-api.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/client-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/client-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Client API")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/client-api.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/client-api.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Client API")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0},[e.TempleRegistry.createText(`
-          Temple exposes a variable on the browser called 
-          `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},[e.TempleRegistry.createText("TempleAPI",!1)]),e.TempleRegistry.createText(` that includes all the 
-          components, classes, functions and variables used to render
-          the document on the client-side. 
-        `,!1)]),e.TempleRegistry.createText(`
+  `,!1),e.TempleRegistry.createElement("h6",{class:"bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase"},"{ 'class': `bt-1 bt-solid bt-t-1 tx-muted tx-14 mb-0 mt-20 pt-20 pb-10 pl-10 tx-uppercase` }",[e.TempleRegistry.createText(`
+    `,!1),...this._toNodeList(r("Usage")),e.TempleRegistry.createText(`
+  `,!1)]),e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/template-engine.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/template-engine.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/template-engine.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Template Engine")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/template-engine.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/template-engine.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Template Engine")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/single-page.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/single-page.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/single-page.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Single Page App")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/single-page.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/single-page.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Single Page App")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/static-site.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/static-site.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/static-site.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Static Site Generator")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/static-site.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/static-site.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Static Site Generator")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/component-publisher.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold",href:"/temple/docs/component-publisher.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold`, 'href': `/temple/docs/component-publisher.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Component Publisher")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10",href:"/temple/docs/component-publisher.html"},"{ 'class': `block tx-t-1 py-10 pl-10`, 'href': `/temple/docs/component-publisher.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Component Publisher")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+  `,!1),...t==="/docs/developer-tools.html"?[e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 tx-bold mb-100",href:"/temple/docs/developer-tools.html"},"{ 'class': `block tx-t-1 py-10 pl-10 tx-bold mb-100`, 'href': `/temple/docs/developer-tools.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Developer Tools")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)]:[,e.TempleRegistry.createText(`
+    `,!1),e.TempleRegistry.createElement("a",{class:"block tx-t-1 py-10 pl-10 mb-100",href:"/temple/docs/developer-tools.html"},"{ 'class': `block tx-t-1 py-10 pl-10 mb-100`, 'href': `/temple/docs/developer-tools.html` }",[e.TempleRegistry.createText(`
+      `,!1),...this._toNodeList(r("Developer Tools")),e.TempleRegistry.createText(`
+    `,!1)]),e.TempleRegistry.createText(`
+  `,!1)],e.TempleRegistry.createText(`
+`,!1)])]),e.TempleRegistry.createText(`
+      `,!1),e.TempleRegistry.createElement("panel-main",{},"{ }",[e.TempleRegistry.createText(`
+        `,!1),e.TempleRegistry.createElement("api-docs",{},"{ }",[e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("h1",{class:"tx-primary tx-uppercase tx-30 py-20"},"{ 'class': `tx-primary tx-uppercase tx-30 py-20` }",[e.TempleRegistry.createText(`
+            `,!1),...this._toNodeList(r("Client API")),e.TempleRegistry.createText(`
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("tui-alert",{curved:!0,secondary:!0},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-exclamation-triangle"},[]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("strong",{},[e.TempleRegistry.createText("Warning:",!1)]),e.TempleRegistry.createText(` Using the client API in the wrong 
-          way could possibly break your client application.
-        `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("i18n-translate",{p:!0,trim:!0,class:"tx-lh-36 py-20"},"{ 'p': true, 'trim': true, 'class': `tx-lh-36 py-20` }",[e.TempleRegistry.createText(`
+            Temple exposes a variable on the browser called 
+            `,!1),e.TempleRegistry.createElement("ide-code",{inline:!0},"{ 'inline': true }",[e.TempleRegistry.createText("TempleAPI",!1)]),e.TempleRegistry.createText(` that includes all the 
+            components, classes, functions and variables used to render
+            the document on the client-side. 
+          `,!1)]),e.TempleRegistry.createText(`
 
-        `,!1),e.TempleRegistry.createElement("api-ui",{start:"TempleAPI"}),e.TempleRegistry.createText(`
-        
-        `,!1),e.TempleRegistry.createElement("nav",{class:"pager"},[e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("a",{class:"prev",href:"/temple/docs/compiler-api.html"},[e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-left"},[]),e.TempleRegistry.createText(`
-            `,!1),...this._toNodeList(o("Compiler API")),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("tui-alert",{curved:!0,secondary:!0,class:"py-20 tx-lh-24"},"{ 'curved': true, 'secondary': true, 'class': `py-20 tx-lh-24` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-exclamation-triangle"},"{ 'class': `fas fa-exclamation-triangle` }",[]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("strong",{},"{ }",[e.TempleRegistry.createText("Warning:",!1)]),e.TempleRegistry.createText(` Using the client API in the wrong 
+            way could possibly break your client application.
           `,!1)]),e.TempleRegistry.createText(`
-          `,!1),e.TempleRegistry.createElement("a",{class:"next",href:"/temple/docs/template-engine.html"},[e.TempleRegistry.createText(`
-            `,!1),...this._toNodeList(o("Template Engine")),e.TempleRegistry.createText(`
-            `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-right"},[]),e.TempleRegistry.createText(`
+
+          `,!1),e.TempleRegistry.createElement("api-ui",{start:"TempleAPI"},"{ 'start': `TempleAPI` }"),e.TempleRegistry.createText(`
+
+          `,!1),e.TempleRegistry.createElement("nav",{class:"flex"},"{ 'class': `flex` }",[e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"tx-primary py-40",href:"/temple/docs/compiler-api.html"},"{ 'class': `tx-primary py-40`, 'href': `/temple/docs/compiler-api.html` }",[e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-left tx-t-1"},"{ 'class': `fas fa-fw fa-chevron-left tx-t-1` }",[]),e.TempleRegistry.createText(`
+              `,!1),...this._toNodeList(r("Compiler API")),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
+            `,!1),e.TempleRegistry.createElement("a",{class:"flex-grow tx-right tx-primary py-40",href:"/temple/docs/template-engine.html"},"{ 'class': `flex-grow tx-right tx-primary py-40`, 'href': `/temple/docs/template-engine.html` }",[e.TempleRegistry.createText(`
+              `,!1),...this._toNodeList(r("Template Engine")),e.TempleRegistry.createText(`
+              `,!1),e.TempleRegistry.createElement("i",{class:"fas fa-fw fa-chevron-right tx-t-1"},"{ 'class': `fas fa-fw fa-chevron-right tx-t-1` }",[]),e.TempleRegistry.createText(`
+            `,!1)]),e.TempleRegistry.createText(`
           `,!1)]),e.TempleRegistry.createText(`
+          `,!1),e.TempleRegistry.createElement("footer",{class:"foot"},"{ 'class': `foot` }",[]),e.TempleRegistry.createText(`
         `,!1)]),e.TempleRegistry.createText(`
       `,!1)]),e.TempleRegistry.createText(`
-      `,!1),e.TempleRegistry.createElement("footer",{class:"foot"},[]),e.TempleRegistry.createText(`
     `,!1)]),e.TempleRegistry.createText(`
   `,!1)]),e.TempleRegistry.createText(`
-`,!1)])]}};return ne(We);})();
+`,!1)])]}};return se(Ne);})();
diff --git a/docs/docs/client-api.html b/docs/docs/client-api.html
index 6945732..f9e8bf8 100644
--- a/docs/docs/client-api.html
+++ b/docs/docs/client-api.html
@@ -18,91 +18,148 @@
   
   
   
-  
+  
   
   
   
   
 
-  
-    
          
-  
-  
-    Temple Logo
-  
-  
          Temple
          
-  
+      
+        
+          
          
+            Client API
+          
          
+
+          
+            Temple exposes a variable on the browser called 
+            TempleAPI that includes all the 
+            components, classes, functions and variables used to render
+            the document on the client-side. 
+          
 
-        
-          Temple exposes a variable on the browser called 
-          TempleAPI that includes all the 
-          components, classes, functions and variables used to render
-          the document on the client-side. 
-        
+          
+            
+            Warning: Using the client API in the wrong 
+            way could possibly break your client application.
+          
 
-        
-          
-          Warning: Using the client API in the wrong 
-          way could possibly break your client application.
-        
+          
 
-        
-        
-        
-      
-      
          
-              
+          
+          
          
+        
+      
+    
   
 
\ No newline at end of file
diff --git a/docs/docs/compiler-api.html b/docs/docs/compiler-api.html
index b9e13c9..95f7c96 100644
--- a/docs/docs/compiler-api.html
+++ b/docs/docs/compiler-api.html
@@ -18,100 +18,157 @@
   
   
   
-  
+  
   
   
   
   
 
-  
-    
          
-  
-  
-    Temple Logo
-  
-  
          Temple
          
-  
+      
+        
+          
          
+            Compiler API
+          
          
+
+          
+            The developer interface for the Temple compiler is designed 
+            to be expressive and easily access the Temple library in most 
+            scenarios. To create a new temple compiler you can follow the 
+            code below.
+          
+          
+            import temple from '@ossph/temple';
+            const compiler = temple();
+           
+            
+            The temple() 
+            function itself takes in the following options, all of 
+            which are optional.
+          
 
-        
-          The developer interface for the Temple compiler is designed 
-          to be expressive and easily access the Temple library in most 
-          scenarios. To create a new temple compiler you can follow the 
-          code below.
-        
-        
-          import temple from '@ossph/temple';
-          const compiler = temple();
-         
-          
-          The temple() 
-          function itself takes in the following options, all of 
-          which are optional.
-        
+          
+          
+            Calling temple() as in 
+            compiler = temple({/*options*/}) 
+            returns the Temple compiler which contains the following object.
+          
+          
 
-        
-        
-          Calling temple() as in 
-          compiler = temple({/*options*/}) 
-          returns the Temple compiler which contains the following object.
-        
-        
-        
-        
-      
-      
          
-              
+          
+          
          
+        
+      
+    
   
 
\ No newline at end of file
diff --git a/docs/docs/component-publisher.html b/docs/docs/component-publisher.html
index 0a4ed03..efa5823 100644
--- a/docs/docs/component-publisher.html
+++ b/docs/docs/component-publisher.html
@@ -18,123 +18,178 @@
   
   
   
-  
+  
   
   
   
   
 
-  
-    
          
-  
-  
-    Temple Logo
-  
-  
          Temple
          
-  
+      
+        
+          
          
+            Component Publisher
+          
          
 
-        
-          Web components are a set of web platform APIs that allow you 
-          to create new custom, reusable, encapsulated HTML tags to use 
-          in web pages and web apps. Custom components and widgets build 
-          on the Web Component standards, will work across modern 
-          browsers, and can be used with any JavaScript library or 
-          framework that works with HTML.
-        
+          
+            Web components are a set of web platform APIs that allow you 
+            to create new custom, reusable, encapsulated HTML tags to use 
+            in web pages and web apps. Custom components and widgets build 
+            on the Web Component standards, will work across modern 
+            browsers, and can be used with any JavaScript library or 
+            framework that works with HTML.
+          
 
-        
-          Web components are based on existing web standards. Features 
-          to support web components are currently being added to the 
-          HTML and DOM specs, letting web developers easily extend HTML 
-          with new elements with encapsulated styling and custom behavior.
-        
+          
+            Web components are based on existing web standards. Features 
+            to support web components are currently being added to the 
+            HTML and DOM specs, letting web developers easily extend HTML 
+            with new elements with encapsulated styling and custom behavior.
+          
 
-        
-          
-          Note: Web components even work in React 
-          projects.
-        
+          
+            
+            Note: Web components even work in React 
+            projects.
+          
 
-        
-          First, create a project with the following structure and files.
-        
-        
-          
          
-            
          
-              
-                src/build.ts
+          
+            First, create a project with the following structure and files.
+          
+          
+            
+              
          
+                
+                  src/build.ts
+                
+                
+                  src/component.tml
+                
+                
+                  package.json
+                
+              
          
+                      
+            
+              
          
+                
+                src
+              
          
+              
+                
+                build.ts
               
-              
-                src/component.tml
+              
+                
+                component.tml
               
-              
+              
+                
                 package.json
               
-            
          
-          
          
-          
          
-            
          
-              
-              src
-            
          
-            
-              
-              build.ts
-            
-            
-              
-              component.tml
-            
-            
-              
-              package.json
-            
-          
          
-          
          
-            
          
+            
+            
               
                 import http from 'http';
                 import temple from '@ossph/temple/compiler';
@@ -167,40 +222,40 @@ 
          
                     "build": "ts-node ./src/build.ts"
                   },
                   "dependencies": {
-                    "@ossph/temple": "0.1.4"
+                    "@ossph/temple": "0.1.6"
                   },
                   "devDependencies": {
-                    "@ossph/temple-dev": "0.1.4",
+                    "@ossph/temple-dev": "0.1.6",
                     "@types/node": "22.1.0",
                     "ts-node": "10.9.2",
                     "typescript": "5.5.4"
                   }
                 }
               
-            
          
-          
          
-                  
+            
+          
 
-        
-          To test the build script and see the results, run the 
-          following command in terminal.
-        
-        
-          npm run build
-        
-        
-        
-      
-      
          
-              
+          
+            To test the build script and see the results, run the 
+            following command in terminal.
+          
+          
+            npm run build
+          
+          
+          
+          
          
+        
+      
+    
   
 
\ No newline at end of file
diff --git a/docs/docs/component-strategy.html b/docs/docs/component-strategy.html
index 7033be5..2dcba3e 100644
--- a/docs/docs/component-strategy.html
+++ b/docs/docs/component-strategy.html
@@ -18,162 +18,223 @@
   
   
   
-  
+  
   
   
   
   
 
-  
-    
          
-  
-  
-    Temple Logo
-  
-  
          Temple
          
-  
+      
+        
+          
          
+            On this page
+          
          
+          
+                  
+                
+      
+        
+          
          
+            Component Strategy
+          
          
+
+          
+            There are three types of components in Temple: Document, 
+            Template, and Component. Each type of component has a 
+            different strategy for rendering and updating the DOM. The 
+            Document component is the root component of the application 
+            and is responsible for rendering the entire application. The 
+            Template component is a reusable component that can be used 
+            in multiple places in the application. The Component component 
+            is a custom component that can be used to create complex UI 
+            elements.
+          
+
+          
+          
          
+            Document
+          
          
+
+          
+            A document denoted by files with the 
+            .dtml extension, is the root of
+            each page view that should include the document markup 
+            starting with <html>. While 
+            it looks like another Temple component, there are some key 
+            differences in how it is used.
+          
+
+          
            
+            
          • 
+              
+                A document logic (<script>)
+                is executed on the client side but is not a 
+                TempleComponent, which means 
+                it cannot be re-rendered and does not have access to 
+                this context.
+              
+            
            • 
+            
          • 
+              
+                A document props() are the 
+                server props passed down to the client.
+              
+            
            • 
+            
          • 
+              
+                A document does not have access to NodeJS functionality. So 
+                things like fs are not available.
+              
+            
            • 
+          
          
+
+          
+            
+            Recommendation: You should do server related
+            logic on the server framework and pass the neccesary data 
+            to the client.
+          
+
+          
+            
+              
          
+                
+                  src/index.ts
+                
+                
+                  src/page.dtml
+                
+              
          
+                      
+            
+              
          
+                
+                src
+              
          
+              
+                
+                index.ts
               
-              
-                src/page.dtml
+              
+                
+                page.dtml
               
-            
-          
-          
          
-            
          
-              
-              src
-            
          
-            
-              
-              index.ts
-            
-            
-              
-              page.dtml
-            
-          
          
-          
          
-            
          
-              
+            
+            
+              
                 import http from 'http';
                 import temple from '@ossph/temple/compiler';
 
@@ -185,7 +246,7 @@ 
          
                   }));
                 });
               
-              
          
-          
          
-                  
-
-        
-        
          Template
          
-
-        
-          A template is resuable partial markup that can be imported by 
-          a component, document or another template. A template is 
-          not is not a TempleComponent, but 
-          rather adds its markup to the parent component's final markup.
-          You will not see a template in the DOM, but rather the
-          markup it contains.
-        
-
-        
-          For example, consider a document that contains the following 
-          markup.
-        
-
-        
-          <script>
-            const title = 'Hello World';
-          </script>
-          <html>
-            <head>
-              <meta charset="utf-8" />
-              <title>{title}</title>
-            </head>
-            <body>
-              <h1>{title}</h1>
-            </body>
-          </html>
-        
-
-        
-          You can create a template for the head of your
-          document and then import it. This allows you to
-          reuse the head markup in multiple documents.
-        
-
-        
-          
          
-            
          
-              
-                src/page.dtml
+            
+          
+
+          
+          
          
+            Template
+          
          
+
+          
+            A template is resuable partial markup that can be imported by 
+            a component, document or another template. A template is 
+            not is not a TempleComponent, but 
+            rather adds its markup to the parent component's final markup.
+            You will not see a template in the DOM, but rather the
+            markup it contains.
+          
+
+          
+            For example, consider a document that contains the following 
+            markup.
+          
+
+          
+            <script>
+              const title = 'Hello World';
+            </script>
+            <html>
+              <head>
+                <meta charset="utf-8" />
+                <title>{title}</title>
+              </head>
+              <body>
+                <h1>{title}</h1>
+              </body>
+            </html>
+          
+
+          
+            You can create a template for the head of your
+            document and then import it. This allows you to
+            reuse the head markup in multiple documents.
+          
+
+          
+            
+              
          
+                
+                  src/page.dtml
+                
+                
+                  src/head.tml
+                
+              
          
+                      
+            
+              
          
+                
+                src
+              
          
+              
+                
+                page.dtml
               
-              
-                src/head.tml
+              
+                
+                head.tml
               
-            
          
-          
          
-          
          
-            
          
-              
-              src
-            
          
-            
-              
-              page.dtml
-            
-            
-              
-              head.tml
-            
-          
          
-          
          
-            
          
-              
+            
+            
+              
                 <link rel="import" type="template" href="./head.tml" name="html-head" />
                 <script>
                   const title = 'Hello World';
@@ -278,98 +339,100 @@ 
          
                   </body>
                 </html>
               
-              
          
-          
          
-                  
-
-        
-          
-          Note: Template partials do not process 
-          attributes or children if given.
-        
-
-        
-          Variables used in a template should be declared in the
-          parent component or document. This allows you to pass
-          data to the template from the parent.
-        
-
-        
-        
          Component
          
-
-        
-          All temple components are 
-          TempleComponent that extends
-          HTMLElement and therefore is 
-          both a web component and element just like any other element 
-          in the browser DOM. Components that do not use the
-          <style> tag are affected by 
-          the global styles of the application. Components with the
-          <style> tag enable the 
-          component's shadow DOM and will encapsulate the styles within
-          the component and not be affected by global styles. With that 
-          said, there are several strategies that can be applied to 
-          Temple components.
-        
-
-        
-        
          Strategy 1: No Components
          
-
-        
-          This strategy uses only documents and templates. This 
-          strategy is useful for simple applications that do not require 
-          complex UI elements. This is the best strategy for 
-          performant applications.
-        
-
-        
-          
          
-            
          
-              
-                src/page.dtml
+            
+          
+
+          
+            
+            Note: Template partials do not process 
+            attributes or children if given.
+          
+
+          
+            Variables used in a template should be declared in the
+            parent component or document. This allows you to pass
+            data to the template from the parent.
+          
+
+          
+          
          
+            Component
+          
          
+
+          
+            All temple components are 
+            TempleComponent that extends
+            HTMLElement and therefore is 
+            both a web component and element just like any other element 
+            in the browser DOM. Components that do not use the
+            <style> tag are affected by 
+            the global styles of the application. Components with the
+            <style> tag enable the 
+            component's shadow DOM and will encapsulate the styles within
+            the component and not be affected by global styles. With that 
+            said, there are several strategies that can be applied to 
+            Temple components.
+          
+
+          
+          
          
+            Strategy 1: No Components
+          
          
+
+          
+            This strategy uses only documents and templates. This 
+            strategy is useful for simple applications that do not require 
+            complex UI elements. This is the best strategy for 
+            performant applications.
+          
+
+          
+            
+              
          
+                
+                  src/page.dtml
+                
+                
+                  src/head.tml
+                
+                
+                  src/header.tml
+                
+                
+                  src/footer.tml
+                
+              
          
+                      
+            
+              
          
+                
+                src
+              
          
+              
+                
+                page.dtml
               
-              
-                src/head.tml
+              
+                
+                head.tml
               
-              
-                src/header.tml
+              
+                
+                header.tml
               
-              
-                src/footer.tml
+              
+                
+                footer.tml
               
-            
          
-          
          
-          
          
-            
          
-              
-              src
-            
          
-            
-              
-              page.dtml
-            
-            
-              
-              head.tml
-            
-            
-              
-              header.tml
-            
-            
-              
-              footer.tml
-            
-          
          
-          
          
-            
          
-              
+            
+            
+              
                 <link rel="import" type="template" href="./head.tml" name="html-head" />
                 <link rel="import" type="template" href="./header.tml" name="page-header" />
                 <link rel="import" type="template" href="./footer.tml" name="page-footer" />
@@ -389,7 +452,7 @@ 
          
                   </body>
                 </html>
               
-              
          
-          
          
-                  
-
-        
-        
          Strategy 2: Shallow Components
          
-
-        
-          This strategy uses components that do not have a 
-          <style> tag and is useful for 
-          applications that require complex logic in components but 
-          using a shared global stylesheet.
-        
-
-        
-          
          
-            
          
-              
-                src/page.dtml
+            
+          
+
+          
+          
          
+            Strategy 2: Shallow Components
+          
          
+
+          
+            This strategy uses components that do not have a 
+            <style> tag and is useful for 
+            applications that require complex logic in components but 
+            using a shared global stylesheet.
+          
+
+          
+            
+              
          
+                
+                  src/page.dtml
+                
+                
+                  src/header.tml
+                
+                
+                  src/footer.tml
+                
+              
          
+                      
+            
+              
          
+                
+                src
+              
          
+              
+                
+                page.dtml
               
-              
-                src/header.tml
+              
+                
+                header.tml
               
-              
-                src/footer.tml
+              
+                
+                footer.tml
               
-            
          
-          
          
-          
          
-            
          
-              
-              src
-            
          
-            
-              
-              page.dtml
-            
-            
-              
-              header.tml
-            
-            
-              
-              footer.tml
-            
-          
          
-          
          
-            
          
-              
+            
+            
+              
                 <link rel="import" type="component" href="./header.tml" name="page-header" />
                 <link rel="import" type="component" href="./footer.tml" name="page-footer" />
                 <script>
@@ -486,7 +549,7 @@ 
          
                   </body>
                 </html>
               
-              
          
-          
          
-                  
-
-        
-        
          Strategy 3: Partial Styling
          
-
-        
-          This strategy uses components that do not have a 
-          <style> tag,
-          but imports style via the 
-          <link> tag to utilize both 
-          global styles and specific styles that are needed for the
-          component. 
-        
-
-        
-          
          
-            
          
-              
-                src/page.dtml
+            
+          
+
+          
+          
          
+            Strategy 3: Partial Styling
+          
          
+
+          
+            This strategy uses components that do not have a 
+            <style> tag,
+            but imports style via the 
+            <link> tag to utilize both 
+            global styles and specific styles that are needed for the
+            component. 
+          
+
+          
+            
+              
          
+                
+                  src/page.dtml
+                
+                
+                  src/header.tml
+                
+                
+                  src/footer.tml
+                
+              
          
+                      
+            
+              
          
+                
+                src
+              
          
+              
+                
+                page.dtml
               
-              
-                src/header.tml
+              
+                
+                header.tml
               
-              
-                src/footer.tml
+              
+                
+                footer.tml
               
-            
          
-          
          
-          
          
-            
          
-              
-              src
-            
          
-            
-              
-              page.dtml
-            
-            
-              
-              header.tml
-            
-            
-              
-              footer.tml
-            
-          
          
-          
          
-            
          
-              
          
-          
          
-                  
-
-        
-        
          Strategy 4: Encapulation
          
-
-        
-          This strategy uses components that have a
-          <style> tag and encapsulates
-          the styles within the component. This strategy is useful for
-          applications that require complex UI elements that need to be
-          styled in a specific way. This is also useful for components 
-          that are designed to be used in multiple projects.
-        
-
-        
-          
          
-            
          
-              
-                src/page.dtml
+            
+          
+
+          
+          
          
+            Strategy 4: Encapulation
+          
          
+
+          
+            This strategy uses components that have a
+            <style> tag and encapsulates
+            the styles within the component. This strategy is useful for
+            applications that require complex UI elements that need to be
+            styled in a specific way. This is also useful for components 
+            that are designed to be used in multiple projects.
+          
+
+          
+            
+              
          
+                
+                  src/page.dtml
+                
+                
+                  src/header.tml
+                
+                
+                  src/footer.tml
+                
+              
          
+                      
+            
+              
          
+                
+                src
+              
          
+              
+                
+                page.dtml
               
-              
-                src/header.tml
+              
+                
+                header.tml
               
-              
-                src/footer.tml
+              
+                
+                footer.tml
               
-            
          
-          
          
-          
          
-            
          
-              
-              src
-            
          
-            
-              
-              page.dtml
-            
-            
-              
-              header.tml
-            
-            
-              
-              footer.tml
-            
-          
          
-          
          
-            
          
-              
          
-          
          
-                  
-
-        
-        
          Flash of Unstyled Content
          
-
-        
-          Web Components (custom elements) are 100% defined in 
-          JavaScript. That includes their HTML and CSS. Those are 
-          programmatically added to the DOM through APIs. By the time 
-          the browser has interpreted and executed that code, there is 
-          a good chance that the rendering pipeline has already put the 
-          custom element on the screen. Since the browser doesn't know 
-          about the element the first time around it will render it 
-          without the intended styling. After the JavaScript of the 
-          custom element definition is executed and the browser, 
-          therefore, knows about the CSS rules that apply to that 
-          element it can update the view.
-        
-
-        
-          A flash of unstyled content (FOUC) can cause irritating layout 
-          shifts as well as reveal content that should have been 
-          progressively disclosed. In order to prevent a reflow of other 
-          content you can add the following general solution to your 
-          global stylesheet.
-        
-
-        
-          *:not(:defined) {
-            opacity: 0;
-          }
-        
-
-        
-          This style will apply to all elements that are not defined,
-          which are usually web components and will hide the content 
-          until the browser has fully rendered the component.
-        
-        
-        
-      
-      
          
-              
+            
+          
+
+          
+          
          Flash of Unstyled Content
          
+
+          
+            Web Components (custom elements) are 100% defined in 
+            JavaScript. That includes their HTML and CSS. Those are 
+            programmatically added to the DOM through APIs. By the time 
+            the browser has interpreted and executed that code, there is 
+            a good chance that the rendering pipeline has already put the 
+            custom element on the screen. Since the browser doesn't know 
+            about the element the first time around it will render it 
+            without the intended styling. After the JavaScript of the 
+            custom element definition is executed and the browser, 
+            therefore, knows about the CSS rules that apply to that 
+            element it can update the view.
+          
+
+          
+            A flash of unstyled content (FOUC) can cause irritating layout 
+            shifts as well as reveal content that should have been 
+            progressively disclosed. In order to prevent a reflow of other 
+            content you can add the following general solution to your 
+            global stylesheet.
+          
+
+          
+            *:not(:defined) {
+              opacity: 0;
+            }
+          
+
+          
+            This style will apply to all elements that are not defined,
+            which are usually web components and will hide the content 
+            until the browser has fully rendered the component.
+          
+
+          
+          
          
+        
+      
+    
   
 
\ No newline at end of file
diff --git a/docs/docs/developer-tools.html b/docs/docs/developer-tools.html
index a6b248e..cf574f8 100644
--- a/docs/docs/developer-tools.html
+++ b/docs/docs/developer-tools.html
@@ -18,157 +18,214 @@
   
   
   
-  
+  
   
   
   
   
 
-  
-    
          
-  
-  
-    Temple Logo
-  
-  
          Temple
          
-  
+      
+        
+          
          
+            Developer Tools
+          
          
 
-        
-          Temple provides a separate package for a better development 
-          experience when working with server frameworks that utilize 
-          the native http module. Start by installing adding 
-          '@ossph/temple-dev'
-          to your project.
-        
-        
-          
-            npm install --save-dev @ossph/temple-dev
-          
-        
-        
-          Next, import the dev() 
-          function from the package and use it in your existing 
-          'src/index.ts' 
-          file to create a development server as shown in the example below.
-        
-        
-          
-            import http from 'http';
-            import temple from '@ossph/temple/compiler';
-            import { dev } from '@ossph/temple-dev';
+          
+            Temple provides a separate package for a better development 
+            experience when working with server frameworks that utilize 
+            the native http module. Start by installing adding 
+            @ossph/temple-dev
+            to your project.
+          
+          
+            
+              npm install --save-dev @ossph/temple-dev
+            
+          
+          
+            Next, import the dev() 
+            function from the package and use it in your existing 
+            src/index.ts 
+            file to create a development server as shown in the example below.
+          
+          
+            
+              import http from 'http';
+              import temple from '@ossph/temple/compiler';
+              import { dev } from '@ossph/temple-dev';
 
-            //create temple compiler
-            const compiler = temple({ cwd: __dirname });
-            //1. create dev tools
-            const { router, refresh } = dev({ cwd: __dirname });
+              //create temple compiler
+              const compiler = temple({ cwd: __dirname });
+              //1. create dev tools
+              const { router, refresh } = dev({ cwd: __dirname });
 
-            //create http server
-            const server = http.createServer(async (req, res) => {
-              //2. Add dev router
-              if (router(req, res)) return;
-              //if home page
-              if (req.url === '/') {
-                //3. sync builder with refresh server
-                refresh.sync(compiler.fromSource('./page.dtml'));
-                //compile the document
-                const html = await compiler.render('./page.dtml');
-                //... send response ...
-              }
-              //... other routes ...
-            });
-            //listen on port 3000
-            server.listen(3000);
-          
-        
-        
-          Lastly, update the document file 
-          'src/page.dtml' 
-          to include the development script 
-          <script src="/dev.js"></script> 
-          as shown below.
-        
-        
-          
-            <script>
-              //... 
-            </script>
-            <html>
-              <head>
-                <!-- ... -->
-                <!-- 4. include dev script -->
-                <script src="/dev.js"></script>
-              </head>
-              <body>
-                <!-- ... -->
-              </body>
-            </html>
-          
-        
-        
-          Run the following command in terminal.
-        
-        
-          
-            npx ts-node src/index.ts
-          
-        
-        
-          Whenever 'src/page.dtml' 
-          is updated, the development server will automatically refresh 
-          the page. Components will also be updated in real-time.
-        
-        
-        
-      
-      
          
-              
+              //create http server
+              const server = http.createServer(async (req, res) => {
+                //2. Add dev router
+                if (router(req, res)) return;
+                //if home page
+                if (req.url === '/') {
+                  //3. sync builder with refresh server
+                  refresh.sync(compiler.fromSource('./page.dtml'));
+                  //compile the document
+                  const html = await compiler.render('./page.dtml');
+                  //... send response ...
+                }
+                //... other routes ...
+              });
+              //listen on port 3000
+              server.listen(3000);
+            
+          
+          
+            Lastly, update the document file 
+            src/page.dtml 
+            to include the development script 
+            <script src="/dev.js"></script> 
+            as shown below.
+          
+          
+            
+              <script>
+                //... 
+              </script>
+              <html>
+                <head>
+                  <!-- ... -->
+                  <!-- 4. include dev script -->
+                  <script src="/dev.js"></script>
+                </head>
+                <body>
+                  <!-- ... -->
+                </body>
+              </html>
+            
+          
+          
+            Run the following command in terminal.
+          
+          
+            
+              npx ts-node src/index.ts
+            
+          
+          
+            Whenever src/page.dtml 
+            is updated, the development server will automatically refresh 
+            the page. Components will also be updated in real-time.
+          
+          
+          
+          
          
+        
+      
+    
   
 
\ No newline at end of file
diff --git a/docs/docs/getting-started.html b/docs/docs/getting-started.html
index 09e4a04..a6fb98d 100644
--- a/docs/docs/getting-started.html
+++ b/docs/docs/getting-started.html
@@ -18,195 +18,267 @@
   
   
   
-  
+  
   
   
   
   
 
-  
-    
          
-  
-  
-    Temple Logo
-  
-  
          Temple
          
-  
+      
+        
+          
          
+            On this page
+          
          
+          
+                  
+                
+      
+        
+          
          
+            Getting Started
+          
          
+
+          
+            To try out Temple, run the following commands in terminal: 
+          
+          
+            
+              npm init -y && npm install --save @ossph/temple && npm install --save-dev ts-node typescript @types/node
+            
+          
+          
+            
+            Recommended:
+            Download the Temple editor plugin at the Visual Studio Marketplace.
+          
+          
+            Create a server file called
+            src/index.ts 
+            with the following code that uses the compiler.
+          
+
+          
+            
+              import temple from '@ossph/temple/compiler';
+              // make a temple compiler
+              const compiler = temple();
+              // render HTML
+              compiler.render('./src/page.dtml').then(console.log);
+              // render CSS
+              compiler.styles('./src/page.dtml').then(console.log);
+              // render JS
+              compiler.client('./src/page.dtml').then(console.log);
+            
+          
+          
+            Last, create a document file called
+            src/page.dtml 
+            with the following template code.
+          
+          
+            
+              <style>
+                .center { text-align: center; }
+              </style>
+              <script>
+                import { env } from '@ossph/temple';
+                const { BUILD_ID, APP_DATA } = env();
+                const title = 'Hello World';
+              </script>
+              <html>
+                <head>
+                  <title>{title}</title>
+                  <link rel="stylesheet" type="text/css" href={`/build/${BUILD_ID}.css`} />
+                  <script data-app={APP_DATA} src={`/build/${BUILD_ID}.js`}></script>
+                </head>
+                <body>
+                  <h1 class="center">{title}</h1>
+                </body>
+              </html>
+            
+          
+          
+            To try out the basic implementation of Temple and see the 
+            results, just run the following command in terminal.
+          
+          
+            
+              npx ts-node src/index.ts
+            
+          
+
+          
+          
          
+            1. Add HTTP
+          
          
+
+          
+            In most cases Temple will be used to render a front end from 
+            a server framework. In this example, we will use the native
+            NodeJS HTTP module to create a server that renders a page
+            using Temple. Start by replacing the 
+            'src/index.ts'
+            file with the following code. 
+          
+
+          
+            
+            Optional: You can also check your other 
+            files to make sure you are following along.
+          
+
+          
+            
+              
          
+                
+                  src/index.ts
+                
+                
+                  src/page.dtml
+                
+                
+                  package.json
+                
+              
          
+                      
+            
+              
          
+                
+                src
+              
          
+              
+                
+                index.ts
               
-              
-                src/page.dtml
+              
+                
+                page.dtml
               
-              
+              
+                
                 package.json
               
-            
-          
-          
          
-            
          
-              
-              src
-            
          
-            
-              
-              index.ts
-            
-            
-              
-              page.dtml
-            
-            
-              
-              package.json
-            
-          
          
-          
          
-            
          
-              
+            
+            
+              
                 import http from 'http';
                 import temple from '@ossph/temple/compiler';
 
@@ -235,7 +307,7 @@ 
          
                 // listen on port 3000
                 server.listen(3000);
               
-              
          
-          
          
-                  
-
-        
-          To run your first Temple web app, just run the following 
-          command in terminal.
-        
-        
-          
-            npx ts-node src/index.ts
-          
-        
-
-        
-          You can now check 
-          http://localhost:3000/ 
-          in your browser to see your Temple application. The 
-          temple() 
-          function takes in the following options, all of 
-          which are optional.
-        
-
-        
-
-        
-          The example above also uses two rendering methods
-          async compiler.asset() which 
-          returns the rendered source code of a build file and 
-          async compiler.render() which
-          returns the rendered source code of a template file.
-          The compiler provides several other methods for
-          generating source code in JavaScript, CSS, and HTML.
-        
-
-        
-
-        
-        
          2. Add Developer Tools
          
-
-        
-          Temple provides a separate package for a better development 
-          experience when working with server frameworks that utilize 
-          the native http module. Start by installing adding 
-          @ossph/temple-dev
-          to your project.
-        
-        
-          
-            npm install --save-dev @ossph/temple-dev
-          
-        
-        
-          Next, import the dev() 
-          function from the package and use it in your existing 
-          src/index.ts 
-          file to create a development server as shown in the example below.
-        
-        
-          
-            // ...
-            import { dev } from '@ossph/temple-dev';
-            // ...create temple compiler...
-            // 1. create dev tools
-            const { router, refresh } = dev();
-
-            const server = http.createServer(async (req, res) => {
-              // 2. Add dev router
-              if (router(req, res)) return;
-
-              if (req.url?.startsWith('/build/')) {
-                // ...
-              } else if (req.url === '/') {
-                // 3. sync builder with refresh server
-                refresh.sync(compiler.fromSource('./src/page.dtml'));
-                // ... compile and send response ...
-              }
-            });
-            //...listen on port 3000...
-          
-        
-        
-          The dev() export 
-          from  @ossph/temple-dev
-          exports tools that supports development mode and accepts the 
-          following options.
-        
-
-        
-
-        
-          This returns several tools you can use in your server app.
-        
-
-        
-
-        
-          Lastly, update the document file 
-          src/page.dtml 
-          to include the development script 
-          <script src="/dev.js"></script> 
-          as shown below.
-        
-        
-          
-            <style>
-              /* ... */
-            </style>
-            <script>
-              //... 
-            </script>
-            <html>
-              <head>
-                <!-- ... -->
-                <!-- 4. include dev script -->
-                <script src="/dev.js"></script>
-              </head>
-              <body>
-                <!-- ... -->
-              </body>
-            </html>
-          
-        
-
-        
-          The project should now look like the example below.
-        
-
-        
-          
          
-            
          
-              
-                src/index.ts
+            
+          
+
+          
+            To run your first Temple web app, just run the following 
+            command in terminal.
+          
+          
+            
+              npx ts-node src/index.ts
+            
+          
+
+          
+            You can now check 
+            http://localhost:3000/ 
+            in your browser to see your Temple application. The 
+            temple() 
+            function takes in the following options, all of 
+            which are optional.
+          
+
+          
+
+          
+          
          
+            2. Add Developer Tools
+          
          
+
+          
+            Temple provides a separate package for a better development 
+            experience when working with server frameworks that utilize 
+            the native http module. Start by installing adding 
+            @ossph/temple-dev
+            to your project.
+          
+          
+            
+              npm install --save-dev @ossph/temple-dev
+            
+          
+          
+            Next, import the dev() 
+            function from the package and use it in your existing 
+            src/index.ts 
+            file to create a development server as shown in the example below.
+          
+          
+            
+              // ...
+              import { dev } from '@ossph/temple-dev';
+              // ...create temple compiler...
+              // 1. create dev tools
+              const { router, refresh } = dev();
+
+              const server = http.createServer(async (req, res) => {
+                // 2. Add dev router
+                if (router(req, res)) return;
+
+                if (req.url?.startsWith('/build/')) {
+                  // ...
+                } else if (req.url === '/') {
+                  // 3. sync builder with refresh server
+                  refresh.sync(compiler.fromSource('./src/page.dtml'));
+                  // ... compile and send response ...
+                }
+              });
+              //...listen on port 3000...
+            
+          
+          
+            The dev() export 
+            from  @ossph/temple-dev
+            exports tools that supports development mode and accepts the 
+            following options.
+          
+
+          
+
+          
+            This returns several tools you can use in your server app.
+          
+
+          
+
+          
+            Lastly, update the document file 
+            src/page.dtml 
+            to include the development script 
+            <script src="/dev.js"></script> 
+            as shown below.
+          
+          
+            
+              <style>
+                /* ... */
+              </style>
+              <script>
+                //... 
+              </script>
+              <html>
+                <head>
+                  <!-- ... -->
+                  <!-- 4. include dev script -->
+                  <script src="/dev.js"></script>
+                </head>
+                <body>
+                  <!-- ... -->
+                </body>
+              </html>
+            
+          
+
+          
+            The project should now look like the example below.
+          
+
+          
+            
+              
          
+                
+                  src/index.ts
+                
+                
+                  src/page.dtml
+                
+                
+                  package.json
+                
+              
          
+                      
+            
+              
          
+                
+                src
+              
          
+              
+                
+                index.ts
               
-              
-                src/page.dtml
+              
+                
+                page.dtml
               
-              
+              
+                
                 package.json
               
-            
          
-          
          
-          
          
-            
          
-              
-              src
-            
          
-            
-              
-              index.ts
-            
-            
-              
-              page.dtml
-            
-            
-              
-              package.json
-            
-          
          
-          
          
-            
          
-              
+            
+            
+              
                 import http from 'http';
                 import temple from '@ossph/temple/compiler';
                 import { dev } from '@ossph/temple-dev';
@@ -465,7 +525,7 @@ 
          
                 });
                 server.listen(3000);
               
-              
          
-          
          
-                  
-
-        
-          Re-run the following command in terminal. It shouldn't look 
-          like anything has changed, but the development server is now
-          running in the background. Try to change
-          src/page.dtml.
-        
-        
-          
-            npx ts-node src/index.ts
-          
-        
-        
-          Whenever src/page.dtml 
-          is saved, the development server will automatically refresh 
-          the page. Components will also be updated in real-time without
-          the page reloading.
-        
-
-        
-        
          3. Add Cache Files
          
-
-        
-          Temple has an out-of-the-box cache and build strategy that
-          can be used to store and serve pre-compiled files. To use the
-          cache, you just need to import it from the 
-          @ossph/temple/compiler 
-          module and use it like the following example.
-        
-
-        
-          
-            // ...
-            import path from 'path';
-            import { cache } from '@ossph/temple/compiler';
-            // ...create temple compiler...
-            // 1. use cache
-            compiler.use(cache({
-              buildPath: path.join(__dirname, '../build')
-            }));
-            // ...create dev tools...
-            // ...create http server...
-            // ...listen on port 3000...
-          
-        
-
-        
-          The src/index.ts 
-          file should now look like the example below.
-        
-
-        
-          
-            import path from 'path';
-            import http from 'http';
-            import temple, { cache } from '@ossph/temple/compiler';
-            import { dev } from '@ossph/temple-dev';
-
-            const compiler = temple();
-            // 1. use cache
-            compiler.use(cache({
-              buildPath: path.join(__dirname, '../build')
-            }));
-            const { router, refresh } = dev();
-            const server = http.createServer(async (req, res) => {
-              if (router(req, res)) return;
-              if (req.url?.startsWith('/build/')) {
-                const filename = req.url.substring(7);
-                const { type, content } = await compiler.asset(filename);
-                res.writeHead(200, { 'Content-Type': type });
-                return res.end(content);
-              } else if (req.url === '/') {
-                refresh.sync(compiler.fromSource('./src/page.dtml'));
-                res.writeHead(200, { 'Content-Type': 'text/html' });
-                return res.end(await compiler.render('./src/page.dtml', {
-                  title: 'Hello World'
-                }));
-              }
-            });
-            server.listen(3000);
-          
-        
-
-        
-          Re-run the following command in terminal to start the cache 
-          server.
-        
-        
-          
-            npx ts-node src/index.ts
-          
-        
-        
-          Load 
-          http://localhost:3000/ 
-          in your browser. After loading you should see files that were 
-          generated in a new build folder found in your project root. 
-          The cache() plugin is 
-          just a wrapper that listens for build related events and
-          stores the generated files in the specified build path.
-        
-
-        
-          
-            emitter.on('manifest-resolved', (event: Event<string>) => {
-              const manifest = event.params.manifest as Manifest
-              //write the manifest to the file system
-              writeFile(paths.manifest, manifest.toJson());
-            });
-
-            // on pre render, try to use cache if live
-            emitter.on('render', (event: Event<string>) => {
-              //if not live, dont retrieve from cache
-              if (environment !== 'production') return;
-              //extract props and builder from params
-              const props = (event.params.props || {}) as Hash;
-              const builder = event.params.builder as Builder;
-              //get fs and id ie. abc123c
-              const { fs, id } = builder.document;
-              //get cache file path ie. /path/to/docs/build/client/abc123c.js
-              const cache = path.join(paths.build, 'server', `${id}.js`);
-              //if production and cache file exists
-              if (fs.existsSync(cache)) {
-                //get the build object
-                const build = compiler.fromCache(cache);
-                //render the document
-                const html = build.document.render(props);
-                //return the cached content
-                event.set(html);
-              }
-            });
-
-            // on post render, cache (dev and live)
-            emitter.on('rendered', (event: Event<string>) => {
-              //extract build and builder from params
-              const builder = event.params.builder as Builder;
-              const html = event.params.html as string;
-              //get fs and id ie. abc123c
-              const { id } = builder.document;
-              //get cache file path ie. /path/to/docs/build/client/abc123c.html
-              const cache = path.join(paths.build, 'client', `${id}.html`);
-              //write the server source code to cache
-              writeFile(cache, html);
-            });
-
-            // on pre client build, try to use cache if live
-            emitter.on('build-client', (event: Event<string>) => {
-              //if not live, dont retrieve from cache
-              if (environment !== 'production') return;
-              //extract builder from params
-              const builder = event.params.builder as Builder;
-              //get fs and id ie. abc123c
-              const id = builder.document.id;
-              //get cache file path ie. /path/to/docs/build/client/abc123c.js
-              const cache = path.join(paths.build, 'client', `${id}.js`);
-              //if cache file exists, send it
-              if (fs.existsSync(cache)) {
-                event.set(fs.readFileSync(cache, 'utf8'));
+            
+          
+
+          
+            Re-run the following command in terminal. It shouldn't look 
+            like anything has changed, but the development server is now
+            running in the background. Try to change
+            src/page.dtml.
+          
+          
+            
+              npx ts-node src/index.ts
+            
+          
+          
+            Whenever src/page.dtml 
+            is saved, the development server will automatically refresh 
+            the page. Components will also be updated in real-time without
+            the page reloading.
+          
+
+          
+          
          
+            3. Add Cache Files
+          
          
+
+          
+            Temple has an out-of-the-box cache and build strategy that
+            can be used to store and serve pre-compiled files. To use the
+            cache, you just need to import it from the 
+            @ossph/temple/compiler 
+            module and use it like the following example.
+          
+
+          
+            
+              // ...
+              import path from 'path';
+              import { cache } from '@ossph/temple/compiler';
+              // ...create temple compiler...
+              // 1. use cache
+              compiler.use(cache({
+                buildPath: path.join(__dirname, '../build')
+              }));
+              // ...create dev tools...
+              // ...create http server...
+              // ...listen on port 3000...
+            
+          
+
+          
+            The src/index.ts 
+            file should now look like the example below.
+          
+
+          
+            
+              import path from 'path';
+              import http from 'http';
+              import temple, { cache } from '@ossph/temple/compiler';
+              import { dev } from '@ossph/temple-dev';
+
+              const compiler = temple();
+              // 1. use cache
+              compiler.use(cache({
+                buildPath: path.join(__dirname, '../build')
+              }));
+              const { router, refresh } = dev();
+              const server = http.createServer(async (req, res) => {
+                if (router(req, res)) return;
+                if (req.url?.startsWith('/build/')) {
+                  const filename = req.url.substring(7);
+                  const { type, content } = await compiler.asset(filename);
+                  res.writeHead(200, { 'Content-Type': type });
+                  return res.end(content);
+                } else if (req.url === '/') {
+                  refresh.sync(compiler.fromSource('./src/page.dtml'));
+                  res.writeHead(200, { 'Content-Type': 'text/html' });
+                  return res.end(await compiler.render('./src/page.dtml', {
+                    title: 'Hello World'
+                  }));
+                }
+              });
+              server.listen(3000);
+            
+          
+
+          
+            Re-run the following command in terminal to start the cache 
+            server.
+          
+          
+            
+              npx ts-node src/index.ts
+            
+          
+          
+            Load 
+            http://localhost:3000/ 
+            in your browser. After loading you should see files that were 
+            generated in a new build folder found in your project root. 
+            The cache() plugin is 
+            just a wrapper that listens for build related events and
+            stores the generated files in the specified build path.
+          
+
+          
+            
+              emitter.on('manifest-resolved', (event: Event<string>) => {
+                const manifest = event.params.manifest as Manifest
+                //write the manifest to the file system
+                writeFile(paths.manifest, manifest.toJson());
+              });
+
+              // on pre render, try to use cache if live
+              emitter.on('render', (event: Event<string>) => {
+                //if not live, dont retrieve from cache
+                if (environment !== 'production') return;
+                //extract props and builder from params
+                const props = (event.params.props || {}) as Hash;
+                const builder = event.params.builder as Builder;
+                //get fs and id ie. abc123c
+                const { fs, id } = builder.document;
+                //get cache file path ie. /path/to/docs/build/client/abc123c.js
+                const cache = path.join(paths.build, 'server', `${id}.js`);
+                //if production and cache file exists
+                if (fs.existsSync(cache)) {
+                  //get the build object
+                  const build = compiler.fromCache(cache);
+                  //render the document
+                  const html = build.document.render(props);
+                  //return the cached content
+                  event.set(html);
+                }
+              });
+
+              // on post render, cache (dev and live)
+              emitter.on('rendered', (event: Event<string>) => {
+                //extract build and builder from params
+                const builder = event.params.builder as Builder;
+                const html = event.params.html as string;
+                //get fs and id ie. abc123c
+                const { id } = builder.document;
+                //get cache file path ie. /path/to/docs/build/client/abc123c.html
+                const cache = path.join(paths.build, 'client', `${id}.html`);
+                //write the server source code to cache
+                writeFile(cache, html);
+              });
+
+              // on pre client build, try to use cache if live
+              emitter.on('build-client', (event: Event<string>) => {
+                //if not live, dont retrieve from cache
+                if (environment !== 'production') return;
+                //extract builder from params
+                const builder = event.params.builder as Builder;
+                //get fs and id ie. abc123c
+                const id = builder.document.id;
+                //get cache file path ie. /path/to/docs/build/client/abc123c.js
+                const cache = path.join(paths.build, 'client', `${id}.js`);
+                //if cache file exists, send it
+                if (fs.existsSync(cache)) {
+                  event.set(fs.readFileSync(cache, 'utf8'));
+                }
+              });
+
+              // on post client build, cache (dev and live)
+              emitter.on('built-client', (event: Event<string>) => {
+                //extract builder and sourcecode from params
+                const builder = event.params.builder as Builder;
+                const sourceCode = event.params.sourceCode as string;
+                //get fs and id ie. abc123c
+                const id = builder.document.id;
+                //get cache file path ie. /path/to/docs/build/client/abc123c.js
+                const cache = path.join(paths.build, 'client', `${id}.js`);
+                //write the client source code to cache
+                writeFile(cache, sourceCode);
+              });
+
+              // on pre markup build, try to use cache if live
+              emitter.on('build-markup', /* ... */);
+              //on post markup build, cache (dev and live)
+              emitter.on('built-markup', /* ... */);
+              //on pre server build, try to use cache if live
+              emitter.on('build-server', /* ... */);
+              //on post server build, cache (dev and live)
+              emitter.on('built-server', /* ... */);
+              //on pre styles build, try to use cache if live
+              emitter.on('build-styles', /* ... */);
+              //on post styles build, cache (dev and live)
+              emitter.on('built-styles', /* ... */);
+
+              // Initialize: if there's a manifest
+              if (fs.existsSync(paths.manifest)) {
+                //load the manifest file
+                compiler.manifest.load(
+                  JSON.parse(fs.readFileSync(paths.manifest, 'utf-8'))
+                );
               }
-            });
-
-            // on post client build, cache (dev and live)
-            emitter.on('built-client', (event: Event<string>) => {
-              //extract builder and sourcecode from params
-              const builder = event.params.builder as Builder;
-              const sourceCode = event.params.sourceCode as string;
-              //get fs and id ie. abc123c
-              const id = builder.document.id;
-              //get cache file path ie. /path/to/docs/build/client/abc123c.js
-              const cache = path.join(paths.build, 'client', `${id}.js`);
-              //write the client source code to cache
-              writeFile(cache, sourceCode);
-            });
-
-            // on pre markup build, try to use cache if live
-            emitter.on('build-markup', /* ... */);
-            //on post markup build, cache (dev and live)
-            emitter.on('built-markup', /* ... */);
-            //on pre server build, try to use cache if live
-            emitter.on('build-server', /* ... */);
-            //on post server build, cache (dev and live)
-            emitter.on('built-server', /* ... */);
-            //on pre styles build, try to use cache if live
-            emitter.on('build-styles', /* ... */);
-            //on post styles build, cache (dev and live)
-            emitter.on('built-styles', /* ... */);
-
-            // Initialize: if there's a manifest
-            if (fs.existsSync(paths.manifest)) {
-              //load the manifest file
-              compiler.manifest.load(
-                JSON.parse(fs.readFileSync(paths.manifest, 'utf-8'))
-              );
-            }
-          
-        
-
-        
-          This means you can also use your own cache strategy by 
-          listening to the events emitted by the compiler. The
-          following table lists all the events that the compiler
-          emits during the build cycle of a document.
-        
-
-        
-
-        
-        
          4. Add TailwindCSS
          
-
-        
-          Tailwind is an atomic CSS collection of styles that favours 
-          small, single-purpose classes with their selector names based 
-          on its visual function. It works by using a build process to
-          read your source files to generate its styles based only on 
-          what is being used. This makes using Tailwind optimal because
-          it doesn't bloat your CSS with unused styles.
-        
-
-        
-          At the same time, web components with the
-          <style> tag imply using the 
-          component's shadow DOM which will encapsulate the styles within
-          the component and not be affected by global styles. Since 
-          Tailwind in turn implies that you do not need to (necessarily) 
-          define styles, you do not need to use the shadow DOM at all if
-          you are using Tailwind.
-        
-
-        
-          
-          Warning:
-          The caveat for using TailwindCSS, means that web components 
-          using it will not be shippable to other projects that do not
-          use Tailwind. It all comes down to preference in the end.
-        
-
-        
-          Temple has a separate package called
-          @ossph/temple-tailwind
-          to use TailwindCSS with Temple. This is just another wrapper 
-          class that listens to the compiler's build events. You can 
-          install this plugin by running the following command in terminal.
-        
-
-        
-          
-            npm install --save-dev @ossph/temple-tailwind autoprefixer postcss tailwindcss
-          
-        
-
-        
-          Next, in src/index.ts
-          import the tailwind()
-          plugin from the package and use it in the compiler as shown
-          in the example below.
-        
-
-        
-          
-            // ...
-            import { tailwind } from '@ossph/temple-tailwind';
-            // ...create temple compiler...
-            // ...use cache...
-            // 1. Use Tailwind
-            compiler.use(tailwind({
-              darkMode: 'class',
-              theme: { extend: {} },
-              plugins: [],
-              content: []
-            }));
-
-            // ...create dev tools...
-            // ...create http server...
-            // ...listen on port 3000...
-          
-        
-
-        
-          Lastly, in src/page.dtml
-          add the Tailwind directives inside the 
-          <style> tag like the code 
-          below. Also add a tailwind class, (like 
-          <style>) to the 
-          markup to verify that the plugin is working and the styles 
-          are being applied.
-        
-        
-        
-          
-            <style>
-              /* 2. Add tailwind directives */
-              @tailwind base;
-              @tailwind components;
-              @tailwind utilities;
-
-              /* ...Other styles... */
-            </style>
-            <script>
-              //... 
-            </script>
-            <html>
-              <head>
-                <!-- ... -->
-              </head>
-              <body>
-                <h1 class="text-center">{title}</h1>
-              </body>
-            </html>
-          
-        
-
-        
-          Check to see if the project files look like the example below.
-        
-
-        
-          
          
-            
          
-              
-                src/index.ts
+            
+          
+
+          
+            This means you can also use your own cache strategy by 
+            listening to the events emitted by the compiler. The
+            following table lists all the events that the compiler
+            emits during the build cycle of a document.
+          
+
+          
+
+          
+          
          
+            4. Add TailwindCSS
+          
          
+
+          
+            Tailwind is an atomic CSS collection of styles that favours 
+            small, single-purpose classes with their selector names based 
+            on its visual function. It works by using a build process to
+            read your source files to generate its styles based only on 
+            what is being used. This makes using Tailwind optimal because
+            it doesn't bloat your CSS with unused styles.
+          
+
+          
+            At the same time, web components with the
+            <style> tag imply using the 
+            component's shadow DOM which will encapsulate the styles within
+            the component and not be affected by global styles. Since 
+            Tailwind in turn implies that you do not need to (necessarily) 
+            define styles, you do not need to use the shadow DOM at all if
+            you are using Tailwind.
+          
+
+          
+            
+            Warning:
+            The caveat for using TailwindCSS, means that web components 
+            using it will not be shippable to other projects that do not
+            use Tailwind. It all comes down to preference in the end.
+          
+
+          
+            Temple has a separate package called
+            @ossph/temple-tailwind
+            to use TailwindCSS with Temple. This is just another wrapper 
+            class that listens to the compiler's build events. You can 
+            install this plugin by running the following command in terminal.
+          
+
+          
+            
+              npm install --save-dev @ossph/temple-tailwind autoprefixer postcss tailwindcss
+            
+          
+
+          
+            Next, in src/index.ts
+            import the tailwind()
+            plugin from the package and use it in the compiler as shown
+            in the example below.
+          
+
+          
+            
+              // ...
+              import { tailwind } from '@ossph/temple-tailwind';
+              // ...create temple compiler...
+              // ...use cache...
+              // 1. Use Tailwind
+              compiler.use(tailwind({
+                darkMode: 'class',
+                theme: { extend: {} },
+                plugins: [],
+                content: []
+              }));
+
+              // ...create dev tools...
+              // ...create http server...
+              // ...listen on port 3000...
+            
+          
+
+          
+            Lastly, in src/page.dtml
+            add the Tailwind directives inside the 
+            <style> tag like the code 
+            below. Also add a tailwind class, (like 
+            <style>) to the 
+            markup to verify that the plugin is working and the styles 
+            are being applied.
+          
+          
+          
+            
+              <style>
+                /* 2. Add tailwind directives */
+                @tailwind base;
+                @tailwind components;
+                @tailwind utilities;
+
+                /* ...Other styles... */
+              </style>
+              <script>
+                //... 
+              </script>
+              <html>
+                <head>
+                  <!-- ... -->
+                </head>
+                <body>
+                  <h1 class="text-center">{title}</h1>
+                </body>
+              </html>
+            
+          
+
+          
+            Check to see if the project files look like the example below.
+          
+
+          
+            
+              
          
+                
+                  src/index.ts
+                
+                
+                  src/page.dtml
+                
+                
+                  package.json
+                
+              
          
+                      
+            
+              
          
+                
+                src
+              
          
+              
+                
+                index.ts
               
-              
-                src/page.dtml
+              
+                
+                page.dtml
               
-              
+              
+                
                 package.json
               
-            
          
-          
          
-          
          
-            
          
-              
-              src
-            
          
-            
-              
-              index.ts
-            
-            
-              
-              page.dtml
-            
-            
-              
-              package.json
-            
-          
          
-          
          
-            
          
-              
+            
+            
+              
                 import path from 'path';
                 import http from 'http';
                 import temple, { cache } from '@ossph/temple/compiler';
@@ -894,7 +956,7 @@ 
          
                 });
                 server.listen(3000);
               
-              
          
-          
          
-                  
-
-        
-          Re-run the following command in terminal to initialize the 
-          tailwind plugin.
-        
-        
-          
-            npx ts-node src/index.ts
+            
+          
+
+          
+            Re-run the following command in terminal to initialize the 
+            tailwind plugin.
+          
+          
+            
+              npx ts-node src/index.ts
+            
+          
+          
+            Load 
+            http://localhost:3000/ 
+            in your browser. After loading you should see files that were 
+            generated in a new build folder found in your project root. 
+            Try to add a Tailwind class to the markup in
+            src/page.dtml and 
+            save. The development server will automatically refresh 
+            the styles and component styles will also be update in 
+            real-time without the page reloading.
+          
+
+          
+          
          
+            5. Add ExpressJS
+          
          
+
+          
+            Temple has a separate package called
+            @ossph/temple-express
+            to use Express with Temple. You can install this plugin by 
+            running the following command in terminal.
+          
+
+          
+            
+              npm install --save @ossph/temple-express express && npm install --save-dev @types/express
+            
+          
+
+          
+            The package 
+            @ossph/temple-express
+            exports two plugins for express.
+            view() is the view 
+            engine for production (live) environments. It can be used with
+            an express app like 
+            app.use(view(compiler)).
+            The other export, dev() 
+            is the same export from the Developer Tools documentation above, 
+            but returns several tools used to integrate with express.
+          
+
+          
+
+          
+            Example logic to use the all the Temple Express tools together
+            with Temple developer tools could look like the following code
+            that cases for 
+            development and 
+            production modes.
+          
+
+          
+            import { view, dev } from '@ossph/temple-express';
+
+            //create temple compiler
+            const compiler = temple({ cwd: __dirname, minify: false });
+            //create express app
+            const app = express();
+            //set the view engine to temple
+            app.set('views', path.join(__dirname, 'pages'));
+            app.set('view engine', 'dtml');
+
+            //if production (live)
+            if (process.env.NODE_ENV === 'production') {
+              //let's use express' template engine feature
+              app.engine('dtml', view(compiler));
+              //...other production settings...
+            //if development mode
+            } else {
+              //get development middleware
+              const { router, view } = dev({ cwd: __dirname });
+              //use development middleware
+              app.use(router);
+              //let's use express' template engine feature
+              app.engine('dtml', view(compiler));
+            }
           
-        
-        
-          Load 
-          http://localhost:3000/ 
-          in your browser. After loading you should see files that were 
-          generated in a new build folder found in your project root. 
-          Try to add a Tailwind class to the markup in
-          src/page.dtml and 
-          save. The development server will automatically refresh 
-          the styles and component styles will also be update in 
-          real-time without the page reloading.
-        
-
-        
-        
          5. Add ExpressJS
          
-
-        
-          Temple has a separate package called
-          @ossph/temple-express
-          to use Express with Temple. You can install this plugin by 
-          running the following command in terminal.
-        
-
-        
-          
-            npm install --save @ossph/temple-express express && npm install --save-dev @types/express
+
+          
+            And you can now case for development mode in 
+            src/page.dtml
+            like in the example below
+          
+
+          
+            <style>
+              /* ... */
+            </style>
+            <script>
+              import { env } from '@ossph/temple';
+              const { NODE_ENV } = env();
+            </script>
+            <html>
+              <head>
+                <!-- ... -->
+                <if true={NODE_ENV !== 'production'}>
+                  <script src="/dev.js"></script>
+                </if>
+              </head>
+              <body>
+                <!-- ... -->
+              </body>
+            </html>
           
-        
-
-        
-          The package 
-          @ossph/temple-express
-          exports two plugins for express.
-          view() is the view 
-          engine for production (live) environments. It can be used with
-          an express app like 
-          app.use(view(compiler)).
-          The other export, dev() 
-          is the same export from the Developer Tools documentation above, 
-          but returns several tools used to integrate with express.
-        
-
-        
-
-        
-          Example logic to use the all the Temple Express tools together
-          with Temple developer tools could look like the following code
-          that cases for 
-          development and 
-          production modes.
-        
-
-        
-          import { view, dev } from '@ossph/temple-express';
-
-          //create temple compiler
-          const compiler = temple({ cwd: __dirname, minify: false });
-          //create express app
-          const app = express();
-          //set the view engine to temple
-          app.set('views', path.join(__dirname, 'pages'));
-          app.set('view engine', 'dtml');
-
-          //if production (live)
-          if (process.env.NODE_ENV === 'production') {
-            //let's use express' template engine feature
-            app.engine('dtml', view(compiler));
-            //...other production settings...
-          //if development mode
-          } else {
-            //get development middleware
-            const { router, view } = dev({ cwd: __dirname });
-            //use development middleware
-            app.use(router);
-            //let's use express' template engine feature
-            app.engine('dtml', view(compiler));
-          }
-        
-
-        
-          And you can now case for development mode in 
-          src/page.dtml
-          like in the example below
-        
-
-        
-          <style>
-            /* ... */
-          </style>
-          <script>
-            import { env } from '@ossph/temple';
-            const { NODE_ENV } = env();
-          </script>
-          <html>
-            <head>
-              <!-- ... -->
-              <if true={NODE_ENV !== 'production'}>
-                <script src="/dev.js"></script>
-              </if>
-            </head>
-            <body>
-              <!-- ... -->
-            </body>
-          </html>
-        
-
-        
-          Check to see if the project files look like the example below.
-        
-
-        
-          
          
-            
          
-              
-                src/index.ts
+
+          
+            Check to see if the project files look like the example below.
+          
+
+          
+            
+              
          
+                
+                  src/index.ts
+                
+                
+                  src/page.dtml
+                
+                
+                  package.json
+                
+              
          
+                      
+            
+              
          
+                
+                src
+              
          
+              
+                
+                index.ts
               
-              
-                src/page.dtml
+              
+                
+                page.dtml
               
-              
+              
+                
                 package.json
               
-            
          
-          
          
-          
          
-            
          
-              
-              src
-            
          
-            
-              
-              index.ts
-            
-            
-              
-              page.dtml
-            
-            
-              
-              package.json
-            
-          
          
-          
          
-            
          
-              
+            
+            
+              
                 import path from 'path';
                 import express from 'express';
                 import temple, { cache } from '@ossph/temple/compiler';
@@ -1161,7 +1223,7 @@ 
          
                   console.log('HTTP server is running on http://localhost:3000');
                 });
               
-              
          
-          
          
-                  
-
-        
-          Re-run the following command in terminal to initialize the 
-          re-run your application using Express.
-        
-        
-          
-            npx ts-node src/index.ts
-          
-        
-        
-          Load 
-          http://localhost:3000/ 
-          in your browser. After loading you should see everything is 
-          exactly as it was, but you now benefit from using ExpressJS.
-        
-
-        
          -- Read On --
          
-
-        
-          To see other getting started examples with various frameworks,
-          you can check out the following project examples in the 
-          official repository.
-        
-         
-        
-          Depending on how you plan to use Temple, you can also look at 
-          the following project setups.
-        
-        
-        
-        
-      
-      
          
-              
+          
+          
          
+        
+      
+    
   
 
\ No newline at end of file
diff --git a/docs/docs/index.html b/docs/docs/index.html
index e3e4f6f..9715517 100644
--- a/docs/docs/index.html
+++ b/docs/docs/index.html
@@ -18,151 +18,208 @@
   
   
   
-  
+  
   
   
   
   
 
-  
-    
          
-  
-  
-    Temple Logo
-  
-  
          Temple
          
-  
+      
+        
+          
          
+            Documentation
+          
          
 
-            
-            
-              import { props } from '@ossph/temple';
-              export default class Hello extends TempleComponent {
-                styles() {
-                  return 'h1 { font-weight: bold; }';
-                }
-                template() {
+          
+            Temple is a template engine with a built-in compiler that 
+            generates HTML markup, web components and support reactivity. 
+          
+          
+            Like React and Svelte, Temple is a modern approach to building
+            front-end code addressing state management and reactivity. 
+            Unlike React and Svelte that focus on keeping the developer 
+            experience mostly on the front-end, Temple focuses on being 
+            a modern templating solution for server side frameworks.
+          
+          
+            Temple can be used as a template engine on the server side, 
+            as a site generator to make static websites and single page 
+            applications, or can be used to publish native HTML5 web 
+            components.
+          
+          
+            Temple sticks closely to the classic web development model of 
+            HTML, CSS, and JS, just adding a few extensions to HTML and 
+            JavaScript. It arguably has fewer concepts and tools to learn 
+            than some of the other framework options.
+          
+          
+            
          
+              
+                <style>
+                  h1 { font-weight: bold; }
+                </style>
+                <script>
+                  const name = 'world';
+                </script>
+                <h1>Hello {name}!</h1>
+              
+              
+                
          
+                  
          Hello world!
          
+                
          
+                        
+            
          
+                    
+          
+            At it's core, a temple file is a special template file that 
+            allows HTML, JavaScript, CSS and importing of components and 
+            templates. All of which are transpiled to TypeScript or 
+            JavaScript source code.
+          
+          
+            
          
+              
+                <style>
+                  h1 { font-weight: bold; }
+                </style>
+                <script>
+                  import { props } from '@ossph/temple';
                   const { name } = props();
-                  return () => [
-                    TempleRegistry.createElement('h1', null, `Hello ${name}`)
-                  ]
+                </script>
+                <h1>Hello {name}!!</h1>
+                
+                
+
+              
+              
+                import { props } from '@ossph/temple';
+                export default class Hello extends TempleComponent {
+                  styles() {
+                    return 'h1 { font-weight: bold; }';
+                  }
+                  template() {
+                    const { name } = props();
+                    return () => [
+                      TempleRegistry.createElement('h1', null, `Hello ${name}`)
+                    ]
+                  }
                 }
-              }
-            
-          
          
-                  
-        
-        
-      
-      
          
-              
+              
+            
+          
+
+          
+          
          
+        
+      
+    
   
 
\ No newline at end of file
diff --git a/docs/docs/markup-syntax.html b/docs/docs/markup-syntax.html
index 7c1be30..d073642 100644
--- a/docs/docs/markup-syntax.html
+++ b/docs/docs/markup-syntax.html
@@ -18,597 +18,692 @@
   
   
   
-  
+  
   
   
   
   
 
-  
-    
          
-  
-  
-    Temple Logo
-  
-  
          Temple
          
-  
+      
+        
+          
          
+            On this page
+          
          
+          
+                  
+                
+      
+        
+          
          
+            Markup Syntax
+          
          
+
+          
+            Components are the building blocks of Temple files. Documents 
+            and page level markup are written in 
+            .dtml files. Components 
+            and templates are written in 
+            .tml files. In both 
+            cases, the code is written in a superset of HTML.
+          
+          
+            The four sections that make up a temple file — imports, 
+            script, styles and markup — are all optional and can be 
+            used in any order.
+          
+          
+            
+              <!-- imports go here -->
+
+              <style>
+                /* styles go here */
+              </style>
+
+              <script>
+                // logic goes here
+              </script>
+              
+              <!-- HTML goes here -->
+            
+          
+
+          
+          
          
+            Imports
+          
          
+
+          
+            Imports are used to include additional components, templates 
+            and stylesheets in the current component. Components can 
+            be imported as a template or 
+            component type.
+          
 
-        
-          
-            <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/prism.min.css" />
-            <link rel="stylesheet" type="text/css" href="/styles/layout.css" />
-            <link rel="import" type="template" href="@/modules/html-head.tml" />
-            <link rel="import" type="component" href="@/modules/i18n/translate.tml" name="i18n-translate" />
-
-            <style>
-              /* styles go here */
-            </style>
-
-            <script>
-              // logic goes here
-            </script>
-            
-            <!-- HTML goes here -->
-          
-        
-        
-        
-          The rel attribute 
-          specifies the relationship between the current document and 
-          the linked resource. 
-          
-          rel="import" denotes
-          that the imported resource is a component or template.
-        
-        
-          The type 
-          attribute specifies the type of the linked resource. 
-          
-          type="component" 
-          imports a web component that can be used as regular markup
-          with attributes and children. 
+          
+            
+              <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/prism.min.css" />
+              <link rel="stylesheet" type="text/css" href="/styles/layout.css" />
+              <link rel="import" type="template" href="@/modules/html-head.tml" />
+              <link rel="import" type="component" href="@/modules/i18n/translate.tml" name="i18n-translate" />
+
+              <style>
+                /* styles go here */
+              </style>
+
+              <script>
+                // logic goes here
+              </script>
+              
+              <!-- HTML goes here -->
+            
+          
           
-          type="template" 
-          imports a template partial that can be included in the current 
-          markup. Template partials do not process attributes or children
-          if given.
-        
-        
-          The 
-          href attribute specifies
-          the URL of the linked resource. The 
-          name
-          attribute specifies the tag name of the imported component or template.
-        
-
-        
-        
          Styles
          
-
-        
-          CSS styles inside a <style> 
-          block enables the native shadow DOM and will be scoped only to that component. 
-          Additionally styles defined outside of the component such as 
-          global styles will not affect the component.
-        
-
-        
-          External stylesheets can be imported using the 
-          <link> tag or using 
-          @import() CSS directive. 
-        
-
-        
-          You can use host selectors to style an element from within 
-          a component. The :host 
-          pseudo-class always applies styles to the root element of the 
-          web component.
-        
-
-        
-          
-            <style>
-              :host {
-                display: block;
-              }
-            </style>
-          
-        
+          
+            The rel attribute 
+            specifies the relationship between the current document and 
+            the linked resource. 
+            
+            rel="import" denotes
+            that the imported resource is a component or template.
+          
+          
+            The type 
+            attribute specifies the type of the linked resource. 
+            
+            type="component" 
+            imports a web component that can be used as regular markup
+            with attributes and children. 
+            
+            type="template" 
+            imports a template partial that can be included in the current 
+            markup. Template partials do not process attributes or children
+            if given.
+          
+          
+            The 
+            href attribute specifies
+            the URL of the linked resource. The 
+            name
+            attribute specifies the tag name of the imported component or template.
+          
 
-        
-          You can also add conditional styles using the 
-          :host selector function. 
-          This can be used to style the host so long as it matches the 
-          given selector. For example, it can be used to select for 
-          hosts that have a given attribute or class.
-        
+          
+          
          
+            Styles
+          
          
 
-        
-          
-            <style>
-              :host([active]) {
-                background-color: #333;
-                color: #FFF;
-              }
-              :host(.active) {
-                background-color: #333;
-                color: #FFF;
-              }
-            </style>
-          
-        
+          
+            CSS styles inside a <style> 
+            block enables the native shadow DOM and will be scoped only to that component. 
+            Additionally styles defined outside of the component such as 
+            global styles will not affect the component.
+          
 
-        
-        
          Scripts
          
+          
+            External stylesheets can be imported using the 
+            <link> tag or using 
+            @import() CSS directive. 
+          
 
-        
-          The <script> block is used 
-          to write TypeScript logic for the component. The script block 
-          can be used to define variables, functions, and event listeners.
-          Variables declared (or imported) at the top level are 
-          'visible' from the component's markup. 
-        
+          
+            You can use host selectors to style an element from within 
+            a component. The :host 
+            pseudo-class always applies styles to the root element of the 
+            web component.
+          
 
-        
-          
-            <script>
-              const title = 'Hello World';
-            </script>
+          
+            
+              <style>
+                :host {
+                  display: block;
+                }
+              </style>
+            
+          
+
+          
+            You can also add conditional styles using the 
+            :host selector function. 
+            This can be used to style the host so long as it matches the 
+            given selector. For example, it can be used to select for 
+            hosts that have a given attribute or class.
+          
 
-            <h1>{title}</h1>
-          
-        
+          
+            
+              <style>
+                :host([active]) {
+                  background-color: #333;
+                  color: #FFF;
+                }
+                :host(.active) {
+                  background-color: #333;
+                  color: #FFF;
+                }
+              </style>
+            
+          
+
+          
+          
          
+            Scripts
+          
          
+
+          
+            The <script> block is used 
+            to write TypeScript logic for the component. The script block 
+            can be used to define variables, functions, and event listeners.
+            Variables declared (or imported) at the top level are 
+            'visible' from the component's markup. 
+          
 
-        
-          The <script> block can also 
-          be used to import variables from other components to be used
-          in the markup.
-        
+          
+            
+              <script>
+                const title = 'Hello World';
+              </script>
 
-        
-          
-            <script>
-              import getTitle from './getTitle';
-              const title = getTitle();
-            </script>
+              <h1>{title}</h1>
+            
+          
 
-            <h1 title={title}>{title}</h1>
-          
-        
+          
+            The <script> block can also 
+            be used to import variables from other components to be used
+            in the markup.
+          
 
-        
-          You can use @/ to prefix the 
-          current working directory. This is useful when importing
-          files completely in a separate directory in your project
-        
+          
+            
+              <script>
+                import getTitle from './getTitle';
+                const title = getTitle();
+              </script>
+
+              <h1 title={title}>{title}</h1>
+            
+          
+
+          
+            You can use @/ to prefix the 
+            current working directory. This is useful when importing
+            files completely in a separate directory in your project
+          
 
-        
-          
-            <script>
-              import getTitle from '@/data/getTitle';
-              const title = getTitle();
-            </script>
+          
+            
+              <script>
+                import getTitle from '@/data/getTitle';
+                const title = getTitle();
+              </script>
+
+              <h1 title={title}>{title}</h1>
+            
+          
+
+          
+          
          
+            Markup
+          
          
+
+          
+            In order to be closer to the native, Temple follows the same 
+            standards and conventions as HTML5 web components. Temple 
+            components are compiled to native web components that possibly 
+            can be used in other projects any modern browser.
+          
+
+          
+          
          
+            Tag Names
+          
          
+
+          
+            For web components it's recommended that tag names must have 
+            at least one dash (-) in them. As such you probably want to 
+            name your element with two distinct words like 
+            i18n-translate. You can 
+            use as many dashes as you want, you're not limited to one. 
+            Some specific rules to follow in order to make a valid tag 
+            name:
+          
+
+          
            
+            
+              It must use all lowercase characters of the alphabet (a-z).
+            
+            
+              It must contain at least one dash (-). Temple will 
+              auto prefix component names based on your configuration.
+            
+            
+              It must not be an already reserved tag name including 
+              annotation-xml,
+              color-profile,
+              font-face,
+              font-face-src,
+              font-face-uri,
+              font-face-format,
+              font-face-name, and 
+              missing-glyph.
+            
+            
+              It must not contain symbols, like =, @, $.
+            
+            
+              It can contain underscores, and numbers.
+            
+            
+              It can contain characters from different alphabets, 
+              such as é, ð, ö, 爱.
+            
+          
          
+
+          
+            Additionally, Temple works best with correct markup. The 
+            following standards should be followed:
+          
+
+          
            
+            
+              Self closing tags like 
+              <img />,
+              <link />,
+              <meta />,
+              <input />
+              must have a slash before the closing.
+            
+            
+              When using tables, rows should be wrapped in a 
+              <tbody> tag and cells
+              should be wrapped in a <tr> 
+              tag. ie. <table><tbody><tr><td>
+            
+            
+              When using lists, items should be wrapped in a 
+              <ul> or 
+              <ol> tags.
+              ie. <ul><li>
+            
+          
          
+
+          
+            
+            Warning: Any markup auto corrected by browser will cause data syncing 
+            issues with Temple.
+          
+
+          
+            Temple components can loosely be self closing
+            <i18n-translate />
+            or expressed as a block
+            <i18n-translate></i18n-translate>.
+          
 
-            <h1 title={title}>{title}</h1>
+          
+          
          
+            Attributes
+          
          
+
+          
+            
+              <a title={title} {href} {...attributes}>
+                {title}
+              </a>
+              <i18n-translate title=title>
+                {detail}
+              </i18n-translate>
+            
+          
+
+          
+            Attributes can be bound to expressions using the 
+            {} syntax. 
+            Expressions can be variables, functions, or any valid 
+            JavaScript expression. By default, attributes work exactly 
+            like their HTML counterparts.
+          
+
+          
          
+            
+              <button type="button" disabled>Submit</button>
+            
+          
          
+          
+            Traditional HTML attributes can be assigned string values or 
+            no value evaluates as true.
+          
+
+          
+            <a title={title}>Click</a>
           
-                  
-
-        
-        
          Markup
          
-
-        
-          In order to be closer to the native, Temple follows the same 
-          standards and conventions as HTML5 web components. Temple 
-          components are compiled to native web components that possibly 
-          can be used in other projects any modern browser.
-        
-
-        
-        
          Tag Names
          
-
-        
-          Tag names must have at least one dash (-) in them. As such 
-          you probably want to name your element with two distinct words 
-          like i18n-translate. You can 
-          use as many dashes as you want, you're not limited to one. 
-          Some specific rules to follow in order to make a valid tag 
-          name:
-        
-
-        
            
-          
-            It must use all lowercase characters of the alphabet (a-z).
-          
-          
-            t must contain at least one dash (-).
-          
-          
-            It must not be an already reserved tag name including 
-            annotation-xml,
-            color-profile,
-            font-face,
-            font-face-src,
-            font-face-uri,
-            font-face-format,
-            font-face-name, and 
-            missing-glyph.
-          
-          
-            It must not contain symbols, like =, @, $.
-          
-          
-            It can contain underscores, and numbers.
-          
-          
-            It can contain characters from different alphabets, 
-            such as é, ð, ö, 爱.
-          
-        
          
-
-        
-          Additionally, Temple works best with correct markup. The 
-          following standards should be followed:
-        
-
-        
            
-          
-            Self closing tags like 
-            <img />,
-            <link />,
-            <meta />,
-            <input />
-            must have a slash before the closing.
-          
-          
-            When using tables, rows should be wrapped in a 
-            <tbody> tag and cells
-            should be wrapped in a <tr> 
-            tag. ie. <table><tbody><tr><td>
-          
-          
-            When using lists, items should be wrapped in a 
-            <ul> or 
-            <ol> tags.
-            ie. <ul><li>
-          
-        
          
-
-        
-          
-          Warning: Any markup auto corrected by browser will cause data syncing 
-          issues with Temple.
-        
-
-        
-          Temple components can loosely be self closing
-          <i18n-translate />
-          or expressed as a block
-          <i18n-translate></i18n-translate>.
-        
-
-        
-        
          Attributes
          
-
-        
-          
-            <a title={title} {href} {...attributes}>
-              {title}
-            </a>
-            <i18n-translate title=title>
-              {detail}
-            </i18n-translate>
+          
+            Attributes can be assigned variable names.
+          
+
+          
+            <a title=title>Click</a>
           
-        
-
-        
-          Attributes can be bound to expressions using the 
-          {} syntax. 
-          Expressions can be variables, functions, or any valid 
-          JavaScript expression. By default, attributes work exactly 
-          like their HTML counterparts.
-        
-
-        
-          <button type="button" disabled>Submit</button>
-        
-        
-          Traditional HTML attributes can be assigned string values or 
-          no value evaluates as true.
-        
-
-        
-          <a title={title}>Click</a>
-        
-        
-          Attributes can be assigned variable names.
-        
-
-        
-          <a title=title>Click</a>
-        
-        
-          Variable names do not need to be wrapped in curly braces
-          {}.
-        
-
-        
-          <a {title}>Click</a>
-        
-        
-          Attributes with the same name as a variable can be assigned
-          by just wrapping curly braces. ie. 
-          {title}.
-        
-
-        
-          <script>
-            const attributes = { target: '_blank' };
-          </script>
-          <a {...attributes}>Click</a>
-        
-        
-          Spread operators can be used to assign multiple attributes.
-        
-
-        
-          <script>
-            let count = 10
-            const metadata = { foo: 'bar', baz: 1, qux: true };
-            const data = () => metadata
-          </script>
-          <a {count} get={data} data-meta={metadata} disable={count < 10}>
-            Click
-          </a>
-        
-        
-          You can assign any valid JavaScript expression to an attribute.
-        
-
-        
-        
          Conditionals
          
-
-        
+          
+            Variable names do not need to be wrapped in curly braces
+            {}.
+          
+
+          
+            <a {title}>Click</a>
+          
+          
+            Attributes with the same name as a variable can be assigned
+            by just wrapping curly braces. ie. 
+            {title}.
+          
+
+          
          
+            
+              <script>
+                const attributes = { target: '_blank' };
+              </script>
+              <a {...attributes}>Click</a>
+            
+          
          
+          
+            Spread operators can be used to assign multiple attributes.
+          
+
+          
          
+            
+              <script>
+                let count = 10
+                const metadata = { foo: 'bar', baz: 1, qux: true };
+                const data = () => metadata
+              </script>
+              <a {count} get={data} data-meta={metadata} disable={count < 10}>
+                Click
+              </a>
+            
+          
          
+          
+            You can assign any valid JavaScript expression to an attribute.
+          
+
+          
+          
          
+            Conditionals
+          
          
+
+          
+            
+              <if true={count > 10}>
+                <p>Count is greater than 10</p>
+              <elif true={count < 5} />
+                <p>Count is less than 5</p>
+              <else />
+                <p>Count is between 5 and 10</p>
+              </if>
+            
+          
+          
+            Conditionals can be used to show or hide elements based on 
+            the value of a variable.
+          
+
+          
          
+            
+              <if true={count > 10}>
+                <p>Count is greater than 10</p>
+              </if>
+            
+          
          
+          
+            The basic syntax for an if statement looks like this and can be 
+            truesy or 
+            falsey.
+          
+
+          
          
+            
+              <if false={count > 10}>
+                <p>Count is not greater than 10</p>
+              </if>
+            
+          
          
+          
+            You can also use the false
+            attribute to negate the condition.
+          
+
+          
          
+            
+              <if true={count > 10}>
+                <p>Count is greater than 10</p>
+              <else />
+                <p>Count is less than or equal to 10</p>
+              </if>
+            
+          
          
+          
+            You can use the else block to 
+            show content when the condition is false.
+          
+
           
             <if true={count > 10}>
               <p>Count is greater than 10</p>
             <elif true={count < 5} />
               <p>Count is less than 5</p>
-            <else />
-              <p>Count is between 5 and 10</p>
             </if>
           
-                  
-        
-          Conditionals can be used to show or hide elements based on 
-          the value of a variable.
-        
-
-        
-          <if true={count > 10}>
-            <p>Count is greater than 10</p>
-          </if>
-        
-        
-          The basic syntax for an if statement looks like this and can be 
-          truesy or 
-          falsey.
-        
-
-        
-          <if false={count > 10}>
-            <p>Count is not greater than 10</p>
-          </if>
-        
-        
-          You can also use the false
-          attribute to negate the condition.
-        
-
-        
-          <if true={count > 10}>
-            <p>Count is greater than 10</p>
-          <else />
-            <p>Count is less than or equal to 10</p>
-          </if>
-        
-        
-          You can use the else block to 
-          show content when the condition is false.
-        
-
-        
-          <if true={count > 10}>
-            <p>Count is greater than 10</p>
-          <elif true={count < 5} />
-            <p>Count is less than 5</p>
-          </if>
-        
-        
-          You can use the elif block to 
-          show content when the previous condition is false.
-        
-
-        
-        
          Iterations
          
-
-        
+          
+            You can use the elif block to 
+            show content when the previous condition is false.
+          
+
+          
+          
          
+            Iterations
+          
          
+
+          
+            
+              <each key=index value=article from=articles>
+                <h1>#{index + 1} {article.title}</h1>
+                <p>{article.body}</p>
+              </each>
+            
+          
+          
+            The <each> block can be used 
+            to iterate over an array of items or objects.
+            The from attribute value is 
+            required and can be an array, object or JavaScript expression 
+            that evaluates to an array or object. Both the 
+            key and 
+            value attributes are optional.
+          
+
+          
          
+            
+              <each value={article} from={articles}>
+                <h1>{article.title}</h1>
+                <p>{article.body}</p>
+              </each>
+            
+          
          
+          
+            The value of value, in this 
+            case article can be used 
+            only with in the block. This can be any valid JavaScript 
+            variable name.
+          
+
           
-            <each key=index value=article from=articles>
-              <h1>#{index + 1} {article.title}</h1>
-              <p>{article.body}</p>
+            <each key={index} from={[1, 2, 3]}>
+              <h1>#{index} ???</h1>
             </each>
           
-                  
-        
-          The <each> block can be used 
-          to iterate over an array of items or objects.
-          The from attribute value is 
-          required and can be an array, object or JavaScript expression 
-          that evaluates to an array or object. Both the 
-          key and 
-          value attributes are optional.
-        
-
-        
-          <each value={article} from={articles}>
-            <h1>{article.title}</h1>
-            <p>{article.body}</p>
-          </each>
-        
-        
-          The value of value, in this 
-          case article can be used 
-          only with in the block. This can be any valid JavaScript 
-          variable name.
-        
-
-        
-          <each key={index} from={[1, 2, 3]}>
-            <h1>#{index} ???</h1>
-          </each>
-        
-        
-          The value of key, in this 
-          case index can be used 
-          only with in the block. This can be any valid JavaScript 
-          variable name.
-        
-
-        
-        
          Try/Catch
          
-
-        
-          
-            <try>
-              <p>{mayCauseError()}</p>
-            <catch error={e} />
-              <p>Error: {e.message}</p>
-            </try>
-          
-        
-
-        
-          The <try><catch> block can 
-          be used to catch errors that occur in the block. The 
-          <catch> block is required and 
-          can be used to handle the error.
-
-          The value of error, in the  
-          <catch> block in this case
-          e is an 
-          Error object
-          that can only be used with in the block. 
-        
-
-        
-      
-      
          
-              
+          
+            The value of key, in this 
+            case index can be used 
+            only with in the block. This can be any valid JavaScript 
+            variable name.
+          
+
+          
+          
          
+            Try/Catch
+          
          
+
+          
+            
+              <try>
+                <p>{mayCauseError()}</p>
+              <catch error={e} />
+                <p>Error: {e.message}</p>
+              </try>
+            
+          
+
+          
+            The <try><catch> block can 
+            be used to catch errors that occur in the block. The 
+            <catch> block is required and 
+            can be used to handle the error.
+
+            The value of error, in the  
+            <catch> block in this case
+            e is an 
+            Error object
+            that can only be used with in the block. 
+          
+
+          
+          
          
+        
+      
+    
   
 
\ No newline at end of file
diff --git a/docs/docs/single-page.html b/docs/docs/single-page.html
index 9b93e6e..416158f 100644
--- a/docs/docs/single-page.html
+++ b/docs/docs/single-page.html
@@ -18,152 +18,207 @@
   
   
   
-  
+  
   
   
   
   
 
-  
-    
          
-  
-  
-    Temple Logo
-  
-  
          Temple
          
-  
+      
+        
+          
          
+            Single Page App
+          
          
 
-        
-          A single page application (SPA) is a website or web 
-          application that dynamically rewrites a current web page with 
-          new data from a web server, instead of the default method of 
-          a web browser loading entire new pages. Temple is capable of 
-          creating reactive SPAs using Webpack and TypeScript.
-        
+          
+            A single page application (SPA) is a website or web 
+            application that dynamically rewrites a current web page with 
+            new data from a web server, instead of the default method of 
+            a web browser loading entire new pages. Temple is capable of 
+            creating reactive SPAs using Webpack and TypeScript.
+          
 
-        
-          First install the following Temple packages.
-        
-        
-          npm install --save-dev @ossph/temple @ossph/temple-loader
-        
+          
+            First install the following Temple packages.
+          
+          
+            npm install --save-dev @ossph/temple @ossph/temple-loader
+          
 
-        
-          Then, install the following TypeScript packages.
-        
-        
-          npm install --save-dev @types/node ts-loader ts-node typescript
-        
+          
+            Then, install the following TypeScript packages.
+          
+          
+            npm install --save-dev @types/node ts-loader ts-node typescript
+          
 
-        
-          Then, install the following Webpack packages.
-        
-        
-          npm install --save-dev html-webpack-plugin webpack-dev-server webpack webpack-cli
-        
+          
+            Then, install the following Webpack packages.
+          
+          
+            npm install --save-dev html-webpack-plugin webpack-dev-server webpack webpack-cli
+          
 
-        
-          Next create the following files and directories.
-        
+          
+            Next create the following files and directories.
+          
 
-        
-          
          
-            
          
-              
-                src/client.ts
+          
+            
+              
          
+                
+                  src/client.ts
+                
+                
+                  src/app.tml
+                
+                
+                  index.html
+                
+                
+                  webpack.config.js
+                
+                
+                  tsconfig.json
+                
+                
+                  package.json
+                
+              
          
+                      
+            
+              
          
+                
+                src
+              
          
+              
+                
+                app.tml
               
-              
-                src/app.tml
+              
+                
+                client.ts
               
-              
+              
+                
                 index.html
               
-              
-                webpack.config.js
+              
+                
+                package.json
               
-              
+              
+                
                 tsconfig.json
               
-              
-                package.json
+              
+                
+                webpack.config.js
               
-            
          
-          
          
-          
          
-            
          
-              
-              src
-            
          
-            
-              
-              app.tml
-            
-            
-              
-              client.ts
-            
-            
-              
-              index.html
-            
-            
-              
-              package.json
-            
-            
-              
-              tsconfig.json
-            
-            
-              
-              webpack.config.js
-            
-          
          
-          
          
-            
          
+            
+            
               
          
-          
          
-                  
-        
-          To test the SPA and see the results, run the following command in terminal.
-        
-        
-          
-            npm run dev
-          
-        
-        
-        
-      
-      
          
-              
+            
+          
+          
+            To test the SPA and see the results, run the following command in terminal.
+          
+          
+            
+              npm run dev
+            
+          
+          
+          
+          
          
+        
+      
+    
   
 
\ No newline at end of file
diff --git a/docs/docs/state-management.html b/docs/docs/state-management.html
index 522f223..4878caa 100644
--- a/docs/docs/state-management.html
+++ b/docs/docs/state-management.html
@@ -18,343 +18,444 @@
   
   
   
-  
+  
   
   
   
   
 
-  
-    
          
-  
-  
-    Temple Logo
-  
-  
          Temple
          
-  
+      
+        
+          
          
+            On this page
+          
          
+          
+                  
+                
+      
+        
+          
          
+            State Management
+          
          
+          
+            Temple provides several ways to manage properties and states 
+            in your components.
+          
 
-        
-        
          Props
          
+          
+          
          
+            Props
+          
          
 
-        
-          import { props } from '@ossph/temple';
-          const { title, description } = props();
-        
+          
+            import { props } from '@ossph/temple';
+            const { title, description } = props();
+          
 
-        
-          The props function can be used to access the 
-          properties of a component.
-        
+          
+            The props function can be used to access the 
+            properties of a component.
+          
 
-        
-        
          Signals
          
+          
+          
          
+            Signals
+          
          
 
-        
          
-          Temple provides a reactive state management system that allows 
-          you to manage states in your components. The system is based 
-          on signals, which are reactive variables that can be used to 
-          store and update data. Signals can be used to store any type 
-          of data, including numbers, strings, objects, arrays, and even 
-          functions.
-        
          
+          
+            Temple provides a reactive state management system that allows 
+            you to manage states in your components. The system is based 
+            on signals, which are reactive variables that can be used to 
+            store and update data. Signals can be used to store any type 
+            of data, including numbers, strings, objects, arrays, and even 
+            functions.
+          
 
-        
-          <script>
-            import { signal } from '@ossph/temple';
-            const count = signal<number>(1);
-          </script>
-          <em class=classlist>Count #{count.value}</em>
-        
+          
          
+            
+              <script>
+                import { signal } from '@ossph/temple';
+                const count = signal<number>(1);
+              </script>
+              <em class=classlist>Count #{count.value}</em>
+            
+          
          
 
-        
-          To create a signal, you can use the 
-          signal() 
-          function, which takes an initial value as an argument. Signals 
-          can be read and updated using the value property. 
-          Setting the value will trigger a re-render of the component.
-        
+          
+            To create a signal, you can use the 
+            signal() 
+            function, which takes an initial value as an argument. Signals 
+            can be read and updated using the value property. 
+            Setting the value will trigger a re-render of the component.
+          
 
-        
-          Signals can be used in your components to manage states and 
-          trigger updates when the state changes. You can use signals to 
-          store data that needs to be shared between components, or to 
-          trigger side effects when the state changes. Signals can also 
-          be used to store data that needs to be persisted across page 
-          reloads, such as form data or user preferences.
-        
+          
+            Signals can be used in your components to manage states and 
+            trigger updates when the state changes. You can use signals to 
+            store data that needs to be shared between components, or to 
+            trigger side effects when the state changes. Signals can also 
+            be used to store data that needs to be persisted across page 
+            reloads, such as form data or user preferences.
+          
 
-        
-        
          Events
          
+          
+          
          
+            Events
+          
          
 
-        
-          <script>
-            import { signal } from '@ossph/temple';
-            const count = signal<number>(1);
-            const add = e => count.value++;
-          </script>
+          
          
+            
+              <script>
+                import { signal } from '@ossph/temple';
+                const count = signal<number>(1);
+                const add = e => count.value++;
+              </script>
 
-          <button click=add>{count.value}</button>
+              <button click=add>{count.value}</button>
 
-          <button dblclick=add>{count.value}</button>
-          <button mousedown=add>{count.value}</button>
-          <button mouseup=add>{count.value}</button>
-          <button mousemove=add>{count.value}</button>
-          <button mouseover=add>{count.value}</button>
-          <button mouseout=add>{count.value}</button>
-          <button wheel=add>{count.value}</button>
-          <button keydown=add>{count.value}</button>
-          <button keypress=add>{count.value}</button>
-          <button keyup=add>{count.value}</button>
-        
+              <button dblclick=add>{count.value}</button>
+              <button mousedown=add>{count.value}</button>
+              <button mouseup=add>{count.value}</button>
+              <button mousemove=add>{count.value}</button>
+              <button mouseover=add>{count.value}</button>
+              <button mouseout=add>{count.value}</button>
+              <button wheel=add>{count.value}</button>
+              <button keydown=add>{count.value}</button>
+              <button keypress=add>{count.value}</button>
+              <button keyup=add>{count.value}</button>
+            
+          
          
 
-        
-          For example, you can use the click 
-          attribute assigned to a function to trigger a function when 
-          the element is clicked. In combination with updating a signal, 
-          can trigger a re-render of the component. The following event 
-          attributes are supported.
-        
+          
+            For example, you can use the click 
+            attribute assigned to a function to trigger a function when 
+            the element is clicked. In combination with updating a signal, 
+            can trigger a re-render of the component. The following event 
+            attributes are supported.
+          
 
-        
          
-          
          
-            
          Mouse Events
          
-            
            
-              
          • click
            • 
-              
          • dblclick
            • 
-              
          • mousedown
            • 
-              
          • mouseup
            • 
-              
          • mousemove
            • 
-              
          • mouseover
            • 
-              
          • mouseout
            • 
-              
          • wheel
            • 
-            
          
-            
          Keyboard Events
          
-            
            
-              
          • keydown
            • 
-              
          • keypress
            • 
-              
          • keyup
            • 
-            
          
-            
          Form Events
          
-            
            
-              
          • blur
            • 
-              
          • change
            • 
-              
          • contextmenu
            • 
-              
          • focus
            • 
-              
          • input
            • 
-              
          • submit
            • 
-              
          • invalid
            • 
-              
          • reset
            • 
-              
          • search
            • 
-              
          • select
            • 
-            
          
-            
          Clipboard Events
          
-            
            
-              
          • copy
            • 
-              
          • cut
            • 
-              
          • paste
            • 
-            
          
-            
          Transition Events
          
-            
            
-              
          • transitionend
            • 
-            
          
-          
          
-          
          
-            
          Drag Events
          
-            
            
-              
          • drag
            • 
-              
          • dragstart
            • 
-              
          • dragend
            • 
-              
          • dragover
            • 
-              
          • dragenter
            • 
-              
          • dragleave
            • 
-              
          • drop
            • 
-              
          • scroll
            • 
-            
          
-            
          Media Events
          
-            
            
-              
          • durationchange
            • 
-              
          • ended
            • 
-              
          • error
            • 
-              
          • loadeddata
            • 
-              
          • loadedmetadata
            • 
-              
          • loadstart
            • 
-              
          • pause
            • 
-              
          • play
            • 
-              
          • playing
            • 
-              
          • progress
            • 
-              
          • ratechange
            • 
-              
          • seeked
            • 
-              
          • seeking
            • 
-              
          • stalled
            • 
-              
          • suspend
            • 
-              
          • timeupdate
            • 
-              
          • volumechange
            • 
-              
          • waiting
            • 
-            
          
-            
          Animation Events
          
-            
            
-              
          • animationstart
            • 
-              
          • animationend
            • 
-              
          • animationiteration
            • 
-            
          
+          
          
+            
          
+              
          Mouse Events
          
+              
            
+                
          • click
            • 
+                
          • dblclick
            • 
+                
          • mousedown
            • 
+                
          • mouseup
            • 
+                
          • mousemove
            • 
+                
          • mouseover
            • 
+                
          • mouseout
            • 
+                
          • wheel
            • 
+              
          
+              
          Keyboard Events
          
+              
            
+                
          • keydown
            • 
+                
          • keypress
            • 
+                
          • keyup
            • 
+              
          
+              
          Form Events
          
+              
            
+                
          • blur
            • 
+                
          • change
            • 
+                
          • contextmenu
            • 
+                
          • focus
            • 
+                
          • input
            • 
+                
          • submit
            • 
+                
          • invalid
            • 
+                
          • reset
            • 
+                
          • search
            • 
+                
          • select
            • 
+              
          
+              
          Clipboard Events
          
+              
            
+                
          • copy
            • 
+                
          • cut
            • 
+                
          • paste
            • 
+              
          
+              
          Transition Events
          
+              
            
+                
          • transitionend
            • 
+              
          
+            
          
+            
          
+              
          Drag Events
          
+              
            
+                
          • drag
            • 
+                
          • dragstart
            • 
+                
          • dragend
            • 
+                
          • dragover
            • 
+                
          • dragenter
            • 
+                
          • dragleave
            • 
+                
          • drop
            • 
+                
          • scroll
            • 
+              
          
+              
          Media Events
          
+              
            
+                
          • durationchange
            • 
+                
          • ended
            • 
+                
          • error
            • 
+                
          • loadeddata
            • 
+                
          • loadedmetadata
            • 
+                
          • loadstart
            • 
+                
          • pause
            • 
+                
          • play
            • 
+                
          • playing
            • 
+                
          • progress
            • 
+                
          • ratechange
            • 
+                
          • seeked
            • 
+                
          • seeking
            • 
+                
          • stalled
            • 
+                
          • suspend
            • 
+                
          • timeupdate
            • 
+                
          • volumechange
            • 
+                
          • waiting
            • 
+              
          
+              
          Animation Events
          
+              
            
+                
          • animationstart
            • 
+                
          • animationend
            • 
+                
          • animationiteration
            • 
+              
          
+            
          
           
          
-        
          
 
-        
-        
          Class Names
          
+          
+          
          
+            Class Names
+          
          
 
-        
-          import { classnames } from '@ossph/temple';
-          const classlist = classnames(); //--> 'class1 class2 class3'
-        
+          
          
+            
+              import { classnames } from '@ossph/temple';
+              const classlist = classnames(); //--> 'class1 class2 class3'
+            
+          
          
 
-        
-          The classnames function can be used to generate 
-          a list of class names based on the properties of an object.
-        
+          
+            The classnames function can be used to generate 
+            a list of class names based on the properties of an object.
+          
 
-        
-        
          Children
          
+          
+          
          
+            Children
+          
          
 
-        
-          import { children } from '@ossph/temple';
-          const childlist = children(); //--> Node[]
-        
-        
-          The children function can be used to render 
-          child components in a parent component.
-        
+          
          
+            
+              import { children } from '@ossph/temple';
+              const childlist = children(); //--> Node[]
+            
+          
          
+          
+            The children function can be used to render 
+            child components in a parent component.
+          
 
-        
-        
          Environment Variables
          
+          
+          
          
+            Component
+          
          
 
-        
-          <script>
-            import { env } from '@ossph/temple';
-            const { BUILD_ID, NODE_ENV } = env();
-          </script>
-          <if true={NODE_ENV === 'development'}>
-            <p>Development mode</p>
-          </if>
-        
-        
-          The env function can be used to access environment 
-          variables in a component.
-        
+          
          
+            
+              import { component } from '@ossph/temple';
+              const button = component(); //--> HTMLElement
+              console.log(button.querySelector('span'));
+            
+          
          
+          
+            For other edge cases, the component function 
+            can be used to get raw access to the component's 
+            functionality.
+          
 
-        
-        
          this
          
+          
+          
          
+            Environment Variables
+          
          
 
-        
-          
+          
             <script>
-              this.props;
-              this.style;
-              this.classList;
-              this.parentNode;
-              this.innerHTML;
-              this.appendChild();
-              this.querySelector('p');
+              import { env } from '@ossph/temple';
+              const { BUILD_ID, NODE_ENV } = env();
             </script>
+            <if true={NODE_ENV === 'development'}>
+              <p>Development mode</p>
+            </if>
           
-        
+          
+            The env function can be used to access environment 
+            variables in a component.
+          
+
+          
+          
          
+            this
+          
          
+
+          
+            
+              <script>
+                this.props;
+                this.style;
+                this.classList;
+                this.parentNode;
+                this.innerHTML;
+                this.appendChild();
+                this.querySelector('p');
+              </script>
+            
+          
+
+          
+            this refers to the 
+            TempleComponent that extends 
+            HTMLElement. This means all
+            components in Temple are in fact are HTML elements and has
+            access to the common functionality like 
+            innerHTML and
+            querySelector() to name a 
+            few. TempleComponent has the
+            additional following properties and methods that you can access
+            using this.
+          
 
-        
-          this refers to the 
-          TempleComponent that extends 
-          HTMLElement. This means all
-          components in Temple are in fact are HTML elements and has
-          access to the common functionality like 
-          innerHTML and
-          querySelector() to name a 
-          few. TempleComponent has the
-          additional following properties and methods that you can access
-          using this.
-        
+          
 
-        
+          
+            
+            Info: You can discover more methods and properties
+            of the HTMLElement class on the
+            
+              MDN Web Docs
+            .
+          
 
-        
-          
-          Info: You can discover more methods and properties
-          of the HTMLElement class on the
-          
-            MDN Web Docs
-          .
-        
-        
-        
-      
          
-      
          
-              
+          
+          
          
+        
+      
+    
   
 
\ No newline at end of file
diff --git a/docs/docs/static-site.html b/docs/docs/static-site.html
index 515350b..4d196f3 100644
--- a/docs/docs/static-site.html
+++ b/docs/docs/static-site.html
@@ -18,116 +18,167 @@
   
   
   
-  
+  
   
   
   
   
 
-  
-    
          
-  
-  
-    Temple Logo
-  
-  
          Temple
          
-  
+      
+        
+          
          
+            Static Site Generator
+          
          
 
-        
-          A static site generator is a tool that generates a full static 
-          HTML website based on raw data and a set of templates. 
-          Essentially, a static site generator automates the task of 
-          coding individual HTML pages and gets those pages ready to 
-          serve to users ahead of time. Because these HTML pages are 
-          pre-built, they can load very quickly in browsers. You can use 
-          Temple, TypeScript and the native Node.js HTTP server to 
-          generate HTML documents in order to be served statically.
-        
+          
+            A static site generator is a tool that generates a full static 
+            HTML website based on raw data and a set of templates. 
+            Essentially, a static site generator automates the task of 
+            coding individual HTML pages and gets those pages ready to 
+            serve to users ahead of time. Because these HTML pages are 
+            pre-built, they can load very quickly in browsers. You can use 
+            Temple, TypeScript and the native Node.js HTTP server to 
+            generate HTML documents in order to be served statically.
+          
 
-        
-          First, create a project with the following structure and files.
-        
-        
-          
          
-            
          
-              
-                src/index.ts
+          
+            First, create a project with the following structure and files.
+          
+          
+            
+              
          
+                
+                  src/index.ts
+                
+                
+                  src/page.dtml
+                
+                
+                  package.json
+                
+              
          
+                      
+            
+              
          
+                
+                src
+              
          
+              
+                
+                index.ts
               
-              
-                src/pages/index.dtml
+              
+                
+                page.dtml
               
-              
+              
+                
                 package.json
               
-            
          
-          
          
-          
          
-            
          
-              
-              src
-            
          
-            
-              
-              index.ts
-            
-            
          
-              
-              pages
-            
          
-            
-              
-              index.dtml
-            
-            
-              
-              package.json
-            
-          
          
-          
          
-            
          
+            
+            
               
                 import http from 'http';
                 import temple, { cache } from '@ossph/temple/compiler';
@@ -210,46 +261,46 @@ 
          
                     "dev": "ts-node ./src/index.ts"
                   },
                   "dependencies": {
-                    "@ossph/temple": "0.1.4"
+                    "@ossph/temple": "0.1.6"
                   },
                   "devDependencies": {
-                    "@ossph/temple-dev": "0.1.4",
+                    "@ossph/temple-dev": "0.1.6",
                     "@types/node": "22.1.0",
                     "ts-node": "10.9.2",
                     "typescript": "5.5.4"
                   }
                 }
               
-            
          
-          
          
-                  
+            
+          
 
-        
-          To test the script and see the results, run the following 
-          command in terminal.
-        
-        
-          npm run dev
-        
-        
-          Load 
-          'http://localhost:3000/' 
-          in your browser. After loading you should see files that were 
-          generated in a new build folder found in your project root. 
-        
-        
-        
-      
-      
          
-              
+          
+            To test the script and see the results, run the following 
+            command in terminal.
+          
+          
+            npm run dev
+          
+          
+            Load 
+            http://localhost:3000/ 
+            in your browser. After loading you should see files that were 
+            generated in a new build folder found in your project root. 
+          
+          
+          
+          
          
+        
+      
+    
   
 
\ No newline at end of file
diff --git a/docs/docs/template-engine.html b/docs/docs/template-engine.html
index 93f6e3e..f4ec282 100644
--- a/docs/docs/template-engine.html
+++ b/docs/docs/template-engine.html
@@ -18,110 +18,165 @@
   
   
   
-  
+  
   
   
   
   
 
-  
-    
          
-  
-  
-    Temple Logo
-  
-  
          Temple
          
-  
+      
+        
+          
          
+            Template Engine
+          
          
 
-        
-          Template engines are used when you want to rapidly build web 
-          applications that are split into different pages. Templates 
-          also enable fast rendering of the server-side data that needs
-          to be passed to the application. You can use Temple, TypeScript 
-          and the native Node.js HTTP server to serve up HTML documents
-          from the server-side.
-        
+          
+            Template engines are used when you want to rapidly build web 
+            applications that are split into different pages. Templates 
+            also enable fast rendering of the server-side data that needs
+            to be passed to the application. You can use Temple, TypeScript 
+            and the native Node.js HTTP server to serve up HTML documents
+            from the server-side.
+          
 
-        
-          First, create a project with the following structure and files.
-        
-        
-          
          
-            
          
-              
-                src/index.ts
+          
+            First, create a project with the following structure and files.
+          
+          
+            
+              
          
+                
+                  src/index.ts
+                
+                
+                  src/page.dtml
+                
+                
+                  package.json
+                
+              
          
+                      
+            
+              
          
+                
+                src
+              
          
+              
+                
+                index.ts
               
-              
-                src/page.dtml
+              
+                
+                page.dtml
               
-              
+              
+                
                 package.json
               
-            
          
-          
          
-          
          
-            
          
-              
-              src
-            
          
-            
-              
-              index.ts
-            
-            
-              
-              page.dtml
-            
-            
-              
-              package.json
-            
-          
          
-          
          
-            
          
+            
+            
               
                 import http from 'http';
                 import temple from '@ossph/temple/compiler';
@@ -179,49 +234,49 @@ 
          
                     "dev": "ts-node ./src/index.ts"
                   },
                   "dependencies": {
-                    "@ossph/temple": "0.1.4"
+                    "@ossph/temple": "0.1.6"
                   },
                   "devDependencies": {
-                    "@ossph/temple-dev": "0.1.4",
+                    "@ossph/temple-dev": "0.1.6",
                     "@types/node": "22.1.0",
                     "ts-node": "10.9.2",
                     "typescript": "5.5.4"
                   }
                 }
               
-            
          
-          
          
-                  
-        
-          The server file 
-          src/index.ts 
-          implements a simple server utilizing the Temple compiler in 
-          its most simplistic form. The document file
-          src/page.dtml 
-          is using the most basic Temple syntax. To test the script and 
-          see the results, run the following command in terminal.
-        
-        
-          npm run dev
-        
-        
-          Load 
-          'http://localhost:3000/' 
-          in your browser to see your application.
-        
-        
-        
-      
-      
          
-              
+            
+          
+          
+            The server file 
+            src/index.ts 
+            implements a simple server utilizing the Temple compiler in 
+            its most simplistic form. The document file
+            src/page.dtml 
+            is using the most basic Temple syntax. To test the script and 
+            see the results, run the following command in terminal.
+          
+          
+            npm run dev
+          
+          
+            Load 
+            http://localhost:3000/ 
+            in your browser to see your application.
+          
+          
+          
+          
          
+        
+      
+    
   
 
\ No newline at end of file
diff --git a/docs/index.html b/docs/index.html
index 006ff10..e7fb3ee 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -18,271 +18,304 @@
   
   
   
-  
+  
   
   
   
   
 
-  
-    
          
-  
-  
-    Temple Logo
-  
-  
          Temple
          
-  
          
-    
-      
          
-        Temple Logo
-        
          Temple
          
-        
-          The reactive web component template engine.
-        
-        
-          Get Started
-        
-        
-          Read the Docs
-        
-      
          
-      
          
-        
-          Temple is a modern HTML markup language and a server first 
-          template engine with a built-in parser/compiler that 
-          generates web components and supports reactivity.
-        
-        
-          
          
-            
-              <style>
-                h1 { font-weight: bold; }
-              </style>
-              <script>
-                const name = 'world';
-              </script>
-              <h1>Hello {name}!</h1>
-            
-            
-              
          
-                
          Hello world!
          
+
+      
+        
          
+          Temple Logo
+          
          Temple
          
+          
+            The reactive web component template engine.
+          
+          
+            Get Started
+          
+          
+            Read the Docs
+          
+        
          
+        
          
+          
+            Temple is a modern HTML markup language and a server first 
+            template engine with a built-in parser/compiler that 
+            generates web components and supports reactivity.
+          
+          
+            
          
+              
+                <style>
+                  h1 { font-weight: bold; }
+                </style>
+                <script>
+                  const name = 'world';
+                </script>
+                <h1>Hello {name}!</h1>
+              
+              
+                
          
+                  
          Hello world!
          
+                
          
+                        
+            
          
+                    
+        
          
+        
          
+          
            
+            
          • 
+              
            
+                
            
+                  Expressive Markup
+                
            
+                
+                  Any data type as attributes. Easily express logic with 
+                  markup directives like if, each, and try catch. 
+                
               
            
-            
-          
          
-        
-      
          
-      
          
-        
            
-          
          • 
-            
            Expressive Markup
            
-            
-              Any data type as attributes. Easily express logic with 
-              markup directives like if, each, and try catch. 
-            
-          
            • 
-          
          • 
-            
            Reactive Signals
            
-            
-              Easily transition from backend logic to reactive states.
-              No Hydration and no memoization needed.
-            
-          
            • 
-          
          • 
-            
            Bare Metal
            
-            
-              Work with the DOM directly. Import any web components 
-              from any source. Works with Lit, HTMX.
-            
-          
            • 
-        
          
-      
          
-      
          
-        
          Server Setup
          
-        
-          Temple can be used with popular server 
-          frameworks in just a few lines of code.
-        
-        
-          
-            import temple from '@ossph/temple/compiler';
-            //make a temple compiler
-            const compiler = temple();
-            //render HTML
-            const results = compiler.render('./page.dtml');
-          
-        
-
-        
          Props
          
-        
-          Import your component props and use immediately
-        
-        
-          
          
-            
-              <style>
-                h1 { font-weight: bold; }
-              </style>
-              <script>
-                import { props } from '@ossph/temple';
-                const { name } = props();
-              </script>
-              <h1>Hello {name}!</h1>
-            
-            
-              
          
-                
          Hello world!
          
+            
          • 
+            
        • 
+              
          
+                
          
+                  Reactive Signals
+                
          
+                
+                  Easily transition from backend logic to reactive states.
+                  No Hydration and no memoization needed.
+                
               
          
-            
-          
-        
-
-        
          Reactive Signals
          
-        
-          Use signals to manage state changes and re-renders.
-        
-        
-          
          
-            
-              <style>
-                h1 { font-weight: bold; }
-              </style>
-              <script>
-                import { signal } from '@ossph/temple';
-                const name = signal('world');
-                name.value += '!';
-              </script>
-              <h1>Hello {name.value}</h1>
-            
-            
-              
          
-                
          Hello world!
          
+            
          • 
+            
        • 
+              
          
+                
          
+                  Bare Metal
+                
          
+                
+                  Work with the DOM directly. Import any web components 
+                  from any source. Works with Lit, HTMX.
+                
               
          
-            
-          
-        
-
-        
          Components and Templates
          
-        
-          Import components and templates for reusability.
-        
-        
-          
          
-            
-              <!-- page.html -->
-              <link rel="import" href="./my-heading.html" />
-              <script>
-                const name = 'world';
-              </script>
-              <my-heading {name}>Hello</my-heading>
-            
-            
-              <!-- my-heading.html -->
-              <script>
-                import { props } from '@ossph/temple';
-                const { name, children } = props();
-              </script>
-              <h1>{children} {name}</h1>
+            
          • 
+          
        
+        
+        
        
+          
        
+            Server Setup
+          
        
+          
+            Temple can be used with popular server 
+            frameworks in just a few lines of code.
+          
+          
+            
+              import temple from '@ossph/temple/compiler';
+              //make a temple compiler
+              const compiler = temple();
+              //render HTML
+              const results = compiler.render('./page.dtml');
             
-          
-        
+          
 
-        
        Conditionals and Iterations
        
-        
-          Case for conditions and iterations in an expressive way.
-        
-        
-          
        
-            
-              <script>
-                const name = 'world';
-                const show = name === "world";
-              </script>
+          
        
+            Props
+          
        
+          
+            Import your component props and use immediately
+          
+          
+            
        
+              
+                <style>
+                  h1 { font-weight: bold; }
+                </style>
+                <script>
+                  import { props } from '@ossph/temple';
+                  const { name } = props();
+                </script>
+                <h1>Hello {name}!</h1>
+              
+              
+                
        
+                  
        Hello world!
        
+                
        
+                      
+            
        
+                  
 
-              <if true=show>
-                <h1>Hello {name}</h1>
-              </if>
-                    
-            
-              <script>
-                const list = [ 'a', 'b', 'c' ];
-              </script>
-              <ul>
-                <each key=i value=item from=list>
-                  <li>{i}: {item}</li>
-                </each>
-              </ul>
-            
+          
        
+            Reactive Signals
+          
        
+          
+            Use signals to manage state changes and re-renders.
+          
+          
+            
        
+              
+                <style>
+                  h1 { font-weight: bold; }
+                </style>
+                <script>
+                  import { signal } from '@ossph/temple';
+                  const name = signal('world');
+                  name.value += '!';
+                </script>
+                <h1>Hello {name.value}</h1>
+              
+              
+                
        
+                  
        Hello world!
        
+                
        
+                      
+            
        
+                  
+
+          
        
+            Components and Templates
+          
        
+          
+            Import components and templates for reusability.
+          
+          
+            
        
+              
+                <!-- page.html -->
+                <link rel="import" href="./my-heading.html" />
+                <script>
+                  const name = 'world';
+                </script>
+                <my-heading {name}>Hello</my-heading>
+              
+              
+                <!-- my-heading.html -->
+                <script>
+                  import { props } from '@ossph/temple';
+                  const { name, children } = props();
+                </script>
+                <h1>{children} {name}</h1>
+              
+            
        
+                  
+
+          
        
+            Conditionals and Iterations
+          
        
+          
+            Case for conditions and iterations in an expressive way.
+          
+          
+            
        
+              
+                <script>
+                  const name = 'world';
+                  const show = name === "world";
+                </script>
+
+                <if true=show>
+                  <h1>Hello {name}</h1>
+                </if>
+              
+              
+                <script>
+                  const list = [ 'a', 'b', 'c' ];
+                </script>
+                <ul>
+                  <each key=i value=item from=list>
+                    <li>{i}: {item}</li>
+                  </each>
+                </ul>
+              
+            
        
+                  
+        
        
+        
        
+          
        
+            Works With Popular Server Frameworks
+          
        
+          
        
+            
+              Express
+            
+            
+              Fastify
+            
+            
+              Hapi
+            
+            
+              Koa
+            
+            
+              NestJS
+            
+            
+              Restify
+            
           
        
-        
-      
        
-      
        
-        
        Works With Popular Server Frameworks
        
-        
-      
        
-      
        
-        
        Temple Loves Developers!
        
-        
        
-          
-            
        Im a vue developer. No need for this. OSSPH does not support this project.
        
-                  
-          
-            
        Temple? Never heard of it...
        "The Name..."
        
-                  
-          
-            
        Temple is good news for Node developers. I'm a rust developer so it don't matter to me.
        
-                  
-          
-            
        Temple copied this section from us. We are the original.
        
-                  
-          
-            
        After creating the Temple project, I am really excited to get back to ReactJS.
        
-                  
-          
-            
        Temple? no thanks. Keep your stack front end. App router for life.
        
-                  
         
        
-      
        
-      
        
-        
        What are you waiting for?
        
-        
-          Get Started
-        
-        
-          Read the Docs
-        
-      
        
-      
        
-    
+        
        
+          
        
+            Temple Loves Developers!
+          
        
+          
        
+            
+              
        Im a vue developer. No need for this. OSSPH does not support this project.
        
+                    
+            
+              
        Temple? Never heard of it...
        "The Name..."
        
+                    
+            
+              
        Temple is good news for Node developers. I'm a rust developer so it don't matter to me.
        
+                    
+            
+              
        Temple copied this section from us. We are the original.
        
+                    
+            
+              
        After creating the Temple project, I am really excited to get back to ReactJS.
        
+                    
+            
+              
        Temple? no thanks. Keep your stack front end. App router for life.
        
+                    
+          
        
+        
        
+        
        
+          
        
+            What are you waiting for?
+          
        
+          
+            Get Started
+          
+          
+            Read the Docs
+          
+        
        
+        
        
+      
+    
   
 
\ No newline at end of file
diff --git a/docs/styles/global.css b/docs/styles/global.css
index beae549..b0e0559 100644
--- a/docs/styles/global.css
+++ b/docs/styles/global.css
@@ -1,7 +1,3 @@
-html, body {
-  font-family: Arial, Helvetica, sans-serif;
-}
-
 /* Default Theme
 ---------------------------------*/
 :root {
@@ -9,119 +5,6 @@ html, body {
   --secondary: #DA532C;
 }
 
-/* Panel
----------------------------------*/
-.panel {
-  background-color: var(--bg-0);
-  color: var(--tx-1);
-  height: 100%;
-  position: relative;
-  width: 100%;
-}
-
-.panel .panel-head {
-  left: 0;
-  height: 60px;
-  overflow: hidden;
-  position: absolute;
-  right: 0;
-  top: 0;
-  transition: 1s;
-}
-
-.with-left .panel-head {
-  left: 226px;
-}
-
-.panel .panel-foot {
-  bottom: 0;
-  left: 0;
-  height: 60px;
-  overflow: hidden;
-  position: absolute;
-  right: 0;
-  transition: 1s;
-}
-
-.panel .panel-left {
-  bottom: 0;
-  left: 0;
-  overflow: hidden;
-  position: absolute;
-  top: 0;
-  transition: 1s;
-  width: 226px;
-}
-
-.panel .panel-right {
-  bottom: 0;
-  overflow: hidden;
-  position: absolute;
-  right: 0;
-  top: 60px;
-  transition: 1s;
-  width: 200px;
-}
-
-.panel .panel-main {
-  bottom: 0;
-  left: 0;
-  overflow: hidden;
-  position: absolute;
-  right: 0;
-  top: 0;
-  transition: 1s;
-}
-
-.panel .panel-main main {
-  height: 100%;
-  overflow: auto;
-  position: relative;
-  width: 100%;
-}
-
-.with-head .panel-main {
-  top: 60px;
-}
-
-.with-foot .panel-main {
-  bottom: 60px;
-}
-
-.with-left .panel-main {
-  left: 226px;
-}
-
-.with-right .panel-main {
-  right: 200px;
-}
-
-@media (max-width: 767px) {
-  .panel .panel-left {
-    left: -226px;
-  }
-  .panel-left-open .panel-left {
-    left: 0;
-  }
-  .with-left .panel-head,
-  .with-left .panel-main {
-    left: 0;
-  }
-  .panel-left-open .panel-head,
-  .panel-left-open .panel-main {
-    left: 226px;
-  }
-}
-
-@media (max-width: 992px) {
-  .panel .panel-right {
-    right: -200px;
-  }
-  .with-right .panel-main {
-    right: 0;
-  }
-}
-
 /* Table
 ---------------------------------*/
 .tbl-container {
@@ -211,400 +94,4 @@ html, body {
   padding-left: 12px;
   padding-right: 12px;
   padding-top: 16px;
-}
-
-/* Head
----------------------------------*/
-.head {
-  align-items: center;
-  background-color: var(--bg-1);
-  display: flex;
-  padding: 0 20px;
-}
-.head .menu {
-  cursor: pointer;
-  display: none;
-  padding: 10px 10px 10px 0;
-}
-.head img {
-  height: 26px;
-  margin-right: 10px;
-}
-.head h3 {
-  flex-grow: 1;
-  text-transform: uppercase;
-}
-.with-left .head img {
-  display: none;
-}
-.with-left .head h3 {
-  opacity: 0;
-}
-.head nav {
-  align-items: center;
-  display: flex;
-}
-.head .github {
-  color: #EFEFEF;
-  font-size: 27px;
-  margin-left: 10px;
-}
-.head .npm {
-  background-color: #CB3837;
-  border-radius: 20px;
-  color: #EFEFEF;
-  font-size: 16px;
-  margin-left: 5px;
-  padding: 5px;
-  text-align: center;
-}
-.head .discord {
-  background-color: #7289DA;
-  border-radius: 20px;
-  color: #EFEFEF;
-  font-size: 16px;
-  margin-left: 5px;
-  padding: 5px;
-  text-align: center;
-}
-
-@media (max-width: 767px) {
-  .with-left .head .menu {
-    display: block;
-  }
-}
-
-/* Left
----------------------------------*/
-.left {
-  display: flex;
-  flex-direction: column;
-}
-.left header {
-  align-items: center;
-  background-color: var(--bg-2);
-  display: flex;
-  padding: 17px 5px 17px 10px;
-}
-.left header img {
-  height: 26px;
-  margin-right: 10px;
-}
-.left header h3 {
-  flex-grow: 1;
-  margin: 0;
-  text-transform: uppercase;
-}
-.left header .toggle {
-  cursor: pointer;
-  display: none;
-}
-
-.left nav {
-  flex-grow: 1;
-  background-color: #151515;
-  overflow: auto;
-  padding-bottom: 100px;
-}
-
-.left nav h6 {
-  border-top: 1px solid #121212;
-  color: #999999;
-  font-size: 14px;
-  margin-bottom: 0;
-  margin-top: 20px;
-  padding: 20px 0 10px 10px;
-  text-transform: uppercase;
-}
-
-.left nav h6:first-child {
-  border-top: none;
-  margin-top: 0;
-}
-
-.left nav a {
-  color: #EFEFEF;
-  display: block;
-  padding: 10px 0 10px 10px;
-}
-
-@media (max-width: 767px) {
-  .left header .toggle {
-    display: block;
-  }
-}
-
-/* Right
----------------------------------*/
-.right {
-  background-color: #151515;
-}
-
-.right h6 {
-  color: #999999;
-  font-size: 14px;
-  margin: 0;
-  padding: 20px 20px 0;
-  text-transform: uppercase;
-}
-
-.right nav {
-  padding: 10px 20px 0;
-}
-
-.right nav nav {
-  font-size: 14px;
-  padding: 0 20px 0 10px;
-}
-
-.right nav a {
-  display: block;
-  padding: 10px 0;
-}
-
-.right nav nav a {
-  color: var(--white);
-}
-
-/* Docs
----------------------------------*/
-.docs {
-  font-family: Arial, Helvetica, sans-serif;
-  height: 100%;
-  overflow: auto;
-}
-.docs.container {
-  height: calc(100% - 20px);
-  padding: 10px 20px;
-}
-.docs h2, 
-.docs h3, 
-.docs h4, 
-.docs h5, 
-.docs h6 {
-  margin: 0;
-  padding: 0;
-}
-.docs p {
-  margin: 0 0 20px;
-  padding: 0;
-}
-.docs h1 {
-  color: var(--primary);
-  margin: 40px 0;
-  text-transform: uppercase; 
-}
-.docs h2 { 
-  border-bottom: 1px solid #333333;
-  color: var(--primary);
-  margin: 40px 0 20px;
-  padding-bottom: 10px;
-  text-transform: uppercase; 
-}
-.docs h3 { 
-  margin: 20px 0;
-}
-.docs a {
-  color: var(--primary);
-}
-.docs p, .docs li {
-  line-height: 36px;
-}
-.docs tui-alert {
-  display: block;
-  margin-bottom: 20px;
-}
-.docs .tbl-container {
-  margin-bottom: 20px;
-}
-.docs .tbl th {
-  padding: 10px;
-  text-align: left;
-  text-transform: uppercase;
-}
-.docs .tbl td {
-  border-color: var(--muted);
-  border-top-style: solid;
-  border-top-width: 1px;
-  padding: 10px;
-}
-.docs .fab, .docs .fas, .docs .fa {
-  line-height: 16px;
-}
-
-.docs > ide-code {
-  margin-bottom: 20px;
-}
-
-.docs .pager {
-  align-items: center;
-  display: flex;
-  padding: 20px 0 40px;
-}
-
-.docs .pager a {
-  display: block;
-  width: 100%;
-}
-
-.docs .pager .next {
-  text-align: right;
-}
-
-/* Tabs
----------------------------------*/
-.tabs {
-  border-bottom: 1px solid #333333;
-  display: flex;
-  overflow-x: auto;
-  padding: 5px 0 0 5px;
-}
-
-.tabs tui-tab {
-  position: relative;
-  top: 1px;
-}
-
-tui-tab a {
-  color: var(--muted) !important;
-  cursor: pointer;
-  display: inline-block;
-}
-
-tui-tab.active a {
-  color: var(--white) !important;
-}
-
-tui-tab.tab a {
-  background-color: #222222;
-  padding: 10px;
-  border: 1px solid #222222;
-  border-bottom: none;
-  border-radius: 5px 5px 0 0;
-  margin-left: 2px;
-}
-tui-tab.tab.active a {
-  background-color: #121212;
-}
-
-tui-tab.block a {
-  font-size: 14px;
-  padding: 5px;
-}
-
-/* Window App
----------------------------------*/
-ide-app {
-  display: block;
-}
-
-ide-app .window {
-  background-color: #212121;
-  border-radius: 5px;
-  box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
-  margin-bottom: 20px;
-  overflow: hidden;
-}
-
-ide-app .window .head {
-  align-items: center;
-  background: #1A1A1A;
-  border-bottom: 1px solid #29252A;
-  color: #999999;
-  gap: 10px;
-  padding: 10px;
-  font-size: 16px;
-  display: flex;
-  position: relative;
-}
-
-ide-app .window .head .dot {
-  background-color: #999999;
-  border-radius: 50%;
-  height: 10px;
-  width: 10px;
-}
-
-ide-app .window .head .title {
-  align-items: center;
-  display: flex;
-  height: 100%;
-  left: 0;
-  justify-content: center;
-  position: absolute;
-  top: 0;
-  width: 100%;
-}
-
-ide-app .window .body {
-  background-color: #000000;
-  color: #ABB2BF;
-  margin: 0;
-  padding: 0;
-  position: relative;
-  overflow: auto;
-}
-
-ide-app .split-view {
-  background-color: #000000;
-  display: flex;
-}
-ide-app .split-view ide-code {
-  flex-basis: 50%;
-  height: 100%;
-}
-ide-app .split-view ide-preview {
-  background-color: #EFEFEF;
-  flex-basis: 50%;
-}
-ide-app .folder {
-  display: block;
-  padding: 5px;
-}
-ide-app .div {
-  border-left: 1px solid #333333;
-  margin-left: 5px;
-  padding-left: 5px;
-}
-
-ide-app .body .panel-left {
-  border-right: 1px solid #333333;
-  width: 150px;
-  z-index: 2;
-}
-
-ide-app .body .panel-left .shift-1 {
-  padding-left: 15px;
-}
-
-ide-app .body .panel-left .shift-2 {
-  padding-left: 30px;
-}
-
-ide-app .body .panel-head {
-  left: 150px;
-  height: 45px;
-  z-index: 1;
-}
-
-ide-app .body .panel-main {
-  background-color: #000000;
-  left: 150px;
-  top: 45px;
-}
-
-@media (max-width: 767px) {
-  ide-app .split-view {
-    display: block;
-  }
-  ide-app .split-view ide-code {
-    padding-bottom: 10px;
-  }
-  ide-app .body .panel-head,
-  ide-app .body .panel-main {
-    left: 0;
-  }
-  ide-app .body .panel-left {
-    left: -150px;
-  }
 }
\ No newline at end of file
diff --git a/docs/template-1.html b/docs/template-1.html
new file mode 100644
index 0000000..dcb276c
--- /dev/null
+++ b/docs/template-1.html
@@ -0,0 +1,376 @@
+
+
+  
+  
+  
+  Temple - The reactive web component template engine.
+  
+  
+  
+  
+  
+  
+  
+  
+  
+  
+  
+  
+  
+  
+  
+  
+  
+  
+  
+
+  
+    
+      
+  
+    
+    
        
+  
+  
+        
+      
        
+  
+    Temple Logo
+  
+  
        
+    Temple
+  
        
+  
+
        
+        
+      
+        
+          
        
+            On this page
+          
        
+          
+                
+              
+      
+        
+          
        
+            Getting Started
+          
        
+
+          
+            In most cases Temple will be used to render a front end from 
+            a server framework. In this example, we will use the native
+            NodeJS HTTP module to create a server that renders a page
+            using Temple. Start by replacing the 
+            src/index.ts
+            file with the following code. 
+            function() {}
+          
+
+          
+            
+              npm init -y && npm install --save @ossph/temple && npm install --save-dev ts-node typescript @types/node
+            
+          
+
+          
        
+            1. Add HTTP
+          
        
+
+          
+            In most cases Temple will be used to render a front end from 
+            a server framework. In this example, we will use the native
+            NodeJS HTTP module to create a server that renders a page
+            using Temple. Start by replacing the 
+            src/index.ts
+            file with the following code. 
+            function() {}
+          
+
+          
+            
+              import temple from '@ossph/temple/compiler';
+              // make a temple compiler
+              const compiler = temple();
+              // render HTML
+              compiler.render('./src/page.dtml').then(console.log);
+              // render CSS
+              compiler.styles('./src/page.dtml').then(console.log);
+              // render JS
+              compiler.client('./src/page.dtml').then(console.log);
+            
+          
+
+          
        
+            1. Add HTTP
+          
        
+
+          
+            In most cases Temple will be used to render a front end from 
+            a server framework. In this example, we will use the native
+            NodeJS HTTP module to create a server that renders a page
+            using Temple. Start by replacing the 
+            src/index.ts
+            file with the following code. 
+            function() {}
+          
+
+          
+            
        
+              
+                <style>
+                  h1 { font-weight: bold; }
+                </style>
+                <script>
+                  const name = 'world';
+                </script>
+                <h1>Hello {name}!</h1>
+              
+              
+                
        Hello world!
        
+                      
+            
        
+                  
+
+          
+            
+            Recommended:
+            Download the Temple editor plugin at the Visual Studio Marketplace.
+          
+
+          
+            
+              
        
+                
+                  src/index.ts
+                
+                
+                  src/page.dtml
+                
+                
+                  package.json
+                
+              
        
+                    
+            
+              
        
+                
+                src
+              
        
+              
+                
+                index.ts
+              
+              
+                
+                page.dtml
+              
+              
+                
+                package.json
+              
+                    
+            
+              
+                import http from 'http';
+                import temple from '@ossph/temple/compiler';
+
+                // create temple compiler
+                const compiler = temple();
+                // create http server
+                const server = http.createServer(async (req, res) => {
+                  // if build asset...
+                  if (req.url?.startsWith('/build/')) {
+                    // get filename ie. abc123.js
+                    const filename = req.url.substring(7);
+                    // get asset
+                    const { type, content } = await compiler.asset(filename);
+                    // send response
+                    res.writeHead(200, { 'Content-Type': type });
+                    return res.end(content);
+                  // if home page
+                  } else if (req.url === '/') {
+                    // render and send response
+                    res.writeHead(200, { 'Content-Type': 'text/html' });
+                    return res.end(await compiler.render('./src/page.dtml', {
+                      title: 'Hello World'
+                    }));
+                  }
+                });
+                // listen on port 3000
+                server.listen(3000);
+              
+              
+              
+            
+                  
+
+          
+
+          
+                
+              
+            
+  
+
\ No newline at end of file
diff --git a/packages/temple-ui-src/scripts/json.ts b/packages/temple-ui-src/scripts/json.ts
deleted file mode 100644
index 3723071..0000000
--- a/packages/temple-ui-src/scripts/json.ts
+++ /dev/null
@@ -1,51 +0,0 @@
-import fs from 'fs';
-import path from 'path';
-
-const input = path.resolve(__dirname, '../src/common/utilities.css');
-const output = path.resolve(__dirname, '../src/data/utilities.json');
-const extractor = /(\.tui\-[^ ]+),{0,1} {0,1}(\.tui\-[^ ]+){0,1} \{([^\}]+)\}/;
-
-async function main() {
-  let media = 'all';
-  const definitions: { 
-    media: string, 
-    selector: string, 
-    style: string 
-  }[] = [];
-  fs.readFileSync(input, 'utf8').split('\n').forEach(line => {
-    //if it's a media line
-    if (line.includes('@media')) {
-      //update media
-      media = line.split(' ')[2].replace(')', '');
-      return;
-    }
-    //get all matches
-    const match = line.trim().match(extractor);
-    //if there is no match
-    if (!match || match.length < 4) {
-      //skip line
-      return;
-    }
-    //extract selector, alias, and style from match
-    const [ _, selector, alias, style ] = match;
-    //add to definitions
-    definitions.push({
-      media,
-      selector: selector.trim().substring(5),
-      style: style.trim()
-    });
-    //if there is an alias
-    if (alias) {
-      //also add to definitions
-      definitions.push({
-        media,
-        selector: alias.trim().substring(5),
-        style: style.trim()
-      });
-    }
-  });
-  //write definitions to global.json
-  fs.writeFileSync(output, JSON.stringify(definitions));
-}
-
-main().then(console.log).catch(console.error);
\ No newline at end of file
diff --git a/packages/temple-ui-src/src/data/components.json b/packages/temple-ui-src/src/assets/components.json
similarity index 92%
rename from packages/temple-ui-src/src/data/components.json
rename to packages/temple-ui-src/src/assets/components.json
index f62b70d..183238a 100644
--- a/packages/temple-ui-src/src/data/components.json
+++ b/packages/temple-ui-src/src/assets/components.json
@@ -1,12 +1,8 @@
 [
-  { "group": "block", "name": "alert", "directive": "alert" },
-  { "group": "block", "name": "badge", "directive": "badge" },
-  { "group": "block", "name": "button", "directive": "button" },
   { "group": "block", "name": "loader", "directive": "loader" },
   { "group": "block", "name": "tab", "directive": "tab" },
   { "group": "table", "name": "grid", "directive": "grid" },
   { "group": "popup", "name": "modal", "directive": "modal" },
-  { "group": "form", "name": "control", "directive": "control" },
   { "group": "field", "name": "autocomplete", "directive": "autocomplete" },
   { "group": "field", "name": "checkbox", "directive": "checkbox" },
   { "group": "field", "name": "color", "directive": "color" },
diff --git a/packages/temple-ui-src/src/common/reset.css b/packages/temple-ui-src/src/assets/reset.css
similarity index 82%
rename from packages/temple-ui-src/src/common/reset.css
rename to packages/temple-ui-src/src/assets/reset.css
index 64ebf4a..4d746e0 100644
--- a/packages/temple-ui-src/src/common/reset.css
+++ b/packages/temple-ui-src/src/assets/reset.css
@@ -12,8 +12,4 @@ h1, h2, h3, h4, h5, h6, p {
 
 a {
   text-decoration: none;
-}
-
-*:not(:defined) {
-  opacity: 0;
 }
\ No newline at end of file
diff --git a/packages/temple-ui-src/src/common/theme.css b/packages/temple-ui-src/src/assets/theme.css
similarity index 66%
rename from packages/temple-ui-src/src/common/theme.css
rename to packages/temple-ui-src/src/assets/theme.css
index fae7b69..8f132d9 100644
--- a/packages/temple-ui-src/src/common/theme.css
+++ b/packages/temple-ui-src/src/assets/theme.css
@@ -1,6 +1,6 @@
 :root {
-  --black: #222222;
-  --white: #FCFCFC;
+  --black: #000000;
+  --white: #FFFFFF;
   --info: #1474FC;
   --error: #DC3545;
   --warning: #FF7B07;
@@ -8,24 +8,34 @@
   --muted: #999999;
 }
 
-.tui-light {
+.light {
   --bg-0: #EFEFEF;
   --bg-1: #CFCFCF;
   --bg-2: #AFAFAF;
   --bg-3: #8F8F8F;
   --bg-4: #6F6F6F;
+  --bd-0: #EFEFEF;
+  --bd-1: #CFCFCF;
+  --bd-2: #AFAFAF;
+  --bd-3: #8F8F8F;
+  --bd-4: #6F6F6F;
   --bg-inverse: #242424;
   --tx-0: #000000;
   --tx-1: #242424;
   --tx-inverse: #CFCFCF;
 }
 
-.tui-dark {
+.dark {
   --bg-0: #121212;
   --bg-1: #222222;
   --bg-2: #323232;
   --bg-3: #424242;
   --bg-4: #525252;
+  --bd-0: #121212;
+  --bd-1: #222222;
+  --bd-2: #323232;
+  --bd-3: #424242;
+  --bd-4: #525252;
   --bg-inverse: #DBDBDB;
   --tx-0: #FFFFFF;
   --tx-1: #CFCFCF;
diff --git a/packages/temple-ui-src/src/block/alert.css b/packages/temple-ui-src/src/block/alert.css
deleted file mode 100644
index d2a9f11..0000000
--- a/packages/temple-ui-src/src/block/alert.css
+++ /dev/null
@@ -1,3 +0,0 @@
-.tui-alert {
-  padding: 16px;
-}
\ No newline at end of file
diff --git a/packages/temple-ui-src/src/block/alert.tml b/packages/temple-ui-src/src/block/alert.tml
index 18a7fdd..de890f3 100644
--- a/packages/temple-ui-src/src/block/alert.tml
+++ b/packages/temple-ui-src/src/block/alert.tml
@@ -1,87 +1,83 @@
 
-
        
-  {children()}
-
        
\ No newline at end of file
+{[ alert ]}
\ No newline at end of file
diff --git a/packages/temple-ui-src/src/block/badge.css b/packages/temple-ui-src/src/block/badge.css
deleted file mode 100644
index fd1d47f..0000000
--- a/packages/temple-ui-src/src/block/badge.css
+++ /dev/null
@@ -1,3 +0,0 @@
-.tui-badge {
-  padding: 2px 8px;
-}
\ No newline at end of file
diff --git a/packages/temple-ui-src/src/block/badge.tml b/packages/temple-ui-src/src/block/badge.tml
index c47d69a..1969f09 100644
--- a/packages/temple-ui-src/src/block/badge.tml
+++ b/packages/temple-ui-src/src/block/badge.tml
@@ -1,170 +1,83 @@
-
 
-
        
-  {children()}
-
        
\ No newline at end of file
+{[ badge ]}
\ No newline at end of file
diff --git a/packages/temple-ui-src/src/block/icon.tml b/packages/temple-ui-src/src/block/icon.tml
new file mode 100644
index 0000000..c510525
--- /dev/null
+++ b/packages/temple-ui-src/src/block/icon.tml
@@ -0,0 +1,10 @@
+
\ No newline at end of file
diff --git a/packages/temple-ui-src/src/block/loader.tml b/packages/temple-ui-src/src/block/loader.tml
new file mode 100644
index 0000000..bfa11a9
--- /dev/null
+++ b/packages/temple-ui-src/src/block/loader.tml
@@ -0,0 +1,6 @@
+
+
+
\ No newline at end of file
diff --git a/packages/temple-ui-src/src/block/tab.tml b/packages/temple-ui-src/src/block/tab.tml
new file mode 100644
index 0000000..db1c721
--- /dev/null
+++ b/packages/temple-ui-src/src/block/tab.tml
@@ -0,0 +1,67 @@
+
+
+  {children()}
+
\ No newline at end of file
diff --git a/packages/temple-ui-src/src/common/utilities.css b/packages/temple-ui-src/src/common/utilities.css
deleted file mode 100644
index a59d285..0000000
--- a/packages/temple-ui-src/src/common/utilities.css
+++ /dev/null
@@ -1,2770 +0,0 @@
-/* Displays
----------------------------------*/
-.tui-none { display: none; }
-.tui-block { display: block; }
-.tui-flex { display: flex; }
-.tui-inline { display: inline; }
-.tui-inline-block { display: inline-block; }
-
-.tui-icy { opacity: 0.85; }
-.tui-glassy { opacity: 0.5; }
-.tui-ghostly { opacity: 0.25; }
-.tui-transparent { opacity: 0; }
-.tui-hidden { visibility: hidden; }
-
-/* Flex
----------------------------------*/
-.tui-flex-row { flex-direction: row; }
-.tui-flex-col { flex-direction: column; }
-.tui-flex-grow { flex-grow: 1; }
-.tui-flex-wrap { flex-wrap: wrap; }
-.tui-flex-center { align-items: center; justify-content: center; }
-.tui-flex-x-center { align-items: center; }
-.tui-flex-y-center { justify-content: center; }
-
-/* Sizes
----------------------------------*/
-.tui-h-10 { height: 10px; }
-.tui-h-12 { height: 12px; }
-.tui-h-15 { height: 15px; }
-.tui-h-16 { height: 16px; }
-.tui-h-20 { height: 20px; }
-.tui-h-24 { height: 24px; }
-.tui-h-25 { height: 25px; }
-.tui-h-30 { height: 30px; }
-.tui-h-32 { height: 32px; }
-.tui-h-35 { height: 35px; }
-.tui-h-36 { height: 36px; }
-.tui-h-40 { height: 40px; }
-.tui-h-45 { height: 45px; }
-.tui-h-48 { height: 48px; }
-.tui-h-50 { height: 50px; }
-.tui-h-55 { height: 55px; }
-.tui-h-60 { height: 60px; }
-.tui-h-64 { height: 64px; }
-.tui-h-65 { height: 65px; }
-.tui-h-70 { height: 70px; }
-.tui-h-75 { height: 75px; }
-.tui-h-80 { height: 80px; }
-.tui-h-85 { height: 85px; }
-.tui-h-90 { height: 90px; }
-.tui-h-95 { height: 95px; }
-.tui-h-96 { height: 96px; }
-.tui-h-100 { height: 100px; }
-.tui-h-110 { height: 110px; }
-.tui-h-120 { height: 120px; }
-.tui-h-130 { height: 130px; }
-.tui-h-140 { height: 140px; }
-.tui-h-150 { height: 150px; }
-.tui-h-160 { height: 160px; }
-.tui-h-170 { height: 170px; }
-.tui-h-180 { height: 180px; }
-.tui-h-190 { height: 190px; }
-.tui-h-200 { height: 200px; }
-.tui-h-220 { height: 220px; }
-.tui-h-240 { height: 240px; }
-.tui-h-260 { height: 260px; }
-.tui-h-280 { height: 280px; }
-.tui-h-300 { height: 300px; }
-.tui-h-320 { height: 320px; }
-.tui-h-340 { height: 340px; }
-.tui-h-360 { height: 360px; }
-.tui-h-full { height: 100%; }
-
-.tui-w-10 { width: 10px; }
-.tui-w-12 { width: 12px; }
-.tui-w-15 { width: 15px; }
-.tui-w-16 { width: 16px; }
-.tui-w-20 { width: 20px; }
-.tui-w-24 { width: 24px; }
-.tui-w-25 { width: 25px; }
-.tui-w-30 { width: 30px; }
-.tui-w-32 { width: 32px; }
-.tui-w-35 { width: 35px; }
-.tui-w-36 { width: 36px; }
-.tui-w-40 { width: 40px; }
-.tui-w-45 { width: 45px; }
-.tui-w-48 { width: 48px; }
-.tui-w-50 { width: 50px; }
-.tui-w-55 { width: 55px; }
-.tui-w-60 { width: 60px; }
-.tui-w-64 { width: 64px; }
-.tui-w-65 { width: 65px; }
-.tui-w-70 { width: 70px; }
-.tui-w-75 { width: 75px; }
-.tui-w-80 { width: 80px; }
-.tui-w-85 { width: 85px; }
-.tui-w-90 { width: 90px; }
-.tui-w-95 { width: 95px; }
-.tui-w-96 { width: 96px; }
-.tui-w-100 { width: 100px; }
-.tui-w-110 { width: 110px; }
-.tui-w-120 { width: 120px; }
-.tui-w-130 { width: 130px; }
-.tui-w-140 { width: 140px; }
-.tui-w-150 { width: 150px; }
-.tui-w-160 { width: 160px; }
-.tui-w-170 { width: 170px; }
-.tui-w-180 { width: 180px; }
-.tui-w-190 { width: 190px; }
-.tui-w-200 { width: 200px; }
-.tui-w-220 { width: 220px; }
-.tui-w-240 { width: 240px; }
-.tui-w-260 { width: 260px; }
-.tui-w-280 { width: 280px; }
-.tui-w-300 { width: 300px; }
-.tui-w-320 { width: 320px; }
-.tui-w-340 { width: 340px; }
-.tui-w-360 { width: 360px; }
-.tui-w-full { width: 100%; }
-
-.tui-mw-xs { max-width: 360px; }
-.tui-mw-xs { max-width: 420px; }
-.tui-mw-md { max-width: 767px; }
-.tui-mw-lg { max-width: 992px; }
-.tui-mw-xl { max-width: 1024px; }
-.tui-mw-full { max-width: 100%; }
-
-/* Background Colors
----------------------------------*/
-.tui-bg-primary { background-color: var(--primary) !important; }
-.tui-bg-secondary { background-color: var(--secondary) !important; }
-.tui-bg-black { background-color: var(--black) !important; }
-.tui-bg-white { background-color: var(--white) !important; }
-.tui-bg-info { background-color: var(--info) !important; }
-.tui-bg-error { background-color: var(--error) !important; }
-.tui-bg-warning { background-color: var(--warning) !important; }
-.tui-bg-success { background-color: var(--success) !important; }
-.tui-bg-muted { background-color: var(--muted) !important; }
-
-/* Text
----------------------------------*/
-.tui-tx-2xs { font-size: 8px; }
-.tui-tx-xs { font-size: 10px; }
-.tui-tx-sm { font-size: 12px; }
-.tui-tx-md { font-size: 14px; }
-.tui-tx-lg { font-size: 16px; }
-.tui-tx-xl { font-size: 18px; }
-.tui-tx-2xl { font-size: 20px; }
-.tui-tx-3xl { font-size: 22px; }
-.tui-tx-4xl { font-size: 24px; }
-.tui-tx-5xl { font-size: 26px; }
-.tui-tx-6xl { font-size: 28px; }
-.tui-tx-7xl { font-size: 30px; }
-
-.tui-tx-center { text-align: center; }
-.tui-tx-left { text-align: left; }
-.tui-tx-right { text-align: right; }
-
-.tui-tx-bold { font-weight: bold; }
-.tui-tx-normal { font-weight: normal; }
-.tui-tx-italic { font-style: italic; }
-.tui-tx-uppercase { text-transform: uppercase; }
-.tui-tx-underline { text-decoration: underline; }
-.tui-tx-nowrap { white-space: nowrap; }
-.tui-tx-nodecor { text-decoration: none; }
-
-.tui-tx-primary { color: var(--primary) !important; }
-.tui-tx-secondary { color: var(--secondary) !important; }
-.tui-tx-black { color: var(--black) !important; }
-.tui-tx-white { color: var(--white) !important; }
-.tui-tx-info { color: var(--info) !important; }
-.tui-tx-error { color: var(--error) !important; }
-.tui-tx-warning { color: var(--warning) !important; }
-.tui-tx-success { color: var(--success) !important; }
-.tui-tx-muted { color: var(--muted) !important; }
-
-/* Borders
----------------------------------*/
-.tui-bd-solid { border-style: solid; }
-.tui-bd-dash { border-style: dashed; }
-.tui-bd-dotted { border-style: dotted; }
-
-.tui-bd { border: 1px solid var(--black); }
-.tui-bdt { border-top: 1px solid var(--black); }
-.tui-bdb { border-bottom: 1px solid var(--black); }
-.tui-bdl { border-left: 1px solid var(--black); }
-.tui-bdr { border-right: 1px solid var(--black); }
-
-.tui-bd-xs { border-width: 1px; }
-.tui-bd-sm { border-width: 2px; }
-.tui-bd-md { border-width: 3px; }
-.tui-bd-lg { border-width: 4px; }
-.tui-bd-xl { border-width: 5px; }
-
-.tui-bdt-xs { border-top-width: 1px; }
-.tui-bdt-sm { border-top-width: 2px; }
-.tui-bdt-md { border-top-width: 3px; }
-.tui-bdt-lg { border-top-width: 4px; }
-.tui-bdt-xl { border-top-width: 5px; }
-
-.tui-bdb-xs { border-bottom-width: 1px; }
-.tui-bdb-sm { border-bottom-width: 2px; }
-.tui-bdb-md { border-bottom-width: 3px; }
-.tui-bdb-lg { border-bottom-width: 4px; }
-.tui-bdb-xl { border-bottom-width: 5px; }
-
-.tui-bdl-xs { border-left-width: 1px; }
-.tui-bdl-sm { border-left-width: 2px; }
-.tui-bdl-md { border-left-width: 3px; }
-.tui-bdl-lg { border-left-width: 4px; }
-.tui-bdl-xl { border-left-width: 5px; }
-
-.tui-bdr-xs { border-right-width: 1px; }
-.tui-bdr-sm { border-right-width: 2px; }
-.tui-bdr-md { border-right-width: 3px; }
-.tui-bdr-lg { border-right-width: 4px; }
-.tui-bdr-xl { border-right-width: 5px; }
-
-.tui-bd-rad-xs { border-radius: 2px; }
-.tui-bd-rad-sm, .tui-bd-curved { border-radius: 4px; }
-.tui-bd-rad-md { border-radius: 6px; }
-.tui-bd-rad-lg { border-radius: 8px; }
-.tui-bd-rad-xl, .tui-bd-rounded { border-radius: 12px; }
-.tui-bd-rad-full, .tui-bd-pill { border-radius: 10000px; }
-
-.tui-bdl-rad-xs { border-radius: 2px 0 0 2px; }
-.tui-bdl-rad-sm, .tui-bdl-curved { border-radius: 4px 0 0 4px; }
-.tui-bdl-rad-md { border-radius: 6px 0 0 6px; }
-.tui-bdl-rad-lg { border-radius: 8px 0 0 8px; }
-.tui-bdl-rad-xl, .tui-bdl-rounded { border-radius: 12px 0 0 12px; }
-.tui-bdl-rad-full, .tui-bdl-pill { border-radius: 10000px 0 0 10000px; }
-
-.tui-bdr-rad-xs { border-radius: 0 2px 2px 0; }
-.tui-bdr-rad-sm, .tui-bdr-curved { border-radius: 0 4px 4px 0; }
-.tui-bdr-rad-md { border-radius: 0 6px 6px 0; }
-.tui-bdr-rad-lg { border-radius: 0 8px 8px 0; }
-.tui-bdr-rad-xl, .tui-bdr-rounded { border-radius: 0 12px 12px 0; }
-.tui-bdr-rad-full, .tui-bdr-pill { border-radius: 0 10000px 10000px 0; }
-
-.tui-bdt-rad-xs { border-radius: 2px 2px 0 0; }
-.tui-bdt-rad-sm, .tui-bdt-curved { border-radius: 4px 4px 0 0; }
-.tui-bdt-rad-md { border-radius: 6px 6px 0 0; }
-.tui-bdt-rad-lg { border-radius: 8px 8px 0 0; }
-.tui-bdt-rad-xl, .tui-bdt-rounded { border-radius: 12px 12px 0 0; }
-.tui-bdt-rad-full, .tui-bdt-pill { border-radius: 10000px 10000px 0 0; }
-
-.tui-bdb-rad-xs { border-radius: 2px 2px 0 0; }
-.tui-bdb-rad-sm, .tui-bdb-curved { border-radius: 0 0 4px 4px; }
-.tui-bdb-rad-md { border-radius: 0 0 6px 6px; }
-.tui-bdb-rad-lg { border-radius: 0 0 8px 8px; }
-.tui-bdb-rad-xl, .tui-bdb-rounded { border-radius: 0 0 12px 12px; }
-.tui-bdb-rad-full, .tui-bdb-pill { border-radius: 0 0 10000px 10000px; }
-
-.tui-bd-primary { border-color: var(--primary) !important; }
-.tui-bd-secondary { border-color: var(--secondary) !important; }
-.tui-bd-black { border-color: var(--black) !important; }
-.tui-bd-white { border-color: var(--white) !important; }
-.tui-bd-info { border-color: var(--info) !important; }
-.tui-bd-error { border-color: var(--error) !important; }
-.tui-bd-warning { border-color: var(--warning) !important; }
-.tui-bd-success { border-color: var(--success) !important; }
-.tui-bd-muted { border-color: var(--muted) !important; }
-
-/* Padding
----------------------------------*/
-.tui-p-0 { padding: 0; }
-.tui-p-2 { padding: 2px; }
-.tui-p-4 { padding: 4px; }
-.tui-p-6 { padding: 6px; }
-.tui-p-8 { padding: 8px; }
-.tui-p-10 { padding: 10px; }
-.tui-p-12 { padding: 12px; }
-.tui-p-14 { padding: 14px; }
-.tui-p-16 { padding: 16px; }
-.tui-p-18 { padding: 18px; }
-.tui-p-20 { padding: 20px; }
-.tui-p-22 { padding: 22px; }
-.tui-p-24 { padding: 24px; }
-.tui-p-26 { padding: 26px; }
-.tui-p-28 { padding: 28px; }
-.tui-p-30 { padding: 30px; }
-.tui-p-32 { padding: 32px; }
-.tui-p-34 { padding: 34px; }
-.tui-p-36 { padding: 36px; }
-.tui-p-38 { padding: 38px; }
-.tui-p-40 { padding: 40px; }
-
-.tui-pl-0 { padding-left: 0; }
-.tui-pl-2 { padding-left: 2px; }
-.tui-pl-4 { padding-left: 4px; }
-.tui-pl-6 { padding-left: 6px; }
-.tui-pl-8 { padding-left: 8px; }
-.tui-pl-10 { padding-left: 10px; }
-.tui-pl-12 { padding-left: 12px; }
-.tui-pl-14 { padding-left: 14px; }
-.tui-pl-16 { padding-left: 16px; }
-.tui-pl-18 { padding-left: 18px; }
-.tui-pl-20 { padding-left: 20px; }
-.tui-pl-22 { padding-left: 22px; }
-.tui-pl-24 { padding-left: 24px; }
-.tui-pl-26 { padding-left: 26px; }
-.tui-pl-28 { padding-left: 28px; }
-.tui-pl-30 { padding-left: 30px; }
-.tui-pl-32 { padding-left: 32px; }
-.tui-pl-34 { padding-left: 34px; }
-.tui-pl-36 { padding-left: 36px; }
-.tui-pl-38 { padding-left: 38px; }
-.tui-pl-40 { padding-left: 40px; }
-
-.tui-pr-0 { padding-right: 0; }
-.tui-pr-2 { padding-right: 2px; }
-.tui-pr-4 { padding-right: 4px; }
-.tui-pr-6 { padding-right: 6px; }
-.tui-pr-8 { padding-right: 8px; }
-.tui-pr-10 { padding-right: 10px; }
-.tui-pr-12 { padding-right: 12px; }
-.tui-pr-14 { padding-right: 14px; }
-.tui-pr-16 { padding-right: 16px; }
-.tui-pr-18 { padding-right: 18px; }
-.tui-pr-20 { padding-right: 20px; }
-.tui-pr-22 { padding-right: 22px; }
-.tui-pr-24 { padding-right: 24px; }
-.tui-pr-26 { padding-right: 26px; }
-.tui-pr-28 { padding-right: 28px; }
-.tui-pr-30 { padding-right: 30px; }
-.tui-pr-32 { padding-right: 32px; }
-.tui-pr-34 { padding-right: 34px; }
-.tui-pr-36 { padding-right: 36px; }
-.tui-pr-38 { padding-right: 38px; }
-.tui-pr-40 { padding-right: 40px; }
-
-.tui-pt-0 { padding-top: 0; }
-.tui-pt-2 { padding-top: 2px; }
-.tui-pt-4 { padding-top: 4px; }
-.tui-pt-6 { padding-top: 6px; }
-.tui-pt-8 { padding-top: 8px; }
-.tui-pt-10 { padding-top: 10px; }
-.tui-pt-12 { padding-top: 12px; }
-.tui-pt-14 { padding-top: 14px; }
-.tui-pt-16 { padding-top: 16px; }
-.tui-pt-18 { padding-top: 18px; }
-.tui-pt-20 { padding-top: 20px; }
-.tui-pt-22 { padding-top: 22px; }
-.tui-pt-24 { padding-top: 24px; }
-.tui-pt-26 { padding-top: 26px; }
-.tui-pt-28 { padding-top: 28px; }
-.tui-pt-30 { padding-top: 30px; }
-.tui-pt-32 { padding-top: 32px; }
-.tui-pt-34 { padding-top: 34px; }
-.tui-pt-36 { padding-top: 36px; }
-.tui-pt-38 { padding-top: 38px; }
-.tui-pt-40 { padding-top: 40px; }
-
-.tui-pb-0 { padding-bottom: 0; }
-.tui-pb-2 { padding-bottom: 2px; }
-.tui-pb-4 { padding-bottom: 4px; }
-.tui-pb-6 { padding-bottom: 6px; }
-.tui-pb-8 { padding-bottom: 8px; }
-.tui-pb-10 { padding-bottom: 10px; }
-.tui-pb-12 { padding-bottom: 12px; }
-.tui-pb-14 { padding-bottom: 14px; }
-.tui-pb-16 { padding-bottom: 16px; }
-.tui-pb-18 { padding-bottom: 18px; }
-.tui-pb-20 { padding-bottom: 20px; }
-.tui-pb-22 { padding-bottom: 22px; }
-.tui-pb-24 { padding-bottom: 24px; }
-.tui-pb-26 { padding-bottom: 26px; }
-.tui-pb-28 { padding-bottom: 28px; }
-.tui-pb-30 { padding-bottom: 30px; }
-.tui-pb-32 { padding-bottom: 32px; }
-.tui-pb-34 { padding-bottom: 34px; }
-.tui-pb-36 { padding-bottom: 36px; }
-.tui-pb-38 { padding-bottom: 38px; }
-.tui-pb-40 { padding-bottom: 40px; }
-
-/* Margin
----------------------------------*/
-.tui-m-0 { margin: 0; }
-.tui-m-2 { margin: 2px; }
-.tui-m-4 { margin: 4px; }
-.tui-m-6 { margin: 6px; }
-.tui-m-8 { margin: 8px; }
-.tui-m-10 { margin: 10px; }
-.tui-m-12 { margin: 12px; }
-.tui-m-14 { margin: 14px; }
-.tui-m-16 { margin: 16px; }
-.tui-m-18 { margin: 18px; }
-.tui-m-20 { margin: 20px; }
-.tui-m-22 { margin: 22px; }
-.tui-m-24 { margin: 24px; }
-.tui-m-26 { margin: 26px; }
-.tui-m-28 { margin: 28px; }
-.tui-m-30 { margin: 30px; }
-.tui-m-32 { margin: 32px; }
-.tui-m-34 { margin: 34px; }
-.tui-m-36 { margin: 36px; }
-.tui-m-38 { margin: 38px; }
-.tui-m-40 { margin: 40px; }
-
-.tui-ml-0 { margin-left: 0; }
-.tui-ml-2 { margin-left: 2px; }
-.tui-ml-4 { margin-left: 4px; }
-.tui-ml-6 { margin-left: 6px; }
-.tui-ml-8 { margin-left: 8px; }
-.tui-ml-10 { margin-left: 10px; }
-.tui-ml-12 { margin-left: 12px; }
-.tui-ml-14 { margin-left: 14px; }
-.tui-ml-16 { margin-left: 16px; }
-.tui-ml-18 { margin-left: 18px; }
-.tui-ml-20 { margin-left: 20px; }
-.tui-ml-22 { margin-left: 22px; }
-.tui-ml-24 { margin-left: 24px; }
-.tui-ml-26 { margin-left: 26px; }
-.tui-ml-28 { margin-left: 28px; }
-.tui-ml-30 { margin-left: 30px; }
-.tui-ml-32 { margin-left: 32px; }
-.tui-ml-34 { margin-left: 34px; }
-.tui-ml-36 { margin-left: 36px; }
-.tui-ml-38 { margin-left: 38px; }
-.tui-ml-40 { margin-left: 40px; }
-
-.tui-mr-0 { margin-right: 0; }
-.tui-mr-2 { margin-right: 2px; }
-.tui-mr-4 { margin-right: 4px; }
-.tui-mr-6 { margin-right: 6px; }
-.tui-mr-8 { margin-right: 8px; }
-.tui-mr-10 { margin-right: 10px; }
-.tui-mr-12 { margin-right: 12px; }
-.tui-mr-14 { margin-right: 14px; }
-.tui-mr-16 { margin-right: 16px; }
-.tui-mr-18 { margin-right: 18px; }
-.tui-mr-20 { margin-right: 20px; }
-.tui-mr-22 { margin-right: 22px; }
-.tui-mr-24 { margin-right: 24px; }
-.tui-mr-26 { margin-right: 26px; }
-.tui-mr-28 { margin-right: 28px; }
-.tui-mr-30 { margin-right: 30px; }
-.tui-mr-32 { margin-right: 32px; }
-.tui-mr-34 { margin-right: 34px; }
-.tui-mr-36 { margin-right: 36px; }
-.tui-mr-38 { margin-right: 38px; }
-.tui-mr-40 { margin-right: 40px; }
-
-.tui-mt-0 { margin-top: 0; }
-.tui-mt-2 { margin-top: 2px; }
-.tui-mt-4 { margin-top: 4px; }
-.tui-mt-6 { margin-top: 6px; }
-.tui-mt-8 { margin-top: 8px; }
-.tui-mt-10 { margin-top: 10px; }
-.tui-mt-12 { margin-top: 12px; }
-.tui-mt-14 { margin-top: 14px; }
-.tui-mt-16 { margin-top: 16px; }
-.tui-mt-18 { margin-top: 18px; }
-.tui-mt-20 { margin-top: 20px; }
-.tui-mt-22 { margin-top: 22px; }
-.tui-mt-24 { margin-top: 24px; }
-.tui-mt-26 { margin-top: 26px; }
-.tui-mt-28 { margin-top: 28px; }
-.tui-mt-30 { margin-top: 30px; }
-.tui-mt-32 { margin-top: 32px; }
-.tui-mt-34 { margin-top: 34px; }
-.tui-mt-36 { margin-top: 36px; }
-.tui-mt-38 { margin-top: 38px; }
-.tui-mt-40 { margin-top: 40px; }
-
-.tui-mb-0 { margin-bottom: 0; }
-.tui-mb-2 { margin-bottom: 2px; }
-.tui-mb-4 { margin-bottom: 4px; }
-.tui-mb-6 { margin-bottom: 6px; }
-.tui-mb-8 { margin-bottom: 8px; }
-.tui-mb-10 { margin-bottom: 10px; }
-.tui-mb-12 { margin-bottom: 12px; }
-.tui-mb-14 { margin-bottom: 14px; }
-.tui-mb-16 { margin-bottom: 16px; }
-.tui-mb-18 { margin-bottom: 18px; }
-.tui-mb-20 { margin-bottom: 20px; }
-.tui-mb-22 { margin-bottom: 22px; }
-.tui-mb-24 { margin-bottom: 24px; }
-.tui-mb-26 { margin-bottom: 26px; }
-.tui-mb-28 { margin-bottom: 28px; }
-.tui-mb-30 { margin-bottom: 30px; }
-.tui-mb-32 { margin-bottom: 32px; }
-.tui-mb-34 { margin-bottom: 34px; }
-.tui-mb-36 { margin-bottom: 36px; }
-.tui-mb-38 { margin-bottom: 38px; }
-.tui-mb-40 { margin-bottom: 40px; }
-
-@media (max-width: 1024px) {
-  /* Displays
-  ---------------------------------*/
-  .tui-xl-none { display: none; }
-  .tui-xl-block { display: block; }
-  .tui-xl-flex { display: flex; }
-  .tui-xl-inline { display: inline; }
-  .tui-xl-inline-block { display: inline-block; }
-
-  .tui-xl-icy { opacity: 0.85; }
-  .tui-xl-glassy { opacity: 0.5; }
-  .tui-xl-ghostly { opacity: 0.25; }
-  .tui-xl-transparent { opacity: 0; }
-  .tui-xl-hidden { visibility: hidden; }
-
-  /* Flex
-  ---------------------------------*/
-  .tui-xl-flex-row { flex-direction: row; }
-  .tui-xl-flex-col { flex-direction: column; }
-  .tui-xl-flex-grow { flex-grow: 1; }
-  .tui-xl-flex-wrap { flex-wrap: wrap; }
-  .tui-xl-flex-center { align-items: center; justify-content: center; }
-  .tui-xl-flex-x-center { align-items: center; }
-  .tui-xl-flex-y-center { justify-content: center; }
-
-  /* Sizes
-  ---------------------------------*/
-  .tui-xl-h-10 { height: 10px; }
-  .tui-xl-h-12 { height: 12px; }
-  .tui-xl-h-15 { height: 15px; }
-  .tui-xl-h-16 { height: 16px; }
-  .tui-xl-h-20 { height: 20px; }
-  .tui-xl-h-24 { height: 24px; }
-  .tui-xl-h-25 { height: 25px; }
-  .tui-xl-h-30 { height: 30px; }
-  .tui-xl-h-32 { height: 32px; }
-  .tui-xl-h-35 { height: 35px; }
-  .tui-xl-h-36 { height: 36px; }
-  .tui-xl-h-40 { height: 40px; }
-  .tui-xl-h-45 { height: 45px; }
-  .tui-xl-h-48 { height: 48px; }
-  .tui-xl-h-50 { height: 50px; }
-  .tui-xl-h-55 { height: 55px; }
-  .tui-xl-h-60 { height: 60px; }
-  .tui-xl-h-64 { height: 64px; }
-  .tui-xl-h-65 { height: 65px; }
-  .tui-xl-h-70 { height: 70px; }
-  .tui-xl-h-75 { height: 75px; }
-  .tui-xl-h-80 { height: 80px; }
-  .tui-xl-h-85 { height: 85px; }
-  .tui-xl-h-90 { height: 90px; }
-  .tui-xl-h-95 { height: 95px; }
-  .tui-xl-h-96 { height: 96px; }
-  .tui-xl-h-100 { height: 100px; }
-  .tui-xl-h-110 { height: 110px; }
-  .tui-xl-h-120 { height: 120px; }
-  .tui-xl-h-130 { height: 130px; }
-  .tui-xl-h-140 { height: 140px; }
-  .tui-xl-h-150 { height: 150px; }
-  .tui-xl-h-160 { height: 160px; }
-  .tui-xl-h-170 { height: 170px; }
-  .tui-xl-h-180 { height: 180px; }
-  .tui-xl-h-190 { height: 190px; }
-  .tui-xl-h-200 { height: 200px; }
-  .tui-xl-h-220 { height: 220px; }
-  .tui-xl-h-240 { height: 240px; }
-  .tui-xl-h-260 { height: 260px; }
-  .tui-xl-h-280 { height: 280px; }
-  .tui-xl-h-300 { height: 300px; }
-  .tui-xl-h-320 { height: 320px; }
-  .tui-xl-h-340 { height: 340px; }
-  .tui-xl-h-360 { height: 360px; }
-  .tui-xl-h-full { height: 100%; }
-
-  .tui-xl-w-10 { width: 10px; }
-  .tui-xl-w-12 { width: 12px; }
-  .tui-xl-w-15 { width: 15px; }
-  .tui-xl-w-16 { width: 16px; }
-  .tui-xl-w-20 { width: 20px; }
-  .tui-xl-w-24 { width: 24px; }
-  .tui-xl-w-25 { width: 25px; }
-  .tui-xl-w-30 { width: 30px; }
-  .tui-xl-w-32 { width: 32px; }
-  .tui-xl-w-35 { width: 35px; }
-  .tui-xl-w-36 { width: 36px; }
-  .tui-xl-w-40 { width: 40px; }
-  .tui-xl-w-45 { width: 45px; }
-  .tui-xl-w-48 { width: 48px; }
-  .tui-xl-w-50 { width: 50px; }
-  .tui-xl-w-55 { width: 55px; }
-  .tui-xl-w-60 { width: 60px; }
-  .tui-xl-w-64 { width: 64px; }
-  .tui-xl-w-65 { width: 65px; }
-  .tui-xl-w-70 { width: 70px; }
-  .tui-xl-w-75 { width: 75px; }
-  .tui-xl-w-80 { width: 80px; }
-  .tui-xl-w-85 { width: 85px; }
-  .tui-xl-w-90 { width: 90px; }
-  .tui-xl-w-95 { width: 95px; }
-  .tui-xl-w-96 { width: 96px; }
-  .tui-xl-w-100 { width: 100px; }
-  .tui-xl-w-110 { width: 110px; }
-  .tui-xl-w-120 { width: 120px; }
-  .tui-xl-w-130 { width: 130px; }
-  .tui-xl-w-140 { width: 140px; }
-  .tui-xl-w-150 { width: 150px; }
-  .tui-xl-w-160 { width: 160px; }
-  .tui-xl-w-170 { width: 170px; }
-  .tui-xl-w-180 { width: 180px; }
-  .tui-xl-w-190 { width: 190px; }
-  .tui-xl-w-200 { width: 200px; }
-  .tui-xl-w-220 { width: 220px; }
-  .tui-xl-w-240 { width: 240px; }
-  .tui-xl-w-260 { width: 260px; }
-  .tui-xl-w-280 { width: 280px; }
-  .tui-xl-w-300 { width: 300px; }
-  .tui-xl-w-320 { width: 320px; }
-  .tui-xl-w-340 { width: 340px; }
-  .tui-xl-w-360 { width: 360px; }
-  .tui-xl-w-full { width: 100%; }
-
-  .tui-xl-mw-xs { max-width: 360px; }
-  .tui-xl-mw-xs { max-width: 420px; }
-  .tui-xl-mw-md { max-width: 767px; }
-  .tui-xl-mw-lg { max-width: 992px; }
-  .tui-xl-mw-xl { max-width: 1024px; }
-  .tui-xl-mw-full { max-width: 100%; }
-
-  /* Text
-  ---------------------------------*/
-  .tui-xl-tx-2xs { font-size: 8px; }
-  .tui-xl-tx-xs { font-size: 10px; }
-  .tui-xl-tx-sm { font-size: 12px; }
-  .tui-xl-tx-md { font-size: 14px; }
-  .tui-xl-tx-lg { font-size: 16px; }
-  .tui-xl-tx-xl { font-size: 18px; }
-  .tui-xl-tx-2xl { font-size: 20px; }
-  .tui-xl-tx-3xl { font-size: 22px; }
-  .tui-xl-tx-4xl { font-size: 24px; }
-  .tui-xl-tx-5xl { font-size: 26px; }
-  .tui-xl-tx-6xl { font-size: 28px; }
-  .tui-xl-tx-7xl { font-size: 30px; }
-
-  .tui-xl-tx-center { text-align: center; }
-  .tui-xl-tx-left { text-align: left; }
-  .tui-xl-tx-right { text-align: right; }
-
-  .tui-xl-tx-bold { font-weight: bold; }
-  .tui-xl-tx-normal { font-weight: normal; }
-  .tui-xl-tx-italic { font-style: italic; }
-  .tui-xl-tx-uppercase { text-transform: uppercase; }
-  .tui-xl-tx-underline { text-decoration: underline; }
-  .tui-xl-tx-nowrap { white-space: nowrap; }
-
-  .tui-xl-tx-primary { color: var(--primary) !important; }
-  .tui-xl-tx-secondary { color: var(--secondary) !important; }
-  .tui-xl-tx-black { color: var(--black) !important; }
-  .tui-xl-tx-white { color: var(--white) !important; }
-  .tui-xl-tx-info { color: var(--info) !important; }
-  .tui-xl-tx-error { color: var(--error) !important; }
-  .tui-xl-tx-warning { color: var(--warning) !important; }
-  .tui-xl-tx-success { color: var(--success) !important; }
-  .tui-xl-tx-muted { color: var(--muted) !important; }
-
-  /* Borders
-  ---------------------------------*/
-  .tui-xl-bd-solid { border-style: solid; }
-  .tui-xl-bd-dash { border-style: dashed; }
-  .tui-xl-bd-dotted { border-style: dotted; }
-
-  .tui-xl-bd-xs { border-width: 1px; }
-  .tui-xl-bd-sm { border-width: 2px; }
-  .tui-xl-bd-md { border-width: 3px; }
-  .tui-xl-bd-lg { border-width: 4px; }
-  .tui-xl-bd-xl { border-width: 5px; }
-
-  .tui-xl-bdt-xs { border-top-width: 1px; }
-  .tui-xl-bdt-sm { border-top-width: 2px; }
-  .tui-xl-bdt-md { border-top-width: 3px; }
-  .tui-xl-bdt-lg { border-top-width: 4px; }
-  .tui-xl-bdt-xl { border-top-width: 5px; }
-
-  .tui-xl-bdb-xs { border-bottom-width: 1px; }
-  .tui-xl-bdb-sm { border-bottom-width: 2px; }
-  .tui-xl-bdb-md { border-bottom-width: 3px; }
-  .tui-xl-bdb-lg { border-bottom-width: 4px; }
-  .tui-xl-bdb-xl { border-bottom-width: 5px; }
-
-  .tui-xl-bdl-xs { border-left-width: 1px; }
-  .tui-xl-bdl-sm { border-left-width: 2px; }
-  .tui-xl-bdl-md { border-left-width: 3px; }
-  .tui-xl-bdl-lg { border-left-width: 4px; }
-  .tui-xl-bdl-xl { border-left-width: 5px; }
-
-  .tui-xl-bdr-xs { border-right-width: 1px; }
-  .tui-xl-bdr-sm { border-right-width: 2px; }
-  .tui-xl-bdr-md { border-right-width: 3px; }
-  .tui-xl-bdr-lg { border-right-width: 4px; }
-  .tui-xl-bdr-xl { border-right-width: 5px; }
-
-  .tui-xl-bd-rad-xs { border-radius: 2px; }
-  .tui-xl-bd-rad-sm, .tui-bd-curved { border-radius: 4px; }
-  .tui-xl-bd-rad-md { border-radius: 6px; }
-  .tui-xl-bd-rad-lg { border-radius: 8px; }
-  .tui-xl-bd-rad-xl, .tui-bd-rounded { border-radius: 12px; }
-  .tui-xl-bd-rad-full, .tui-bd-pill { border-radius: 10000px; }
-
-  .tui-xl-bdl-rad-xs { border-radius: 2px 0 0 2px; }
-  .tui-xl-bdl-rad-sm, .tui-bdl-curved { border-radius: 4px 0 0 4px; }
-  .tui-xl-bdl-rad-md { border-radius: 6px 0 0 6px; }
-  .tui-xl-bdl-rad-lg { border-radius: 8px 0 0 8px; }
-  .tui-xl-bdl-rad-xl, .tui-bdl-rounded { border-radius: 12px 0 0 12px; }
-  .tui-xl-bdl-rad-full, .tui-bdl-pill { border-radius: 10000px 0 0 10000px; }
-
-  .tui-xl-bdr-rad-xs { border-radius: 0 2px 2px 0; }
-  .tui-xl-bdr-rad-sm, .tui-bdr-curved { border-radius: 0 4px 4px 0; }
-  .tui-xl-bdr-rad-md { border-radius: 0 6px 6px 0; }
-  .tui-xl-bdr-rad-lg { border-radius: 0 8px 8px 0; }
-  .tui-xl-bdr-rad-xl, .tui-bdr-rounded { border-radius: 0 12px 12px 0; }
-  .tui-xl-bdr-rad-full, .tui-bdr-pill { border-radius: 0 10000px 10000px 0; }
-
-  .tui-xl-bdt-rad-xs { border-radius: 2px 2px 0 0; }
-  .tui-xl-bdt-rad-sm, .tui-bdt-curved { border-radius: 4px 4px 0 0; }
-  .tui-xl-bdt-rad-md { border-radius: 6px 6px 0 0; }
-  .tui-xl-bdt-rad-lg { border-radius: 8px 8px 0 0; }
-  .tui-xl-bdt-rad-xl, .tui-bdt-rounded { border-radius: 12px 12px 0 0; }
-  .tui-xl-bdt-rad-full, .tui-bdt-pill { border-radius: 10000px 10000px 0 0; }
-
-  .tui-xl-bdb-rad-xs { border-radius: 2px 2px 0 0; }
-  .tui-xl-bdb-rad-sm, .tui-bdb-curved { border-radius: 0 0 4px 4px; }
-  .tui-xl-bdb-rad-md { border-radius: 0 0 6px 6px; }
-  .tui-xl-bdb-rad-lg { border-radius: 0 0 8px 8px; }
-  .tui-xl-bdb-rad-xl, .tui-bdb-rounded { border-radius: 0 0 12px 12px; }
-  .tui-xl-bdb-rad-full, .tui-bdb-pill { border-radius: 0 0 10000px 10000px; }
-
-  /* Padding
-  ---------------------------------*/
-  .tui-xl-p-0 { padding: 0; }
-  .tui-xl-p-2 { padding: 2px; }
-  .tui-xl-p-4 { padding: 4px; }
-  .tui-xl-p-6 { padding: 6px; }
-  .tui-xl-p-8 { padding: 8px; }
-  .tui-xl-p-10 { padding: 10px; }
-  .tui-xl-p-12 { padding: 12px; }
-  .tui-xl-p-14 { padding: 14px; }
-  .tui-xl-p-16 { padding: 16px; }
-  .tui-xl-p-18 { padding: 18px; }
-  .tui-xl-p-20 { padding: 20px; }
-  .tui-xl-p-22 { padding: 22px; }
-  .tui-xl-p-24 { padding: 24px; }
-  .tui-xl-p-26 { padding: 26px; }
-  .tui-xl-p-28 { padding: 28px; }
-  .tui-xl-p-30 { padding: 30px; }
-  .tui-xl-p-32 { padding: 32px; }
-  .tui-xl-p-34 { padding: 34px; }
-  .tui-xl-p-36 { padding: 36px; }
-  .tui-xl-p-38 { padding: 38px; }
-  .tui-xl-p-40 { padding: 40px; }
-
-  .tui-xl-pl-0 { padding-left: 0; }
-  .tui-xl-pl-2 { padding-left: 2px; }
-  .tui-xl-pl-4 { padding-left: 4px; }
-  .tui-xl-pl-6 { padding-left: 6px; }
-  .tui-xl-pl-8 { padding-left: 8px; }
-  .tui-xl-pl-10 { padding-left: 10px; }
-  .tui-xl-pl-12 { padding-left: 12px; }
-  .tui-xl-pl-14 { padding-left: 14px; }
-  .tui-xl-pl-16 { padding-left: 16px; }
-  .tui-xl-pl-18 { padding-left: 18px; }
-  .tui-xl-pl-20 { padding-left: 20px; }
-  .tui-xl-pl-22 { padding-left: 22px; }
-  .tui-xl-pl-24 { padding-left: 24px; }
-  .tui-xl-pl-26 { padding-left: 26px; }
-  .tui-xl-pl-28 { padding-left: 28px; }
-  .tui-xl-pl-30 { padding-left: 30px; }
-  .tui-xl-pl-32 { padding-left: 32px; }
-  .tui-xl-pl-34 { padding-left: 34px; }
-  .tui-xl-pl-36 { padding-left: 36px; }
-  .tui-xl-pl-38 { padding-left: 38px; }
-  .tui-xl-pl-40 { padding-left: 40px; }
-
-  .tui-xl-pr-0 { padding-right: 0; }
-  .tui-xl-pr-2 { padding-right: 2px; }
-  .tui-xl-pr-4 { padding-right: 4px; }
-  .tui-xl-pr-6 { padding-right: 6px; }
-  .tui-xl-pr-8 { padding-right: 8px; }
-  .tui-xl-pr-10 { padding-right: 10px; }
-  .tui-xl-pr-12 { padding-right: 12px; }
-  .tui-xl-pr-14 { padding-right: 14px; }
-  .tui-xl-pr-16 { padding-right: 16px; }
-  .tui-xl-pr-18 { padding-right: 18px; }
-  .tui-xl-pr-20 { padding-right: 20px; }
-  .tui-xl-pr-22 { padding-right: 22px; }
-  .tui-xl-pr-24 { padding-right: 24px; }
-  .tui-xl-pr-26 { padding-right: 26px; }
-  .tui-xl-pr-28 { padding-right: 28px; }
-  .tui-xl-pr-30 { padding-right: 30px; }
-  .tui-xl-pr-32 { padding-right: 32px; }
-  .tui-xl-pr-34 { padding-right: 34px; }
-  .tui-xl-pr-36 { padding-right: 36px; }
-  .tui-xl-pr-38 { padding-right: 38px; }
-  .tui-xl-pr-40 { padding-right: 40px; }
-
-  .tui-xl-pt-0 { padding-top: 0; }
-  .tui-xl-pt-2 { padding-top: 2px; }
-  .tui-xl-pt-4 { padding-top: 4px; }
-  .tui-xl-pt-6 { padding-top: 6px; }
-  .tui-xl-pt-8 { padding-top: 8px; }
-  .tui-xl-pt-10 { padding-top: 10px; }
-  .tui-xl-pt-12 { padding-top: 12px; }
-  .tui-xl-pt-14 { padding-top: 14px; }
-  .tui-xl-pt-16 { padding-top: 16px; }
-  .tui-xl-pt-18 { padding-top: 18px; }
-  .tui-xl-pt-20 { padding-top: 20px; }
-  .tui-xl-pt-22 { padding-top: 22px; }
-  .tui-xl-pt-24 { padding-top: 24px; }
-  .tui-xl-pt-26 { padding-top: 26px; }
-  .tui-xl-pt-28 { padding-top: 28px; }
-  .tui-xl-pt-30 { padding-top: 30px; }
-  .tui-xl-pt-32 { padding-top: 32px; }
-  .tui-xl-pt-34 { padding-top: 34px; }
-  .tui-xl-pt-36 { padding-top: 36px; }
-  .tui-xl-pt-38 { padding-top: 38px; }
-  .tui-xl-pt-40 { padding-top: 40px; }
-
-  .tui-xl-pb-0 { padding-bottom: 0; }
-  .tui-xl-pb-2 { padding-bottom: 2px; }
-  .tui-xl-pb-4 { padding-bottom: 4px; }
-  .tui-xl-pb-6 { padding-bottom: 6px; }
-  .tui-xl-pb-8 { padding-bottom: 8px; }
-  .tui-xl-pb-10 { padding-bottom: 10px; }
-  .tui-xl-pb-12 { padding-bottom: 12px; }
-  .tui-xl-pb-14 { padding-bottom: 14px; }
-  .tui-xl-pb-16 { padding-bottom: 16px; }
-  .tui-xl-pb-18 { padding-bottom: 18px; }
-  .tui-xl-pb-20 { padding-bottom: 20px; }
-  .tui-xl-pb-22 { padding-bottom: 22px; }
-  .tui-xl-pb-24 { padding-bottom: 24px; }
-  .tui-xl-pb-26 { padding-bottom: 26px; }
-  .tui-xl-pb-28 { padding-bottom: 28px; }
-  .tui-xl-pb-30 { padding-bottom: 30px; }
-  .tui-xl-pb-32 { padding-bottom: 32px; }
-  .tui-xl-pb-34 { padding-bottom: 34px; }
-  .tui-xl-pb-36 { padding-bottom: 36px; }
-  .tui-xl-pb-38 { padding-bottom: 38px; }
-  .tui-xl-pb-40 { padding-bottom: 40px; }
-
-  /* Margin
-  ---------------------------------*/
-  .tui-xl-m-0 { margin: 0; }
-  .tui-xl-m-2 { margin: 2px; }
-  .tui-xl-m-4 { margin: 4px; }
-  .tui-xl-m-6 { margin: 6px; }
-  .tui-xl-m-8 { margin: 8px; }
-  .tui-xl-m-10 { margin: 10px; }
-  .tui-xl-m-12 { margin: 12px; }
-  .tui-xl-m-14 { margin: 14px; }
-  .tui-xl-m-16 { margin: 16px; }
-  .tui-xl-m-18 { margin: 18px; }
-  .tui-xl-m-20 { margin: 20px; }
-  .tui-xl-m-22 { margin: 22px; }
-  .tui-xl-m-24 { margin: 24px; }
-  .tui-xl-m-26 { margin: 26px; }
-  .tui-xl-m-28 { margin: 28px; }
-  .tui-xl-m-30 { margin: 30px; }
-  .tui-xl-m-32 { margin: 32px; }
-  .tui-xl-m-34 { margin: 34px; }
-  .tui-xl-m-36 { margin: 36px; }
-  .tui-xl-m-38 { margin: 38px; }
-  .tui-xl-m-40 { margin: 40px; }
-
-  .tui-xl-ml-0 { margin-left: 0; }
-  .tui-xl-ml-2 { margin-left: 2px; }
-  .tui-xl-ml-4 { margin-left: 4px; }
-  .tui-xl-ml-6 { margin-left: 6px; }
-  .tui-xl-ml-8 { margin-left: 8px; }
-  .tui-xl-ml-10 { margin-left: 10px; }
-  .tui-xl-ml-12 { margin-left: 12px; }
-  .tui-xl-ml-14 { margin-left: 14px; }
-  .tui-xl-ml-16 { margin-left: 16px; }
-  .tui-xl-ml-18 { margin-left: 18px; }
-  .tui-xl-ml-20 { margin-left: 20px; }
-  .tui-xl-ml-22 { margin-left: 22px; }
-  .tui-xl-ml-24 { margin-left: 24px; }
-  .tui-xl-ml-26 { margin-left: 26px; }
-  .tui-xl-ml-28 { margin-left: 28px; }
-  .tui-xl-ml-30 { margin-left: 30px; }
-  .tui-xl-ml-32 { margin-left: 32px; }
-  .tui-xl-ml-34 { margin-left: 34px; }
-  .tui-xl-ml-36 { margin-left: 36px; }
-  .tui-xl-ml-38 { margin-left: 38px; }
-  .tui-xl-ml-40 { margin-left: 40px; }
-
-  .tui-xl-mr-0 { margin-right: 0; }
-  .tui-xl-mr-2 { margin-right: 2px; }
-  .tui-xl-mr-4 { margin-right: 4px; }
-  .tui-xl-mr-6 { margin-right: 6px; }
-  .tui-xl-mr-8 { margin-right: 8px; }
-  .tui-xl-mr-10 { margin-right: 10px; }
-  .tui-xl-mr-12 { margin-right: 12px; }
-  .tui-xl-mr-14 { margin-right: 14px; }
-  .tui-xl-mr-16 { margin-right: 16px; }
-  .tui-xl-mr-18 { margin-right: 18px; }
-  .tui-xl-mr-20 { margin-right: 20px; }
-  .tui-xl-mr-22 { margin-right: 22px; }
-  .tui-xl-mr-24 { margin-right: 24px; }
-  .tui-xl-mr-26 { margin-right: 26px; }
-  .tui-xl-mr-28 { margin-right: 28px; }
-  .tui-xl-mr-30 { margin-right: 30px; }
-  .tui-xl-mr-32 { margin-right: 32px; }
-  .tui-xl-mr-34 { margin-right: 34px; }
-  .tui-xl-mr-36 { margin-right: 36px; }
-  .tui-xl-mr-38 { margin-right: 38px; }
-  .tui-xl-mr-40 { margin-right: 40px; }
-
-  .tui-xl-mt-0 { margin-top: 0; }
-  .tui-xl-mt-2 { margin-top: 2px; }
-  .tui-xl-mt-4 { margin-top: 4px; }
-  .tui-xl-mt-6 { margin-top: 6px; }
-  .tui-xl-mt-8 { margin-top: 8px; }
-  .tui-xl-mt-10 { margin-top: 10px; }
-  .tui-xl-mt-12 { margin-top: 12px; }
-  .tui-xl-mt-14 { margin-top: 14px; }
-  .tui-xl-mt-16 { margin-top: 16px; }
-  .tui-xl-mt-18 { margin-top: 18px; }
-  .tui-xl-mt-20 { margin-top: 20px; }
-  .tui-xl-mt-22 { margin-top: 22px; }
-  .tui-xl-mt-24 { margin-top: 24px; }
-  .tui-xl-mt-26 { margin-top: 26px; }
-  .tui-xl-mt-28 { margin-top: 28px; }
-  .tui-xl-mt-30 { margin-top: 30px; }
-  .tui-xl-mt-32 { margin-top: 32px; }
-  .tui-xl-mt-34 { margin-top: 34px; }
-  .tui-xl-mt-36 { margin-top: 36px; }
-  .tui-xl-mt-38 { margin-top: 38px; }
-  .tui-xl-mt-40 { margin-top: 40px; }
-
-  .tui-xl-mb-0 { margin-bottom: 0; }
-  .tui-xl-mb-2 { margin-bottom: 2px; }
-  .tui-xl-mb-4 { margin-bottom: 4px; }
-  .tui-xl-mb-6 { margin-bottom: 6px; }
-  .tui-xl-mb-8 { margin-bottom: 8px; }
-  .tui-xl-mb-10 { margin-bottom: 10px; }
-  .tui-xl-mb-12 { margin-bottom: 12px; }
-  .tui-xl-mb-14 { margin-bottom: 14px; }
-  .tui-xl-mb-16 { margin-bottom: 16px; }
-  .tui-xl-mb-18 { margin-bottom: 18px; }
-  .tui-xl-mb-20 { margin-bottom: 20px; }
-  .tui-xl-mb-22 { margin-bottom: 22px; }
-  .tui-xl-mb-24 { margin-bottom: 24px; }
-  .tui-xl-mb-26 { margin-bottom: 26px; }
-  .tui-xl-mb-28 { margin-bottom: 28px; }
-  .tui-xl-mb-30 { margin-bottom: 30px; }
-  .tui-xl-mb-32 { margin-bottom: 32px; }
-  .tui-xl-mb-34 { margin-bottom: 34px; }
-  .tui-xl-mb-36 { margin-bottom: 36px; }
-  .tui-xl-mb-38 { margin-bottom: 38px; }
-  .tui-xl-mb-40 { margin-bottom: 40px; }
-}
-
-@media (max-width: 992px) {
-  /* Displays
-  ---------------------------------*/
-  .tui-lg-none { display: none; }
-  .tui-lg-block { display: block; }
-  .tui-lg-flex { display: flex; }
-  .tui-lg-inline { display: inline; }
-  .tui-lg-inline-block { display: inline-block; }
-
-  .tui-lg-icy { opacity: 0.85; }
-  .tui-lg-glassy { opacity: 0.5; }
-  .tui-lg-ghostly { opacity: 0.25; }
-  .tui-lg-transparent { opacity: 0; }
-  .tui-lg-hidden { visibility: hidden; }
-
-  /* Flex
-  ---------------------------------*/
-  .tui-lg-flex-row { flex-direction: row; }
-  .tui-lg-flex-col { flex-direction: column; }
-  .tui-lg-flex-grow { flex-grow: 1; }
-  .tui-lg-flex-wrap { flex-wrap: wrap; }
-  .tui-lg-flex-center { align-items: center; justify-content: center; }
-  .tui-lg-flex-x-center { align-items: center; }
-  .tui-lg-flex-y-center { justify-content: center; }
-
-  /* Sizes
-  ---------------------------------*/
-  .tui-lg-h-10 { height: 10px; }
-  .tui-lg-h-12 { height: 12px; }
-  .tui-lg-h-15 { height: 15px; }
-  .tui-lg-h-16 { height: 16px; }
-  .tui-lg-h-20 { height: 20px; }
-  .tui-lg-h-24 { height: 24px; }
-  .tui-lg-h-25 { height: 25px; }
-  .tui-lg-h-30 { height: 30px; }
-  .tui-lg-h-32 { height: 32px; }
-  .tui-lg-h-35 { height: 35px; }
-  .tui-lg-h-36 { height: 36px; }
-  .tui-lg-h-40 { height: 40px; }
-  .tui-lg-h-45 { height: 45px; }
-  .tui-lg-h-48 { height: 48px; }
-  .tui-lg-h-50 { height: 50px; }
-  .tui-lg-h-55 { height: 55px; }
-  .tui-lg-h-60 { height: 60px; }
-  .tui-lg-h-64 { height: 64px; }
-  .tui-lg-h-65 { height: 65px; }
-  .tui-lg-h-70 { height: 70px; }
-  .tui-lg-h-75 { height: 75px; }
-  .tui-lg-h-80 { height: 80px; }
-  .tui-lg-h-85 { height: 85px; }
-  .tui-lg-h-90 { height: 90px; }
-  .tui-lg-h-95 { height: 95px; }
-  .tui-lg-h-96 { height: 96px; }
-  .tui-lg-h-100 { height: 100px; }
-  .tui-lg-h-110 { height: 110px; }
-  .tui-lg-h-120 { height: 120px; }
-  .tui-lg-h-130 { height: 130px; }
-  .tui-lg-h-140 { height: 140px; }
-  .tui-lg-h-150 { height: 150px; }
-  .tui-lg-h-160 { height: 160px; }
-  .tui-lg-h-170 { height: 170px; }
-  .tui-lg-h-180 { height: 180px; }
-  .tui-lg-h-190 { height: 190px; }
-  .tui-lg-h-200 { height: 200px; }
-  .tui-lg-h-220 { height: 220px; }
-  .tui-lg-h-240 { height: 240px; }
-  .tui-lg-h-260 { height: 260px; }
-  .tui-lg-h-280 { height: 280px; }
-  .tui-lg-h-300 { height: 300px; }
-  .tui-lg-h-320 { height: 320px; }
-  .tui-lg-h-340 { height: 340px; }
-  .tui-lg-h-360 { height: 360px; }
-  .tui-lg-h-full { height: 100%; }
-
-  .tui-lg-w-10 { width: 10px; }
-  .tui-lg-w-12 { width: 12px; }
-  .tui-lg-w-15 { width: 15px; }
-  .tui-lg-w-16 { width: 16px; }
-  .tui-lg-w-20 { width: 20px; }
-  .tui-lg-w-24 { width: 24px; }
-  .tui-lg-w-25 { width: 25px; }
-  .tui-lg-w-30 { width: 30px; }
-  .tui-lg-w-32 { width: 32px; }
-  .tui-lg-w-35 { width: 35px; }
-  .tui-lg-w-36 { width: 36px; }
-  .tui-lg-w-40 { width: 40px; }
-  .tui-lg-w-45 { width: 45px; }
-  .tui-lg-w-48 { width: 48px; }
-  .tui-lg-w-50 { width: 50px; }
-  .tui-lg-w-55 { width: 55px; }
-  .tui-lg-w-60 { width: 60px; }
-  .tui-lg-w-64 { width: 64px; }
-  .tui-lg-w-65 { width: 65px; }
-  .tui-lg-w-70 { width: 70px; }
-  .tui-lg-w-75 { width: 75px; }
-  .tui-lg-w-80 { width: 80px; }
-  .tui-lg-w-85 { width: 85px; }
-  .tui-lg-w-90 { width: 90px; }
-  .tui-lg-w-95 { width: 95px; }
-  .tui-lg-w-96 { width: 96px; }
-  .tui-lg-w-100 { width: 100px; }
-  .tui-lg-w-110 { width: 110px; }
-  .tui-lg-w-120 { width: 120px; }
-  .tui-lg-w-130 { width: 130px; }
-  .tui-lg-w-140 { width: 140px; }
-  .tui-lg-w-150 { width: 150px; }
-  .tui-lg-w-160 { width: 160px; }
-  .tui-lg-w-170 { width: 170px; }
-  .tui-lg-w-180 { width: 180px; }
-  .tui-lg-w-190 { width: 190px; }
-  .tui-lg-w-200 { width: 200px; }
-  .tui-lg-w-220 { width: 220px; }
-  .tui-lg-w-240 { width: 240px; }
-  .tui-lg-w-260 { width: 260px; }
-  .tui-lg-w-280 { width: 280px; }
-  .tui-lg-w-300 { width: 300px; }
-  .tui-lg-w-320 { width: 320px; }
-  .tui-lg-w-340 { width: 340px; }
-  .tui-lg-w-360 { width: 360px; }
-  .tui-lg-w-full { width: 100%; }
-
-  .tui-lg-mw-xs { max-width: 360px; }
-  .tui-lg-mw-xs { max-width: 420px; }
-  .tui-lg-mw-md { max-width: 767px; }
-  .tui-lg-mw-lg { max-width: 992px; }
-  .tui-lg-mw-xl { max-width: 1024px; }
-  .tui-lg-mw-full { max-width: 100%; }
-
-  /* Text
-  ---------------------------------*/
-  .tui-lg-tx-2xs { font-size: 8px; }
-  .tui-lg-tx-xs { font-size: 10px; }
-  .tui-lg-tx-sm { font-size: 12px; }
-  .tui-lg-tx-md { font-size: 14px; }
-  .tui-lg-tx-lg { font-size: 16px; }
-  .tui-lg-tx-xl { font-size: 18px; }
-  .tui-lg-tx-2xl { font-size: 20px; }
-  .tui-lg-tx-3xl { font-size: 22px; }
-  .tui-lg-tx-4xl { font-size: 24px; }
-  .tui-lg-tx-5xl { font-size: 26px; }
-  .tui-lg-tx-6xl { font-size: 28px; }
-  .tui-lg-tx-7xl { font-size: 30px; }
-
-  .tui-lg-tx-center { text-align: center; }
-  .tui-lg-tx-left { text-align: left; }
-  .tui-lg-tx-right { text-align: right; }
-
-  .tui-lg-tx-bold { font-weight: bold; }
-  .tui-lg-tx-normal { font-weight: normal; }
-  .tui-lg-tx-italic { font-style: italic; }
-  .tui-lg-tx-uppercase { text-transform: uppercase; }
-  .tui-lg-tx-underline { text-decoration: underline; }
-  .tui-lg-tx-nowrap { white-space: nowrap; }
-
-  /* Borders
-  ---------------------------------*/
-  .tui-lg-bd-solid { border-style: solid; }
-  .tui-lg-bd-dash { border-style: dashed; }
-  .tui-lg-bd-dotted { border-style: dotted; }
-
-  .tui-lg-bd { border: 1px solid var(--black); }
-  .tui-lg-bdt { border-top: 1px solid var(--black); }
-  .tui-lg-bdb { border-bottom: 1px solid var(--black); }
-  .tui-lg-bdl { border-left: 1px solid var(--black); }
-  .tui-lg-bdr { border-right: 1px solid var(--black); }
-
-  .tui-lg-bd-xs { border-width: 1px; }
-  .tui-lg-bd-sm { border-width: 2px; }
-  .tui-lg-bd-md { border-width: 3px; }
-  .tui-lg-bd-lg { border-width: 4px; }
-  .tui-lg-bd-xl { border-width: 5px; }
-
-  .tui-lg-bdt-xs { border-top-width: 1px; }
-  .tui-lg-bdt-sm { border-top-width: 2px; }
-  .tui-lg-bdt-md { border-top-width: 3px; }
-  .tui-lg-bdt-lg { border-top-width: 4px; }
-  .tui-lg-bdt-xl { border-top-width: 5px; }
-
-  .tui-lg-bdb-xs { border-bottom-width: 1px; }
-  .tui-lg-bdb-sm { border-bottom-width: 2px; }
-  .tui-lg-bdb-md { border-bottom-width: 3px; }
-  .tui-lg-bdb-lg { border-bottom-width: 4px; }
-  .tui-lg-bdb-xl { border-bottom-width: 5px; }
-
-  .tui-lg-bdl-xs { border-left-width: 1px; }
-  .tui-lg-bdl-sm { border-left-width: 2px; }
-  .tui-lg-bdl-md { border-left-width: 3px; }
-  .tui-lg-bdl-lg { border-left-width: 4px; }
-  .tui-lg-bdl-xl { border-left-width: 5px; }
-
-  .tui-lg-bdr-xs { border-right-width: 1px; }
-  .tui-lg-bdr-sm { border-right-width: 2px; }
-  .tui-lg-bdr-md { border-right-width: 3px; }
-  .tui-lg-bdr-lg { border-right-width: 4px; }
-  .tui-lg-bdr-xl { border-right-width: 5px; }
-
-  .tui-lg-bd-rad-xs { border-radius: 2px; }
-  .tui-lg-bd-rad-sm, .tui-bd-curved { border-radius: 4px; }
-  .tui-lg-bd-rad-md { border-radius: 6px; }
-  .tui-lg-bd-rad-lg { border-radius: 8px; }
-  .tui-lg-bd-rad-xl, .tui-bd-rounded { border-radius: 12px; }
-  .tui-lg-bd-rad-full, .tui-bd-pill { border-radius: 10000px; }
-
-  .tui-lg-bdl-rad-xs { border-radius: 2px 0 0 2px; }
-  .tui-lg-bdl-rad-sm, .tui-bdl-curved { border-radius: 4px 0 0 4px; }
-  .tui-lg-bdl-rad-md { border-radius: 6px 0 0 6px; }
-  .tui-lg-bdl-rad-lg { border-radius: 8px 0 0 8px; }
-  .tui-lg-bdl-rad-xl, .tui-bdl-rounded { border-radius: 12px 0 0 12px; }
-  .tui-lg-bdl-rad-full, .tui-bdl-pill { border-radius: 10000px 0 0 10000px; }
-
-  .tui-lg-bdr-rad-xs { border-radius: 0 2px 2px 0; }
-  .tui-lg-bdr-rad-sm, .tui-bdr-curved { border-radius: 0 4px 4px 0; }
-  .tui-lg-bdr-rad-md { border-radius: 0 6px 6px 0; }
-  .tui-lg-bdr-rad-lg { border-radius: 0 8px 8px 0; }
-  .tui-lg-bdr-rad-xl, .tui-bdr-rounded { border-radius: 0 12px 12px 0; }
-  .tui-lg-bdr-rad-full, .tui-bdr-pill { border-radius: 0 10000px 10000px 0; }
-
-  .tui-lg-bdt-rad-xs { border-radius: 2px 2px 0 0; }
-  .tui-lg-bdt-rad-sm, .tui-bdt-curved { border-radius: 4px 4px 0 0; }
-  .tui-lg-bdt-rad-md { border-radius: 6px 6px 0 0; }
-  .tui-lg-bdt-rad-lg { border-radius: 8px 8px 0 0; }
-  .tui-lg-bdt-rad-xl, .tui-bdt-rounded { border-radius: 12px 12px 0 0; }
-  .tui-lg-bdt-rad-full, .tui-bdt-pill { border-radius: 10000px 10000px 0 0; }
-
-  .tui-lg-bdb-rad-xs { border-radius: 2px 2px 0 0; }
-  .tui-lg-bdb-rad-sm, .tui-bdb-curved { border-radius: 0 0 4px 4px; }
-  .tui-lg-bdb-rad-md { border-radius: 0 0 6px 6px; }
-  .tui-lg-bdb-rad-lg { border-radius: 0 0 8px 8px; }
-  .tui-lg-bdb-rad-xl, .tui-bdb-rounded { border-radius: 0 0 12px 12px; }
-  .tui-lg-bdb-rad-full, .tui-bdb-pill { border-radius: 0 0 10000px 10000px; }
-
-  /* Padding
-  ---------------------------------*/
-  .tui-lg-p-0 { padding: 0; }
-  .tui-lg-p-2 { padding: 2px; }
-  .tui-lg-p-4 { padding: 4px; }
-  .tui-lg-p-6 { padding: 6px; }
-  .tui-lg-p-8 { padding: 8px; }
-  .tui-lg-p-10 { padding: 10px; }
-  .tui-lg-p-12 { padding: 12px; }
-  .tui-lg-p-14 { padding: 14px; }
-  .tui-lg-p-16 { padding: 16px; }
-  .tui-lg-p-18 { padding: 18px; }
-  .tui-lg-p-20 { padding: 20px; }
-  .tui-lg-p-22 { padding: 22px; }
-  .tui-lg-p-24 { padding: 24px; }
-  .tui-lg-p-26 { padding: 26px; }
-  .tui-lg-p-28 { padding: 28px; }
-  .tui-lg-p-30 { padding: 30px; }
-  .tui-lg-p-32 { padding: 32px; }
-  .tui-lg-p-34 { padding: 34px; }
-  .tui-lg-p-36 { padding: 36px; }
-  .tui-lg-p-38 { padding: 38px; }
-  .tui-lg-p-40 { padding: 40px; }
-
-  .tui-lg-pl-0 { padding-left: 0; }
-  .tui-lg-pl-2 { padding-left: 2px; }
-  .tui-lg-pl-4 { padding-left: 4px; }
-  .tui-lg-pl-6 { padding-left: 6px; }
-  .tui-lg-pl-8 { padding-left: 8px; }
-  .tui-lg-pl-10 { padding-left: 10px; }
-  .tui-lg-pl-12 { padding-left: 12px; }
-  .tui-lg-pl-14 { padding-left: 14px; }
-  .tui-lg-pl-16 { padding-left: 16px; }
-  .tui-lg-pl-18 { padding-left: 18px; }
-  .tui-lg-pl-20 { padding-left: 20px; }
-  .tui-lg-pl-22 { padding-left: 22px; }
-  .tui-lg-pl-24 { padding-left: 24px; }
-  .tui-lg-pl-26 { padding-left: 26px; }
-  .tui-lg-pl-28 { padding-left: 28px; }
-  .tui-lg-pl-30 { padding-left: 30px; }
-  .tui-lg-pl-32 { padding-left: 32px; }
-  .tui-lg-pl-34 { padding-left: 34px; }
-  .tui-lg-pl-36 { padding-left: 36px; }
-  .tui-lg-pl-38 { padding-left: 38px; }
-  .tui-lg-pl-40 { padding-left: 40px; }
-
-  .tui-lg-pr-0 { padding-right: 0; }
-  .tui-lg-pr-2 { padding-right: 2px; }
-  .tui-lg-pr-4 { padding-right: 4px; }
-  .tui-lg-pr-6 { padding-right: 6px; }
-  .tui-lg-pr-8 { padding-right: 8px; }
-  .tui-lg-pr-10 { padding-right: 10px; }
-  .tui-lg-pr-12 { padding-right: 12px; }
-  .tui-lg-pr-14 { padding-right: 14px; }
-  .tui-lg-pr-16 { padding-right: 16px; }
-  .tui-lg-pr-18 { padding-right: 18px; }
-  .tui-lg-pr-20 { padding-right: 20px; }
-  .tui-lg-pr-22 { padding-right: 22px; }
-  .tui-lg-pr-24 { padding-right: 24px; }
-  .tui-lg-pr-26 { padding-right: 26px; }
-  .tui-lg-pr-28 { padding-right: 28px; }
-  .tui-lg-pr-30 { padding-right: 30px; }
-  .tui-lg-pr-32 { padding-right: 32px; }
-  .tui-lg-pr-34 { padding-right: 34px; }
-  .tui-lg-pr-36 { padding-right: 36px; }
-  .tui-lg-pr-38 { padding-right: 38px; }
-  .tui-lg-pr-40 { padding-right: 40px; }
-
-  .tui-lg-pt-0 { padding-top: 0; }
-  .tui-lg-pt-2 { padding-top: 2px; }
-  .tui-lg-pt-4 { padding-top: 4px; }
-  .tui-lg-pt-6 { padding-top: 6px; }
-  .tui-lg-pt-8 { padding-top: 8px; }
-  .tui-lg-pt-10 { padding-top: 10px; }
-  .tui-lg-pt-12 { padding-top: 12px; }
-  .tui-lg-pt-14 { padding-top: 14px; }
-  .tui-lg-pt-16 { padding-top: 16px; }
-  .tui-lg-pt-18 { padding-top: 18px; }
-  .tui-lg-pt-20 { padding-top: 20px; }
-  .tui-lg-pt-22 { padding-top: 22px; }
-  .tui-lg-pt-24 { padding-top: 24px; }
-  .tui-lg-pt-26 { padding-top: 26px; }
-  .tui-lg-pt-28 { padding-top: 28px; }
-  .tui-lg-pt-30 { padding-top: 30px; }
-  .tui-lg-pt-32 { padding-top: 32px; }
-  .tui-lg-pt-34 { padding-top: 34px; }
-  .tui-lg-pt-36 { padding-top: 36px; }
-  .tui-lg-pt-38 { padding-top: 38px; }
-  .tui-lg-pt-40 { padding-top: 40px; }
-
-  .tui-lg-pb-0 { padding-bottom: 0; }
-  .tui-lg-pb-2 { padding-bottom: 2px; }
-  .tui-lg-pb-4 { padding-bottom: 4px; }
-  .tui-lg-pb-6 { padding-bottom: 6px; }
-  .tui-lg-pb-8 { padding-bottom: 8px; }
-  .tui-lg-pb-10 { padding-bottom: 10px; }
-  .tui-lg-pb-12 { padding-bottom: 12px; }
-  .tui-lg-pb-14 { padding-bottom: 14px; }
-  .tui-lg-pb-16 { padding-bottom: 16px; }
-  .tui-lg-pb-18 { padding-bottom: 18px; }
-  .tui-lg-pb-20 { padding-bottom: 20px; }
-  .tui-lg-pb-22 { padding-bottom: 22px; }
-  .tui-lg-pb-24 { padding-bottom: 24px; }
-  .tui-lg-pb-26 { padding-bottom: 26px; }
-  .tui-lg-pb-28 { padding-bottom: 28px; }
-  .tui-lg-pb-30 { padding-bottom: 30px; }
-  .tui-lg-pb-32 { padding-bottom: 32px; }
-  .tui-lg-pb-34 { padding-bottom: 34px; }
-  .tui-lg-pb-36 { padding-bottom: 36px; }
-  .tui-lg-pb-38 { padding-bottom: 38px; }
-  .tui-lg-pb-40 { padding-bottom: 40px; }
-
-  /* Margin
-  ---------------------------------*/
-  .tui-lg-m-0 { margin: 0; }
-  .tui-lg-m-2 { margin: 2px; }
-  .tui-lg-m-4 { margin: 4px; }
-  .tui-lg-m-6 { margin: 6px; }
-  .tui-lg-m-8 { margin: 8px; }
-  .tui-lg-m-10 { margin: 10px; }
-  .tui-lg-m-12 { margin: 12px; }
-  .tui-lg-m-14 { margin: 14px; }
-  .tui-lg-m-16 { margin: 16px; }
-  .tui-lg-m-18 { margin: 18px; }
-  .tui-lg-m-20 { margin: 20px; }
-  .tui-lg-m-22 { margin: 22px; }
-  .tui-lg-m-24 { margin: 24px; }
-  .tui-lg-m-26 { margin: 26px; }
-  .tui-lg-m-28 { margin: 28px; }
-  .tui-lg-m-30 { margin: 30px; }
-  .tui-lg-m-32 { margin: 32px; }
-  .tui-lg-m-34 { margin: 34px; }
-  .tui-lg-m-36 { margin: 36px; }
-  .tui-lg-m-38 { margin: 38px; }
-  .tui-lg-m-40 { margin: 40px; }
-
-  .tui-lg-ml-0 { margin-left: 0; }
-  .tui-lg-ml-2 { margin-left: 2px; }
-  .tui-lg-ml-4 { margin-left: 4px; }
-  .tui-lg-ml-6 { margin-left: 6px; }
-  .tui-lg-ml-8 { margin-left: 8px; }
-  .tui-lg-ml-10 { margin-left: 10px; }
-  .tui-lg-ml-12 { margin-left: 12px; }
-  .tui-lg-ml-14 { margin-left: 14px; }
-  .tui-lg-ml-16 { margin-left: 16px; }
-  .tui-lg-ml-18 { margin-left: 18px; }
-  .tui-lg-ml-20 { margin-left: 20px; }
-  .tui-lg-ml-22 { margin-left: 22px; }
-  .tui-lg-ml-24 { margin-left: 24px; }
-  .tui-lg-ml-26 { margin-left: 26px; }
-  .tui-lg-ml-28 { margin-left: 28px; }
-  .tui-lg-ml-30 { margin-left: 30px; }
-  .tui-lg-ml-32 { margin-left: 32px; }
-  .tui-lg-ml-34 { margin-left: 34px; }
-  .tui-lg-ml-36 { margin-left: 36px; }
-  .tui-lg-ml-38 { margin-left: 38px; }
-  .tui-lg-ml-40 { margin-left: 40px; }
-
-  .tui-lg-mr-0 { margin-right: 0; }
-  .tui-lg-mr-2 { margin-right: 2px; }
-  .tui-lg-mr-4 { margin-right: 4px; }
-  .tui-lg-mr-6 { margin-right: 6px; }
-  .tui-lg-mr-8 { margin-right: 8px; }
-  .tui-lg-mr-10 { margin-right: 10px; }
-  .tui-lg-mr-12 { margin-right: 12px; }
-  .tui-lg-mr-14 { margin-right: 14px; }
-  .tui-lg-mr-16 { margin-right: 16px; }
-  .tui-lg-mr-18 { margin-right: 18px; }
-  .tui-lg-mr-20 { margin-right: 20px; }
-  .tui-lg-mr-22 { margin-right: 22px; }
-  .tui-lg-mr-24 { margin-right: 24px; }
-  .tui-lg-mr-26 { margin-right: 26px; }
-  .tui-lg-mr-28 { margin-right: 28px; }
-  .tui-lg-mr-30 { margin-right: 30px; }
-  .tui-lg-mr-32 { margin-right: 32px; }
-  .tui-lg-mr-34 { margin-right: 34px; }
-  .tui-lg-mr-36 { margin-right: 36px; }
-  .tui-lg-mr-38 { margin-right: 38px; }
-  .tui-lg-mr-40 { margin-right: 40px; }
-
-  .tui-lg-mt-0 { margin-top: 0; }
-  .tui-lg-mt-2 { margin-top: 2px; }
-  .tui-lg-mt-4 { margin-top: 4px; }
-  .tui-lg-mt-6 { margin-top: 6px; }
-  .tui-lg-mt-8 { margin-top: 8px; }
-  .tui-lg-mt-10 { margin-top: 10px; }
-  .tui-lg-mt-12 { margin-top: 12px; }
-  .tui-lg-mt-14 { margin-top: 14px; }
-  .tui-lg-mt-16 { margin-top: 16px; }
-  .tui-lg-mt-18 { margin-top: 18px; }
-  .tui-lg-mt-20 { margin-top: 20px; }
-  .tui-lg-mt-22 { margin-top: 22px; }
-  .tui-lg-mt-24 { margin-top: 24px; }
-  .tui-lg-mt-26 { margin-top: 26px; }
-  .tui-lg-mt-28 { margin-top: 28px; }
-  .tui-lg-mt-30 { margin-top: 30px; }
-  .tui-lg-mt-32 { margin-top: 32px; }
-  .tui-lg-mt-34 { margin-top: 34px; }
-  .tui-lg-mt-36 { margin-top: 36px; }
-  .tui-lg-mt-38 { margin-top: 38px; }
-  .tui-lg-mt-40 { margin-top: 40px; }
-
-  .tui-lg-mb-0 { margin-bottom: 0; }
-  .tui-lg-mb-2 { margin-bottom: 2px; }
-  .tui-lg-mb-4 { margin-bottom: 4px; }
-  .tui-lg-mb-6 { margin-bottom: 6px; }
-  .tui-lg-mb-8 { margin-bottom: 8px; }
-  .tui-lg-mb-10 { margin-bottom: 10px; }
-  .tui-lg-mb-12 { margin-bottom: 12px; }
-  .tui-lg-mb-14 { margin-bottom: 14px; }
-  .tui-lg-mb-16 { margin-bottom: 16px; }
-  .tui-lg-mb-18 { margin-bottom: 18px; }
-  .tui-lg-mb-20 { margin-bottom: 20px; }
-  .tui-lg-mb-22 { margin-bottom: 22px; }
-  .tui-lg-mb-24 { margin-bottom: 24px; }
-  .tui-lg-mb-26 { margin-bottom: 26px; }
-  .tui-lg-mb-28 { margin-bottom: 28px; }
-  .tui-lg-mb-30 { margin-bottom: 30px; }
-  .tui-lg-mb-32 { margin-bottom: 32px; }
-  .tui-lg-mb-34 { margin-bottom: 34px; }
-  .tui-lg-mb-36 { margin-bottom: 36px; }
-  .tui-lg-mb-38 { margin-bottom: 38px; }
-  .tui-lg-mb-40 { margin-bottom: 40px; }
-}
-
-@media (max-width: 767px) {
-  /* Displays
-  ---------------------------------*/
-  .tui-md-none { display: none; }
-  .tui-md-block { display: block; }
-  .tui-md-flex { display: flex; }
-  .tui-md-inline { display: inline; }
-  .tui-md-inline-block { display: inline-block; }
-
-  .tui-md-icy { opacity: 0.85; }
-  .tui-md-glassy { opacity: 0.5; }
-  .tui-md-ghostly { opacity: 0.25; }
-  .tui-md-transparent { opacity: 0; }
-  .tui-md-hidden { visibility: hidden; }
-
-  /* Flex
-  ---------------------------------*/
-  .tui-md-flex-row { flex-direction: row; }
-  .tui-md-flex-col { flex-direction: column; }
-  .tui-md-flex-grow { flex-grow: 1; }
-  .tui-md-flex-wrap { flex-wrap: wrap; }
-  .tui-md-flex-center { align-items: center; justify-content: center; }
-  .tui-md-flex-x-center { align-items: center; }
-  .tui-md-flex-y-center { justify-content: center; }
-
-  /* Sizes
-  ---------------------------------*/
-  .tui-md-h-10 { height: 10px; }
-  .tui-md-h-12 { height: 12px; }
-  .tui-md-h-15 { height: 15px; }
-  .tui-md-h-16 { height: 16px; }
-  .tui-md-h-20 { height: 20px; }
-  .tui-md-h-24 { height: 24px; }
-  .tui-md-h-25 { height: 25px; }
-  .tui-md-h-30 { height: 30px; }
-  .tui-md-h-32 { height: 32px; }
-  .tui-md-h-35 { height: 35px; }
-  .tui-md-h-36 { height: 36px; }
-  .tui-md-h-40 { height: 40px; }
-  .tui-md-h-45 { height: 45px; }
-  .tui-md-h-48 { height: 48px; }
-  .tui-md-h-50 { height: 50px; }
-  .tui-md-h-55 { height: 55px; }
-  .tui-md-h-60 { height: 60px; }
-  .tui-md-h-64 { height: 64px; }
-  .tui-md-h-65 { height: 65px; }
-  .tui-md-h-70 { height: 70px; }
-  .tui-md-h-75 { height: 75px; }
-  .tui-md-h-80 { height: 80px; }
-  .tui-md-h-85 { height: 85px; }
-  .tui-md-h-90 { height: 90px; }
-  .tui-md-h-95 { height: 95px; }
-  .tui-md-h-96 { height: 96px; }
-  .tui-md-h-100 { height: 100px; }
-  .tui-md-h-110 { height: 110px; }
-  .tui-md-h-120 { height: 120px; }
-  .tui-md-h-130 { height: 130px; }
-  .tui-md-h-140 { height: 140px; }
-  .tui-md-h-150 { height: 150px; }
-  .tui-md-h-160 { height: 160px; }
-  .tui-md-h-170 { height: 170px; }
-  .tui-md-h-180 { height: 180px; }
-  .tui-md-h-190 { height: 190px; }
-  .tui-md-h-200 { height: 200px; }
-  .tui-md-h-220 { height: 220px; }
-  .tui-md-h-240 { height: 240px; }
-  .tui-md-h-260 { height: 260px; }
-  .tui-md-h-280 { height: 280px; }
-  .tui-md-h-300 { height: 300px; }
-  .tui-md-h-320 { height: 320px; }
-  .tui-md-h-340 { height: 340px; }
-  .tui-md-h-360 { height: 360px; }
-  .tui-md-h-full { height: 100%; }
-
-  .tui-md-w-10 { width: 10px; }
-  .tui-md-w-12 { width: 12px; }
-  .tui-md-w-15 { width: 15px; }
-  .tui-md-w-16 { width: 16px; }
-  .tui-md-w-20 { width: 20px; }
-  .tui-md-w-24 { width: 24px; }
-  .tui-md-w-25 { width: 25px; }
-  .tui-md-w-30 { width: 30px; }
-  .tui-md-w-32 { width: 32px; }
-  .tui-md-w-35 { width: 35px; }
-  .tui-md-w-36 { width: 36px; }
-  .tui-md-w-40 { width: 40px; }
-  .tui-md-w-45 { width: 45px; }
-  .tui-md-w-48 { width: 48px; }
-  .tui-md-w-50 { width: 50px; }
-  .tui-md-w-55 { width: 55px; }
-  .tui-md-w-60 { width: 60px; }
-  .tui-md-w-64 { width: 64px; }
-  .tui-md-w-65 { width: 65px; }
-  .tui-md-w-70 { width: 70px; }
-  .tui-md-w-75 { width: 75px; }
-  .tui-md-w-80 { width: 80px; }
-  .tui-md-w-85 { width: 85px; }
-  .tui-md-w-90 { width: 90px; }
-  .tui-md-w-95 { width: 95px; }
-  .tui-md-w-96 { width: 96px; }
-  .tui-md-w-100 { width: 100px; }
-  .tui-md-w-110 { width: 110px; }
-  .tui-md-w-120 { width: 120px; }
-  .tui-md-w-130 { width: 130px; }
-  .tui-md-w-140 { width: 140px; }
-  .tui-md-w-150 { width: 150px; }
-  .tui-md-w-160 { width: 160px; }
-  .tui-md-w-170 { width: 170px; }
-  .tui-md-w-180 { width: 180px; }
-  .tui-md-w-190 { width: 190px; }
-  .tui-md-w-200 { width: 200px; }
-  .tui-md-w-220 { width: 220px; }
-  .tui-md-w-240 { width: 240px; }
-  .tui-md-w-260 { width: 260px; }
-  .tui-md-w-280 { width: 280px; }
-  .tui-md-w-300 { width: 300px; }
-  .tui-md-w-320 { width: 320px; }
-  .tui-md-w-340 { width: 340px; }
-  .tui-md-w-360 { width: 360px; }
-  .tui-md-w-full { width: 100%; }
-
-  .tui-md-mw-xs { max-width: 360px; }
-  .tui-md-mw-xs { max-width: 420px; }
-  .tui-md-mw-md { max-width: 767px; }
-  .tui-md-mw-lg { max-width: 992px; }
-  .tui-md-mw-xl { max-width: 1024px; }
-  .tui-md-mw-full { max-width: 100%; }
-
-  /* Text
-  ---------------------------------*/
-  .tui-md-tx-2xs { font-size: 8px; }
-  .tui-md-tx-xs { font-size: 10px; }
-  .tui-md-tx-sm { font-size: 12px; }
-  .tui-md-tx-md { font-size: 14px; }
-  .tui-md-tx-lg { font-size: 16px; }
-  .tui-md-tx-xl { font-size: 18px; }
-  .tui-md-tx-2xl { font-size: 20px; }
-  .tui-md-tx-3xl { font-size: 22px; }
-  .tui-md-tx-4xl { font-size: 24px; }
-  .tui-md-tx-5xl { font-size: 26px; }
-  .tui-md-tx-6xl { font-size: 28px; }
-  .tui-md-tx-7xl { font-size: 30px; }
-
-  .tui-md-tx-center { text-align: center; }
-  .tui-md-tx-left { text-align: left; }
-  .tui-md-tx-right { text-align: right; }
-
-  .tui-md-tx-bold { font-weight: bold; }
-  .tui-md-tx-normal { font-weight: normal; }
-  .tui-md-tx-italic { font-style: italic; }
-  .tui-md-tx-uppercase { text-transform: uppercase; }
-  .tui-md-tx-underline { text-decoration: underline; }
-  .tui-md-tx-nowrap { white-space: nowrap; }
-
-  /* Borders
-  ---------------------------------*/
-  .tui-md-bd-solid { border-style: solid; }
-  .tui-md-bd-dash { border-style: dashed; }
-  .tui-md-bd-dotted { border-style: dotted; }
-
-  .tui-md-bd { border: 1px solid var(--black); }
-  .tui-md-bdt { border-top: 1px solid var(--black); }
-  .tui-md-bdb { border-bottom: 1px solid var(--black); }
-  .tui-md-bdl { border-left: 1px solid var(--black); }
-  .tui-md-bdr { border-right: 1px solid var(--black); }
-
-  .tui-md-bd-xs { border-width: 1px; }
-  .tui-md-bd-sm { border-width: 2px; }
-  .tui-md-bd-md { border-width: 3px; }
-  .tui-md-bd-lg { border-width: 4px; }
-  .tui-md-bd-xl { border-width: 5px; }
-
-  .tui-md-bdt-xs { border-top-width: 1px; }
-  .tui-md-bdt-sm { border-top-width: 2px; }
-  .tui-md-bdt-md { border-top-width: 3px; }
-  .tui-md-bdt-lg { border-top-width: 4px; }
-  .tui-md-bdt-xl { border-top-width: 5px; }
-
-  .tui-md-bdb-xs { border-bottom-width: 1px; }
-  .tui-md-bdb-sm { border-bottom-width: 2px; }
-  .tui-md-bdb-md { border-bottom-width: 3px; }
-  .tui-md-bdb-lg { border-bottom-width: 4px; }
-  .tui-md-bdb-xl { border-bottom-width: 5px; }
-
-  .tui-md-bdl-xs { border-left-width: 1px; }
-  .tui-md-bdl-sm { border-left-width: 2px; }
-  .tui-md-bdl-md { border-left-width: 3px; }
-  .tui-md-bdl-lg { border-left-width: 4px; }
-  .tui-md-bdl-xl { border-left-width: 5px; }
-
-  .tui-md-bdr-xs { border-right-width: 1px; }
-  .tui-md-bdr-sm { border-right-width: 2px; }
-  .tui-md-bdr-md { border-right-width: 3px; }
-  .tui-md-bdr-lg { border-right-width: 4px; }
-  .tui-md-bdr-xl { border-right-width: 5px; }
-
-  .tui-md-bd-rad-xs { border-radius: 2px; }
-  .tui-md-bd-rad-sm, .tui-bd-curved { border-radius: 4px; }
-  .tui-md-bd-rad-md { border-radius: 6px; }
-  .tui-md-bd-rad-lg { border-radius: 8px; }
-  .tui-md-bd-rad-xl, .tui-bd-rounded { border-radius: 12px; }
-  .tui-md-bd-rad-full, .tui-bd-pill { border-radius: 10000px; }
-
-  .tui-md-bdl-rad-xs { border-radius: 2px 0 0 2px; }
-  .tui-md-bdl-rad-sm, .tui-bdl-curved { border-radius: 4px 0 0 4px; }
-  .tui-md-bdl-rad-md { border-radius: 6px 0 0 6px; }
-  .tui-md-bdl-rad-lg { border-radius: 8px 0 0 8px; }
-  .tui-md-bdl-rad-xl, .tui-bdl-rounded { border-radius: 12px 0 0 12px; }
-  .tui-md-bdl-rad-full, .tui-bdl-pill { border-radius: 10000px 0 0 10000px; }
-
-  .tui-md-bdr-rad-xs { border-radius: 0 2px 2px 0; }
-  .tui-md-bdr-rad-sm, .tui-bdr-curved { border-radius: 0 4px 4px 0; }
-  .tui-md-bdr-rad-md { border-radius: 0 6px 6px 0; }
-  .tui-md-bdr-rad-lg { border-radius: 0 8px 8px 0; }
-  .tui-md-bdr-rad-xl, .tui-bdr-rounded { border-radius: 0 12px 12px 0; }
-  .tui-md-bdr-rad-full, .tui-bdr-pill { border-radius: 0 10000px 10000px 0; }
-
-  .tui-md-bdt-rad-xs { border-radius: 2px 2px 0 0; }
-  .tui-md-bdt-rad-sm, .tui-bdt-curved { border-radius: 4px 4px 0 0; }
-  .tui-md-bdt-rad-md { border-radius: 6px 6px 0 0; }
-  .tui-md-bdt-rad-lg { border-radius: 8px 8px 0 0; }
-  .tui-md-bdt-rad-xl, .tui-bdt-rounded { border-radius: 12px 12px 0 0; }
-  .tui-md-bdt-rad-full, .tui-bdt-pill { border-radius: 10000px 10000px 0 0; }
-
-  .tui-md-bdb-rad-xs { border-radius: 2px 2px 0 0; }
-  .tui-md-bdb-rad-sm, .tui-bdb-curved { border-radius: 0 0 4px 4px; }
-  .tui-md-bdb-rad-md { border-radius: 0 0 6px 6px; }
-  .tui-md-bdb-rad-lg { border-radius: 0 0 8px 8px; }
-  .tui-md-bdb-rad-xl, .tui-bdb-rounded { border-radius: 0 0 12px 12px; }
-  .tui-md-bdb-rad-full, .tui-bdb-pill { border-radius: 0 0 10000px 10000px; }
-
-  /* Padding
-  ---------------------------------*/
-  .tui-md-p-0 { padding: 0; }
-  .tui-md-p-2 { padding: 2px; }
-  .tui-md-p-4 { padding: 4px; }
-  .tui-md-p-6 { padding: 6px; }
-  .tui-md-p-8 { padding: 8px; }
-  .tui-md-p-10 { padding: 10px; }
-  .tui-md-p-12 { padding: 12px; }
-  .tui-md-p-14 { padding: 14px; }
-  .tui-md-p-16 { padding: 16px; }
-  .tui-md-p-18 { padding: 18px; }
-  .tui-md-p-20 { padding: 20px; }
-  .tui-md-p-22 { padding: 22px; }
-  .tui-md-p-24 { padding: 24px; }
-  .tui-md-p-26 { padding: 26px; }
-  .tui-md-p-28 { padding: 28px; }
-  .tui-md-p-30 { padding: 30px; }
-  .tui-md-p-32 { padding: 32px; }
-  .tui-md-p-34 { padding: 34px; }
-  .tui-md-p-36 { padding: 36px; }
-  .tui-md-p-38 { padding: 38px; }
-  .tui-md-p-40 { padding: 40px; }
-
-  .tui-md-pl-0 { padding-left: 0; }
-  .tui-md-pl-2 { padding-left: 2px; }
-  .tui-md-pl-4 { padding-left: 4px; }
-  .tui-md-pl-6 { padding-left: 6px; }
-  .tui-md-pl-8 { padding-left: 8px; }
-  .tui-md-pl-10 { padding-left: 10px; }
-  .tui-md-pl-12 { padding-left: 12px; }
-  .tui-md-pl-14 { padding-left: 14px; }
-  .tui-md-pl-16 { padding-left: 16px; }
-  .tui-md-pl-18 { padding-left: 18px; }
-  .tui-md-pl-20 { padding-left: 20px; }
-  .tui-md-pl-22 { padding-left: 22px; }
-  .tui-md-pl-24 { padding-left: 24px; }
-  .tui-md-pl-26 { padding-left: 26px; }
-  .tui-md-pl-28 { padding-left: 28px; }
-  .tui-md-pl-30 { padding-left: 30px; }
-  .tui-md-pl-32 { padding-left: 32px; }
-  .tui-md-pl-34 { padding-left: 34px; }
-  .tui-md-pl-36 { padding-left: 36px; }
-  .tui-md-pl-38 { padding-left: 38px; }
-  .tui-md-pl-40 { padding-left: 40px; }
-
-  .tui-md-pr-0 { padding-right: 0; }
-  .tui-md-pr-2 { padding-right: 2px; }
-  .tui-md-pr-4 { padding-right: 4px; }
-  .tui-md-pr-6 { padding-right: 6px; }
-  .tui-md-pr-8 { padding-right: 8px; }
-  .tui-md-pr-10 { padding-right: 10px; }
-  .tui-md-pr-12 { padding-right: 12px; }
-  .tui-md-pr-14 { padding-right: 14px; }
-  .tui-md-pr-16 { padding-right: 16px; }
-  .tui-md-pr-18 { padding-right: 18px; }
-  .tui-md-pr-20 { padding-right: 20px; }
-  .tui-md-pr-22 { padding-right: 22px; }
-  .tui-md-pr-24 { padding-right: 24px; }
-  .tui-md-pr-26 { padding-right: 26px; }
-  .tui-md-pr-28 { padding-right: 28px; }
-  .tui-md-pr-30 { padding-right: 30px; }
-  .tui-md-pr-32 { padding-right: 32px; }
-  .tui-md-pr-34 { padding-right: 34px; }
-  .tui-md-pr-36 { padding-right: 36px; }
-  .tui-md-pr-38 { padding-right: 38px; }
-  .tui-md-pr-40 { padding-right: 40px; }
-
-  .tui-md-pt-0 { padding-top: 0; }
-  .tui-md-pt-2 { padding-top: 2px; }
-  .tui-md-pt-4 { padding-top: 4px; }
-  .tui-md-pt-6 { padding-top: 6px; }
-  .tui-md-pt-8 { padding-top: 8px; }
-  .tui-md-pt-10 { padding-top: 10px; }
-  .tui-md-pt-12 { padding-top: 12px; }
-  .tui-md-pt-14 { padding-top: 14px; }
-  .tui-md-pt-16 { padding-top: 16px; }
-  .tui-md-pt-18 { padding-top: 18px; }
-  .tui-md-pt-20 { padding-top: 20px; }
-  .tui-md-pt-22 { padding-top: 22px; }
-  .tui-md-pt-24 { padding-top: 24px; }
-  .tui-md-pt-26 { padding-top: 26px; }
-  .tui-md-pt-28 { padding-top: 28px; }
-  .tui-md-pt-30 { padding-top: 30px; }
-  .tui-md-pt-32 { padding-top: 32px; }
-  .tui-md-pt-34 { padding-top: 34px; }
-  .tui-md-pt-36 { padding-top: 36px; }
-  .tui-md-pt-38 { padding-top: 38px; }
-  .tui-md-pt-40 { padding-top: 40px; }
-
-  .tui-md-pb-0 { padding-bottom: 0; }
-  .tui-md-pb-2 { padding-bottom: 2px; }
-  .tui-md-pb-4 { padding-bottom: 4px; }
-  .tui-md-pb-6 { padding-bottom: 6px; }
-  .tui-md-pb-8 { padding-bottom: 8px; }
-  .tui-md-pb-10 { padding-bottom: 10px; }
-  .tui-md-pb-12 { padding-bottom: 12px; }
-  .tui-md-pb-14 { padding-bottom: 14px; }
-  .tui-md-pb-16 { padding-bottom: 16px; }
-  .tui-md-pb-18 { padding-bottom: 18px; }
-  .tui-md-pb-20 { padding-bottom: 20px; }
-  .tui-md-pb-22 { padding-bottom: 22px; }
-  .tui-md-pb-24 { padding-bottom: 24px; }
-  .tui-md-pb-26 { padding-bottom: 26px; }
-  .tui-md-pb-28 { padding-bottom: 28px; }
-  .tui-md-pb-30 { padding-bottom: 30px; }
-  .tui-md-pb-32 { padding-bottom: 32px; }
-  .tui-md-pb-34 { padding-bottom: 34px; }
-  .tui-md-pb-36 { padding-bottom: 36px; }
-  .tui-md-pb-38 { padding-bottom: 38px; }
-  .tui-md-pb-40 { padding-bottom: 40px; }
-
-  /* Margin
-  ---------------------------------*/
-  .tui-md-m-0 { margin: 0; }
-  .tui-md-m-2 { margin: 2px; }
-  .tui-md-m-4 { margin: 4px; }
-  .tui-md-m-6 { margin: 6px; }
-  .tui-md-m-8 { margin: 8px; }
-  .tui-md-m-10 { margin: 10px; }
-  .tui-md-m-12 { margin: 12px; }
-  .tui-md-m-14 { margin: 14px; }
-  .tui-md-m-16 { margin: 16px; }
-  .tui-md-m-18 { margin: 18px; }
-  .tui-md-m-20 { margin: 20px; }
-  .tui-md-m-22 { margin: 22px; }
-  .tui-md-m-24 { margin: 24px; }
-  .tui-md-m-26 { margin: 26px; }
-  .tui-md-m-28 { margin: 28px; }
-  .tui-md-m-30 { margin: 30px; }
-  .tui-md-m-32 { margin: 32px; }
-  .tui-md-m-34 { margin: 34px; }
-  .tui-md-m-36 { margin: 36px; }
-  .tui-md-m-38 { margin: 38px; }
-  .tui-md-m-40 { margin: 40px; }
-
-  .tui-md-ml-0 { margin-left: 0; }
-  .tui-md-ml-2 { margin-left: 2px; }
-  .tui-md-ml-4 { margin-left: 4px; }
-  .tui-md-ml-6 { margin-left: 6px; }
-  .tui-md-ml-8 { margin-left: 8px; }
-  .tui-md-ml-10 { margin-left: 10px; }
-  .tui-md-ml-12 { margin-left: 12px; }
-  .tui-md-ml-14 { margin-left: 14px; }
-  .tui-md-ml-16 { margin-left: 16px; }
-  .tui-md-ml-18 { margin-left: 18px; }
-  .tui-md-ml-20 { margin-left: 20px; }
-  .tui-md-ml-22 { margin-left: 22px; }
-  .tui-md-ml-24 { margin-left: 24px; }
-  .tui-md-ml-26 { margin-left: 26px; }
-  .tui-md-ml-28 { margin-left: 28px; }
-  .tui-md-ml-30 { margin-left: 30px; }
-  .tui-md-ml-32 { margin-left: 32px; }
-  .tui-md-ml-34 { margin-left: 34px; }
-  .tui-md-ml-36 { margin-left: 36px; }
-  .tui-md-ml-38 { margin-left: 38px; }
-  .tui-md-ml-40 { margin-left: 40px; }
-
-  .tui-md-mr-0 { margin-right: 0; }
-  .tui-md-mr-2 { margin-right: 2px; }
-  .tui-md-mr-4 { margin-right: 4px; }
-  .tui-md-mr-6 { margin-right: 6px; }
-  .tui-md-mr-8 { margin-right: 8px; }
-  .tui-md-mr-10 { margin-right: 10px; }
-  .tui-md-mr-12 { margin-right: 12px; }
-  .tui-md-mr-14 { margin-right: 14px; }
-  .tui-md-mr-16 { margin-right: 16px; }
-  .tui-md-mr-18 { margin-right: 18px; }
-  .tui-md-mr-20 { margin-right: 20px; }
-  .tui-md-mr-22 { margin-right: 22px; }
-  .tui-md-mr-24 { margin-right: 24px; }
-  .tui-md-mr-26 { margin-right: 26px; }
-  .tui-md-mr-28 { margin-right: 28px; }
-  .tui-md-mr-30 { margin-right: 30px; }
-  .tui-md-mr-32 { margin-right: 32px; }
-  .tui-md-mr-34 { margin-right: 34px; }
-  .tui-md-mr-36 { margin-right: 36px; }
-  .tui-md-mr-38 { margin-right: 38px; }
-  .tui-md-mr-40 { margin-right: 40px; }
-
-  .tui-md-mt-0 { margin-top: 0; }
-  .tui-md-mt-2 { margin-top: 2px; }
-  .tui-md-mt-4 { margin-top: 4px; }
-  .tui-md-mt-6 { margin-top: 6px; }
-  .tui-md-mt-8 { margin-top: 8px; }
-  .tui-md-mt-10 { margin-top: 10px; }
-  .tui-md-mt-12 { margin-top: 12px; }
-  .tui-md-mt-14 { margin-top: 14px; }
-  .tui-md-mt-16 { margin-top: 16px; }
-  .tui-md-mt-18 { margin-top: 18px; }
-  .tui-md-mt-20 { margin-top: 20px; }
-  .tui-md-mt-22 { margin-top: 22px; }
-  .tui-md-mt-24 { margin-top: 24px; }
-  .tui-md-mt-26 { margin-top: 26px; }
-  .tui-md-mt-28 { margin-top: 28px; }
-  .tui-md-mt-30 { margin-top: 30px; }
-  .tui-md-mt-32 { margin-top: 32px; }
-  .tui-md-mt-34 { margin-top: 34px; }
-  .tui-md-mt-36 { margin-top: 36px; }
-  .tui-md-mt-38 { margin-top: 38px; }
-  .tui-md-mt-40 { margin-top: 40px; }
-
-  .tui-md-mb-0 { margin-bottom: 0; }
-  .tui-md-mb-2 { margin-bottom: 2px; }
-  .tui-md-mb-4 { margin-bottom: 4px; }
-  .tui-md-mb-6 { margin-bottom: 6px; }
-  .tui-md-mb-8 { margin-bottom: 8px; }
-  .tui-md-mb-10 { margin-bottom: 10px; }
-  .tui-md-mb-12 { margin-bottom: 12px; }
-  .tui-md-mb-14 { margin-bottom: 14px; }
-  .tui-md-mb-16 { margin-bottom: 16px; }
-  .tui-md-mb-18 { margin-bottom: 18px; }
-  .tui-md-mb-20 { margin-bottom: 20px; }
-  .tui-md-mb-22 { margin-bottom: 22px; }
-  .tui-md-mb-24 { margin-bottom: 24px; }
-  .tui-md-mb-26 { margin-bottom: 26px; }
-  .tui-md-mb-28 { margin-bottom: 28px; }
-  .tui-md-mb-30 { margin-bottom: 30px; }
-  .tui-md-mb-32 { margin-bottom: 32px; }
-  .tui-md-mb-34 { margin-bottom: 34px; }
-  .tui-md-mb-36 { margin-bottom: 36px; }
-  .tui-md-mb-38 { margin-bottom: 38px; }
-  .tui-md-mb-40 { margin-bottom: 40px; }
-}
-
-@media (max-width: 420px) {
-  /* Displays
-  ---------------------------------*/
-  .tui-sm-none { display: none; }
-  .tui-sm-block { display: block; }
-  .tui-sm-flex { display: flex; }
-  .tui-sm-inline { display: inline; }
-  .tui-sm-inline-block { display: inline-block; }
-
-  .tui-sm-icy { opacity: 0.85; }
-  .tui-sm-glassy { opacity: 0.5; }
-  .tui-sm-ghostly { opacity: 0.25; }
-  .tui-sm-transparent { opacity: 0; }
-  .tui-sm-hidden { visibility: hidden; }
-
-  /* Flex
-  ---------------------------------*/
-  .tui-sm-flex-row { flex-direction: row; }
-  .tui-sm-flex-col { flex-direction: column; }
-  .tui-sm-flex-grow { flex-grow: 1; }
-  .tui-sm-flex-wrap { flex-wrap: wrap; }
-  .tui-sm-flex-center { align-items: center; justify-content: center; }
-  .tui-sm-flex-x-center { align-items: center; }
-  .tui-sm-flex-y-center { justify-content: center; }
-
-  /* Sizes
-  ---------------------------------*/
-  .tui-sm-h-10 { height: 10px; }
-  .tui-sm-h-12 { height: 12px; }
-  .tui-sm-h-15 { height: 15px; }
-  .tui-sm-h-16 { height: 16px; }
-  .tui-sm-h-20 { height: 20px; }
-  .tui-sm-h-24 { height: 24px; }
-  .tui-sm-h-25 { height: 25px; }
-  .tui-sm-h-30 { height: 30px; }
-  .tui-sm-h-32 { height: 32px; }
-  .tui-sm-h-35 { height: 35px; }
-  .tui-sm-h-36 { height: 36px; }
-  .tui-sm-h-40 { height: 40px; }
-  .tui-sm-h-45 { height: 45px; }
-  .tui-sm-h-48 { height: 48px; }
-  .tui-sm-h-50 { height: 50px; }
-  .tui-sm-h-55 { height: 55px; }
-  .tui-sm-h-60 { height: 60px; }
-  .tui-sm-h-64 { height: 64px; }
-  .tui-sm-h-65 { height: 65px; }
-  .tui-sm-h-70 { height: 70px; }
-  .tui-sm-h-75 { height: 75px; }
-  .tui-sm-h-80 { height: 80px; }
-  .tui-sm-h-85 { height: 85px; }
-  .tui-sm-h-90 { height: 90px; }
-  .tui-sm-h-95 { height: 95px; }
-  .tui-sm-h-96 { height: 96px; }
-  .tui-sm-h-100 { height: 100px; }
-  .tui-sm-h-110 { height: 110px; }
-  .tui-sm-h-120 { height: 120px; }
-  .tui-sm-h-130 { height: 130px; }
-  .tui-sm-h-140 { height: 140px; }
-  .tui-sm-h-150 { height: 150px; }
-  .tui-sm-h-160 { height: 160px; }
-  .tui-sm-h-170 { height: 170px; }
-  .tui-sm-h-180 { height: 180px; }
-  .tui-sm-h-190 { height: 190px; }
-  .tui-sm-h-200 { height: 200px; }
-  .tui-sm-h-220 { height: 220px; }
-  .tui-sm-h-240 { height: 240px; }
-  .tui-sm-h-260 { height: 260px; }
-  .tui-sm-h-280 { height: 280px; }
-  .tui-sm-h-300 { height: 300px; }
-  .tui-sm-h-320 { height: 320px; }
-  .tui-sm-h-340 { height: 340px; }
-  .tui-sm-h-360 { height: 360px; }
-  .tui-sm-h-full { height: 100%; }
-
-  .tui-sm-w-10 { width: 10px; }
-  .tui-sm-w-12 { width: 12px; }
-  .tui-sm-w-15 { width: 15px; }
-  .tui-sm-w-16 { width: 16px; }
-  .tui-sm-w-20 { width: 20px; }
-  .tui-sm-w-24 { width: 24px; }
-  .tui-sm-w-25 { width: 25px; }
-  .tui-sm-w-30 { width: 30px; }
-  .tui-sm-w-32 { width: 32px; }
-  .tui-sm-w-35 { width: 35px; }
-  .tui-sm-w-36 { width: 36px; }
-  .tui-sm-w-40 { width: 40px; }
-  .tui-sm-w-45 { width: 45px; }
-  .tui-sm-w-48 { width: 48px; }
-  .tui-sm-w-50 { width: 50px; }
-  .tui-sm-w-55 { width: 55px; }
-  .tui-sm-w-60 { width: 60px; }
-  .tui-sm-w-64 { width: 64px; }
-  .tui-sm-w-65 { width: 65px; }
-  .tui-sm-w-70 { width: 70px; }
-  .tui-sm-w-75 { width: 75px; }
-  .tui-sm-w-80 { width: 80px; }
-  .tui-sm-w-85 { width: 85px; }
-  .tui-sm-w-90 { width: 90px; }
-  .tui-sm-w-95 { width: 95px; }
-  .tui-sm-w-96 { width: 96px; }
-  .tui-sm-w-100 { width: 100px; }
-  .tui-sm-w-110 { width: 110px; }
-  .tui-sm-w-120 { width: 120px; }
-  .tui-sm-w-130 { width: 130px; }
-  .tui-sm-w-140 { width: 140px; }
-  .tui-sm-w-150 { width: 150px; }
-  .tui-sm-w-160 { width: 160px; }
-  .tui-sm-w-170 { width: 170px; }
-  .tui-sm-w-180 { width: 180px; }
-  .tui-sm-w-190 { width: 190px; }
-  .tui-sm-w-200 { width: 200px; }
-  .tui-sm-w-220 { width: 220px; }
-  .tui-sm-w-240 { width: 240px; }
-  .tui-sm-w-260 { width: 260px; }
-  .tui-sm-w-280 { width: 280px; }
-  .tui-sm-w-300 { width: 300px; }
-  .tui-sm-w-320 { width: 320px; }
-  .tui-sm-w-340 { width: 340px; }
-  .tui-sm-w-360 { width: 360px; }
-  .tui-sm-w-full { width: 100%; }
-
-  .tui-sm-mw-xs { max-width: 360px; }
-  .tui-sm-mw-xs { max-width: 420px; }
-  .tui-sm-mw-md { max-width: 767px; }
-  .tui-sm-mw-lg { max-width: 992px; }
-  .tui-sm-mw-xl { max-width: 1024px; }
-  .tui-sm-mw-full { max-width: 100%; }
-
-  /* Text
-  ---------------------------------*/
-  .tui-sm-tx-2xs { font-size: 8px; }
-  .tui-sm-tx-xs { font-size: 10px; }
-  .tui-sm-tx-sm { font-size: 12px; }
-  .tui-sm-tx-md { font-size: 14px; }
-  .tui-sm-tx-lg { font-size: 16px; }
-  .tui-sm-tx-xl { font-size: 18px; }
-  .tui-sm-tx-2xl { font-size: 20px; }
-  .tui-sm-tx-3xl { font-size: 22px; }
-  .tui-sm-tx-4xl { font-size: 24px; }
-  .tui-sm-tx-5xl { font-size: 26px; }
-  .tui-sm-tx-6xl { font-size: 28px; }
-  .tui-sm-tx-7xl { font-size: 30px; }
-
-  .tui-sm-tx-center { text-align: center; }
-  .tui-sm-tx-left { text-align: left; }
-  .tui-sm-tx-right { text-align: right; }
-
-  .tui-sm-tx-bold { font-weight: bold; }
-  .tui-sm-tx-normal { font-weight: normal; }
-  .tui-sm-tx-italic { font-style: italic; }
-  .tui-sm-tx-uppercase { text-transform: uppercase; }
-  .tui-sm-tx-underline { text-decoration: underline; }
-  .tui-sm-tx-nowrap { white-space: nowrap; }
-
-  /* Borders
-  ---------------------------------*/
-  .tui-sm-bd-solid { border-style: solid; }
-  .tui-sm-bd-dash { border-style: dashed; }
-  .tui-sm-bd-dotted { border-style: dotted; }
-
-  .tui-sm-bd { border: 1px solid var(--black); }
-  .tui-sm-bdt { border-top: 1px solid var(--black); }
-  .tui-sm-bdb { border-bottom: 1px solid var(--black); }
-  .tui-sm-bdl { border-left: 1px solid var(--black); }
-  .tui-sm-bdr { border-right: 1px solid var(--black); }
-
-  .tui-sm-bd-xs { border-width: 1px; }
-  .tui-sm-bd-sm { border-width: 2px; }
-  .tui-sm-bd-md { border-width: 3px; }
-  .tui-sm-bd-lg { border-width: 4px; }
-  .tui-sm-bd-xl { border-width: 5px; }
-
-  .tui-sm-bdt-xs { border-top-width: 1px; }
-  .tui-sm-bdt-sm { border-top-width: 2px; }
-  .tui-sm-bdt-md { border-top-width: 3px; }
-  .tui-sm-bdt-lg { border-top-width: 4px; }
-  .tui-sm-bdt-xl { border-top-width: 5px; }
-
-  .tui-sm-bdb-xs { border-bottom-width: 1px; }
-  .tui-sm-bdb-sm { border-bottom-width: 2px; }
-  .tui-sm-bdb-md { border-bottom-width: 3px; }
-  .tui-sm-bdb-lg { border-bottom-width: 4px; }
-  .tui-sm-bdb-xl { border-bottom-width: 5px; }
-
-  .tui-sm-bdl-xs { border-left-width: 1px; }
-  .tui-sm-bdl-sm { border-left-width: 2px; }
-  .tui-sm-bdl-md { border-left-width: 3px; }
-  .tui-sm-bdl-lg { border-left-width: 4px; }
-  .tui-sm-bdl-xl { border-left-width: 5px; }
-
-  .tui-sm-bdr-xs { border-right-width: 1px; }
-  .tui-sm-bdr-sm { border-right-width: 2px; }
-  .tui-sm-bdr-md { border-right-width: 3px; }
-  .tui-sm-bdr-lg { border-right-width: 4px; }
-  .tui-sm-bdr-xl { border-right-width: 5px; }
-
-  .tui-sm-bd-rad-xs { border-radius: 2px; }
-  .tui-sm-bd-rad-sm, .tui-bd-curved { border-radius: 4px; }
-  .tui-sm-bd-rad-md { border-radius: 6px; }
-  .tui-sm-bd-rad-lg { border-radius: 8px; }
-  .tui-sm-bd-rad-xl, .tui-bd-rounded { border-radius: 12px; }
-  .tui-sm-bd-rad-full, .tui-bd-pill { border-radius: 10000px; }
-
-  .tui-sm-bdl-rad-xs { border-radius: 2px 0 0 2px; }
-  .tui-sm-bdl-rad-sm, .tui-bdl-curved { border-radius: 4px 0 0 4px; }
-  .tui-sm-bdl-rad-md { border-radius: 6px 0 0 6px; }
-  .tui-sm-bdl-rad-lg { border-radius: 8px 0 0 8px; }
-  .tui-sm-bdl-rad-xl, .tui-bdl-rounded { border-radius: 12px 0 0 12px; }
-  .tui-sm-bdl-rad-full, .tui-bdl-pill { border-radius: 10000px 0 0 10000px; }
-
-  .tui-sm-bdr-rad-xs { border-radius: 0 2px 2px 0; }
-  .tui-sm-bdr-rad-sm, .tui-bdr-curved { border-radius: 0 4px 4px 0; }
-  .tui-sm-bdr-rad-md { border-radius: 0 6px 6px 0; }
-  .tui-sm-bdr-rad-lg { border-radius: 0 8px 8px 0; }
-  .tui-sm-bdr-rad-xl, .tui-bdr-rounded { border-radius: 0 12px 12px 0; }
-  .tui-sm-bdr-rad-full, .tui-bdr-pill { border-radius: 0 10000px 10000px 0; }
-
-  .tui-sm-bdt-rad-xs { border-radius: 2px 2px 0 0; }
-  .tui-sm-bdt-rad-sm, .tui-bdt-curved { border-radius: 4px 4px 0 0; }
-  .tui-sm-bdt-rad-md { border-radius: 6px 6px 0 0; }
-  .tui-sm-bdt-rad-lg { border-radius: 8px 8px 0 0; }
-  .tui-sm-bdt-rad-xl, .tui-bdt-rounded { border-radius: 12px 12px 0 0; }
-  .tui-sm-bdt-rad-full, .tui-bdt-pill { border-radius: 10000px 10000px 0 0; }
-
-  .tui-sm-bdb-rad-xs { border-radius: 2px 2px 0 0; }
-  .tui-sm-bdb-rad-sm, .tui-bdb-curved { border-radius: 0 0 4px 4px; }
-  .tui-sm-bdb-rad-md { border-radius: 0 0 6px 6px; }
-  .tui-sm-bdb-rad-lg { border-radius: 0 0 8px 8px; }
-  .tui-sm-bdb-rad-xl, .tui-bdb-rounded { border-radius: 0 0 12px 12px; }
-  .tui-sm-bdb-rad-full, .tui-bdb-pill { border-radius: 0 0 10000px 10000px; }
-
-  /* Padding
-  ---------------------------------*/
-  .tui-sm-p-0 { padding: 0; }
-  .tui-sm-p-2 { padding: 2px; }
-  .tui-sm-p-4 { padding: 4px; }
-  .tui-sm-p-6 { padding: 6px; }
-  .tui-sm-p-8 { padding: 8px; }
-  .tui-sm-p-10 { padding: 10px; }
-  .tui-sm-p-12 { padding: 12px; }
-  .tui-sm-p-14 { padding: 14px; }
-  .tui-sm-p-16 { padding: 16px; }
-  .tui-sm-p-18 { padding: 18px; }
-  .tui-sm-p-20 { padding: 20px; }
-  .tui-sm-p-22 { padding: 22px; }
-  .tui-sm-p-24 { padding: 24px; }
-  .tui-sm-p-26 { padding: 26px; }
-  .tui-sm-p-28 { padding: 28px; }
-  .tui-sm-p-30 { padding: 30px; }
-  .tui-sm-p-32 { padding: 32px; }
-  .tui-sm-p-34 { padding: 34px; }
-  .tui-sm-p-36 { padding: 36px; }
-  .tui-sm-p-38 { padding: 38px; }
-  .tui-sm-p-40 { padding: 40px; }
-
-  .tui-sm-pl-0 { padding-left: 0; }
-  .tui-sm-pl-2 { padding-left: 2px; }
-  .tui-sm-pl-4 { padding-left: 4px; }
-  .tui-sm-pl-6 { padding-left: 6px; }
-  .tui-sm-pl-8 { padding-left: 8px; }
-  .tui-sm-pl-10 { padding-left: 10px; }
-  .tui-sm-pl-12 { padding-left: 12px; }
-  .tui-sm-pl-14 { padding-left: 14px; }
-  .tui-sm-pl-16 { padding-left: 16px; }
-  .tui-sm-pl-18 { padding-left: 18px; }
-  .tui-sm-pl-20 { padding-left: 20px; }
-  .tui-sm-pl-22 { padding-left: 22px; }
-  .tui-sm-pl-24 { padding-left: 24px; }
-  .tui-sm-pl-26 { padding-left: 26px; }
-  .tui-sm-pl-28 { padding-left: 28px; }
-  .tui-sm-pl-30 { padding-left: 30px; }
-  .tui-sm-pl-32 { padding-left: 32px; }
-  .tui-sm-pl-34 { padding-left: 34px; }
-  .tui-sm-pl-36 { padding-left: 36px; }
-  .tui-sm-pl-38 { padding-left: 38px; }
-  .tui-sm-pl-40 { padding-left: 40px; }
-
-  .tui-sm-pr-0 { padding-right: 0; }
-  .tui-sm-pr-2 { padding-right: 2px; }
-  .tui-sm-pr-4 { padding-right: 4px; }
-  .tui-sm-pr-6 { padding-right: 6px; }
-  .tui-sm-pr-8 { padding-right: 8px; }
-  .tui-sm-pr-10 { padding-right: 10px; }
-  .tui-sm-pr-12 { padding-right: 12px; }
-  .tui-sm-pr-14 { padding-right: 14px; }
-  .tui-sm-pr-16 { padding-right: 16px; }
-  .tui-sm-pr-18 { padding-right: 18px; }
-  .tui-sm-pr-20 { padding-right: 20px; }
-  .tui-sm-pr-22 { padding-right: 22px; }
-  .tui-sm-pr-24 { padding-right: 24px; }
-  .tui-sm-pr-26 { padding-right: 26px; }
-  .tui-sm-pr-28 { padding-right: 28px; }
-  .tui-sm-pr-30 { padding-right: 30px; }
-  .tui-sm-pr-32 { padding-right: 32px; }
-  .tui-sm-pr-34 { padding-right: 34px; }
-  .tui-sm-pr-36 { padding-right: 36px; }
-  .tui-sm-pr-38 { padding-right: 38px; }
-  .tui-sm-pr-40 { padding-right: 40px; }
-
-  .tui-sm-pt-0 { padding-top: 0; }
-  .tui-sm-pt-2 { padding-top: 2px; }
-  .tui-sm-pt-4 { padding-top: 4px; }
-  .tui-sm-pt-6 { padding-top: 6px; }
-  .tui-sm-pt-8 { padding-top: 8px; }
-  .tui-sm-pt-10 { padding-top: 10px; }
-  .tui-sm-pt-12 { padding-top: 12px; }
-  .tui-sm-pt-14 { padding-top: 14px; }
-  .tui-sm-pt-16 { padding-top: 16px; }
-  .tui-sm-pt-18 { padding-top: 18px; }
-  .tui-sm-pt-20 { padding-top: 20px; }
-  .tui-sm-pt-22 { padding-top: 22px; }
-  .tui-sm-pt-24 { padding-top: 24px; }
-  .tui-sm-pt-26 { padding-top: 26px; }
-  .tui-sm-pt-28 { padding-top: 28px; }
-  .tui-sm-pt-30 { padding-top: 30px; }
-  .tui-sm-pt-32 { padding-top: 32px; }
-  .tui-sm-pt-34 { padding-top: 34px; }
-  .tui-sm-pt-36 { padding-top: 36px; }
-  .tui-sm-pt-38 { padding-top: 38px; }
-  .tui-sm-pt-40 { padding-top: 40px; }
-
-  .tui-sm-pb-0 { padding-bottom: 0; }
-  .tui-sm-pb-2 { padding-bottom: 2px; }
-  .tui-sm-pb-4 { padding-bottom: 4px; }
-  .tui-sm-pb-6 { padding-bottom: 6px; }
-  .tui-sm-pb-8 { padding-bottom: 8px; }
-  .tui-sm-pb-10 { padding-bottom: 10px; }
-  .tui-sm-pb-12 { padding-bottom: 12px; }
-  .tui-sm-pb-14 { padding-bottom: 14px; }
-  .tui-sm-pb-16 { padding-bottom: 16px; }
-  .tui-sm-pb-18 { padding-bottom: 18px; }
-  .tui-sm-pb-20 { padding-bottom: 20px; }
-  .tui-sm-pb-22 { padding-bottom: 22px; }
-  .tui-sm-pb-24 { padding-bottom: 24px; }
-  .tui-sm-pb-26 { padding-bottom: 26px; }
-  .tui-sm-pb-28 { padding-bottom: 28px; }
-  .tui-sm-pb-30 { padding-bottom: 30px; }
-  .tui-sm-pb-32 { padding-bottom: 32px; }
-  .tui-sm-pb-34 { padding-bottom: 34px; }
-  .tui-sm-pb-36 { padding-bottom: 36px; }
-  .tui-sm-pb-38 { padding-bottom: 38px; }
-  .tui-sm-pb-40 { padding-bottom: 40px; }
-
-  /* Margin
-  ---------------------------------*/
-  .tui-sm-m-0 { margin: 0; }
-  .tui-sm-m-2 { margin: 2px; }
-  .tui-sm-m-4 { margin: 4px; }
-  .tui-sm-m-6 { margin: 6px; }
-  .tui-sm-m-8 { margin: 8px; }
-  .tui-sm-m-10 { margin: 10px; }
-  .tui-sm-m-12 { margin: 12px; }
-  .tui-sm-m-14 { margin: 14px; }
-  .tui-sm-m-16 { margin: 16px; }
-  .tui-sm-m-18 { margin: 18px; }
-  .tui-sm-m-20 { margin: 20px; }
-  .tui-sm-m-22 { margin: 22px; }
-  .tui-sm-m-24 { margin: 24px; }
-  .tui-sm-m-26 { margin: 26px; }
-  .tui-sm-m-28 { margin: 28px; }
-  .tui-sm-m-30 { margin: 30px; }
-  .tui-sm-m-32 { margin: 32px; }
-  .tui-sm-m-34 { margin: 34px; }
-  .tui-sm-m-36 { margin: 36px; }
-  .tui-sm-m-38 { margin: 38px; }
-  .tui-sm-m-40 { margin: 40px; }
-
-  .tui-sm-ml-0 { margin-left: 0; }
-  .tui-sm-ml-2 { margin-left: 2px; }
-  .tui-sm-ml-4 { margin-left: 4px; }
-  .tui-sm-ml-6 { margin-left: 6px; }
-  .tui-sm-ml-8 { margin-left: 8px; }
-  .tui-sm-ml-10 { margin-left: 10px; }
-  .tui-sm-ml-12 { margin-left: 12px; }
-  .tui-sm-ml-14 { margin-left: 14px; }
-  .tui-sm-ml-16 { margin-left: 16px; }
-  .tui-sm-ml-18 { margin-left: 18px; }
-  .tui-sm-ml-20 { margin-left: 20px; }
-  .tui-sm-ml-22 { margin-left: 22px; }
-  .tui-sm-ml-24 { margin-left: 24px; }
-  .tui-sm-ml-26 { margin-left: 26px; }
-  .tui-sm-ml-28 { margin-left: 28px; }
-  .tui-sm-ml-30 { margin-left: 30px; }
-  .tui-sm-ml-32 { margin-left: 32px; }
-  .tui-sm-ml-34 { margin-left: 34px; }
-  .tui-sm-ml-36 { margin-left: 36px; }
-  .tui-sm-ml-38 { margin-left: 38px; }
-  .tui-sm-ml-40 { margin-left: 40px; }
-
-  .tui-sm-mr-0 { margin-right: 0; }
-  .tui-sm-mr-2 { margin-right: 2px; }
-  .tui-sm-mr-4 { margin-right: 4px; }
-  .tui-sm-mr-6 { margin-right: 6px; }
-  .tui-sm-mr-8 { margin-right: 8px; }
-  .tui-sm-mr-10 { margin-right: 10px; }
-  .tui-sm-mr-12 { margin-right: 12px; }
-  .tui-sm-mr-14 { margin-right: 14px; }
-  .tui-sm-mr-16 { margin-right: 16px; }
-  .tui-sm-mr-18 { margin-right: 18px; }
-  .tui-sm-mr-20 { margin-right: 20px; }
-  .tui-sm-mr-22 { margin-right: 22px; }
-  .tui-sm-mr-24 { margin-right: 24px; }
-  .tui-sm-mr-26 { margin-right: 26px; }
-  .tui-sm-mr-28 { margin-right: 28px; }
-  .tui-sm-mr-30 { margin-right: 30px; }
-  .tui-sm-mr-32 { margin-right: 32px; }
-  .tui-sm-mr-34 { margin-right: 34px; }
-  .tui-sm-mr-36 { margin-right: 36px; }
-  .tui-sm-mr-38 { margin-right: 38px; }
-  .tui-sm-mr-40 { margin-right: 40px; }
-
-  .tui-sm-mt-0 { margin-top: 0; }
-  .tui-sm-mt-2 { margin-top: 2px; }
-  .tui-sm-mt-4 { margin-top: 4px; }
-  .tui-sm-mt-6 { margin-top: 6px; }
-  .tui-sm-mt-8 { margin-top: 8px; }
-  .tui-sm-mt-10 { margin-top: 10px; }
-  .tui-sm-mt-12 { margin-top: 12px; }
-  .tui-sm-mt-14 { margin-top: 14px; }
-  .tui-sm-mt-16 { margin-top: 16px; }
-  .tui-sm-mt-18 { margin-top: 18px; }
-  .tui-sm-mt-20 { margin-top: 20px; }
-  .tui-sm-mt-22 { margin-top: 22px; }
-  .tui-sm-mt-24 { margin-top: 24px; }
-  .tui-sm-mt-26 { margin-top: 26px; }
-  .tui-sm-mt-28 { margin-top: 28px; }
-  .tui-sm-mt-30 { margin-top: 30px; }
-  .tui-sm-mt-32 { margin-top: 32px; }
-  .tui-sm-mt-34 { margin-top: 34px; }
-  .tui-sm-mt-36 { margin-top: 36px; }
-  .tui-sm-mt-38 { margin-top: 38px; }
-  .tui-sm-mt-40 { margin-top: 40px; }
-
-  .tui-sm-mb-0 { margin-bottom: 0; }
-  .tui-sm-mb-2 { margin-bottom: 2px; }
-  .tui-sm-mb-4 { margin-bottom: 4px; }
-  .tui-sm-mb-6 { margin-bottom: 6px; }
-  .tui-sm-mb-8 { margin-bottom: 8px; }
-  .tui-sm-mb-10 { margin-bottom: 10px; }
-  .tui-sm-mb-12 { margin-bottom: 12px; }
-  .tui-sm-mb-14 { margin-bottom: 14px; }
-  .tui-sm-mb-16 { margin-bottom: 16px; }
-  .tui-sm-mb-18 { margin-bottom: 18px; }
-  .tui-sm-mb-20 { margin-bottom: 20px; }
-  .tui-sm-mb-22 { margin-bottom: 22px; }
-  .tui-sm-mb-24 { margin-bottom: 24px; }
-  .tui-sm-mb-26 { margin-bottom: 26px; }
-  .tui-sm-mb-28 { margin-bottom: 28px; }
-  .tui-sm-mb-30 { margin-bottom: 30px; }
-  .tui-sm-mb-32 { margin-bottom: 32px; }
-  .tui-sm-mb-34 { margin-bottom: 34px; }
-  .tui-sm-mb-36 { margin-bottom: 36px; }
-  .tui-sm-mb-38 { margin-bottom: 38px; }
-  .tui-sm-mb-40 { margin-bottom: 40px; }
-}
-
-@media (max-width: 360px) {
-  /* Displays
-  ---------------------------------*/
-  .tui-xs-none { display: none; }
-  .tui-xs-block { display: block; }
-  .tui-xs-flex { display: flex; }
-  .tui-xs-inline { display: inline; }
-  .tui-xs-inline-block { display: inline-block; }
-
-  .tui-xs-icy { opacity: 0.85; }
-  .tui-xs-glassy { opacity: 0.5; }
-  .tui-xs-ghostly { opacity: 0.25; }
-  .tui-xs-transparent { opacity: 0; }
-  .tui-xs-hidden { visibility: hidden; }
-
-  /* Flex
-  ---------------------------------*/
-  .tui-xs-flex-row { flex-direction: row; }
-  .tui-xs-flex-col { flex-direction: column; }
-  .tui-xs-flex-grow { flex-grow: 1; }
-  .tui-xs-flex-wrap { flex-wrap: wrap; }
-  .tui-xs-flex-center { align-items: center; justify-content: center; }
-  .tui-xs-flex-x-center { align-items: center; }
-  .tui-xs-flex-y-center { justify-content: center; }
-
-  /* Sizes
-  ---------------------------------*/
-  .tui-xs-h-10 { height: 10px; }
-  .tui-xs-h-12 { height: 12px; }
-  .tui-xs-h-15 { height: 15px; }
-  .tui-xs-h-16 { height: 16px; }
-  .tui-xs-h-20 { height: 20px; }
-  .tui-xs-h-24 { height: 24px; }
-  .tui-xs-h-25 { height: 25px; }
-  .tui-xs-h-30 { height: 30px; }
-  .tui-xs-h-32 { height: 32px; }
-  .tui-xs-h-35 { height: 35px; }
-  .tui-xs-h-36 { height: 36px; }
-  .tui-xs-h-40 { height: 40px; }
-  .tui-xs-h-45 { height: 45px; }
-  .tui-xs-h-48 { height: 48px; }
-  .tui-xs-h-50 { height: 50px; }
-  .tui-xs-h-55 { height: 55px; }
-  .tui-xs-h-60 { height: 60px; }
-  .tui-xs-h-64 { height: 64px; }
-  .tui-xs-h-65 { height: 65px; }
-  .tui-xs-h-70 { height: 70px; }
-  .tui-xs-h-75 { height: 75px; }
-  .tui-xs-h-80 { height: 80px; }
-  .tui-xs-h-85 { height: 85px; }
-  .tui-xs-h-90 { height: 90px; }
-  .tui-xs-h-95 { height: 95px; }
-  .tui-xs-h-96 { height: 96px; }
-  .tui-xs-h-100 { height: 100px; }
-  .tui-xs-h-110 { height: 110px; }
-  .tui-xs-h-120 { height: 120px; }
-  .tui-xs-h-130 { height: 130px; }
-  .tui-xs-h-140 { height: 140px; }
-  .tui-xs-h-150 { height: 150px; }
-  .tui-xs-h-160 { height: 160px; }
-  .tui-xs-h-170 { height: 170px; }
-  .tui-xs-h-180 { height: 180px; }
-  .tui-xs-h-190 { height: 190px; }
-  .tui-xs-h-200 { height: 200px; }
-  .tui-xs-h-220 { height: 220px; }
-  .tui-xs-h-240 { height: 240px; }
-  .tui-xs-h-260 { height: 260px; }
-  .tui-xs-h-280 { height: 280px; }
-  .tui-xs-h-300 { height: 300px; }
-  .tui-xs-h-320 { height: 320px; }
-  .tui-xs-h-340 { height: 340px; }
-  .tui-xs-h-360 { height: 360px; }
-  .tui-xs-h-full { height: 100%; }
-
-  .tui-xs-w-10 { width: 10px; }
-  .tui-xs-w-12 { width: 12px; }
-  .tui-xs-w-15 { width: 15px; }
-  .tui-xs-w-16 { width: 16px; }
-  .tui-xs-w-20 { width: 20px; }
-  .tui-xs-w-24 { width: 24px; }
-  .tui-xs-w-25 { width: 25px; }
-  .tui-xs-w-30 { width: 30px; }
-  .tui-xs-w-32 { width: 32px; }
-  .tui-xs-w-35 { width: 35px; }
-  .tui-xs-w-36 { width: 36px; }
-  .tui-xs-w-40 { width: 40px; }
-  .tui-xs-w-45 { width: 45px; }
-  .tui-xs-w-48 { width: 48px; }
-  .tui-xs-w-50 { width: 50px; }
-  .tui-xs-w-55 { width: 55px; }
-  .tui-xs-w-60 { width: 60px; }
-  .tui-xs-w-64 { width: 64px; }
-  .tui-xs-w-65 { width: 65px; }
-  .tui-xs-w-70 { width: 70px; }
-  .tui-xs-w-75 { width: 75px; }
-  .tui-xs-w-80 { width: 80px; }
-  .tui-xs-w-85 { width: 85px; }
-  .tui-xs-w-90 { width: 90px; }
-  .tui-xs-w-95 { width: 95px; }
-  .tui-xs-w-96 { width: 96px; }
-  .tui-xs-w-100 { width: 100px; }
-  .tui-xs-w-110 { width: 110px; }
-  .tui-xs-w-120 { width: 120px; }
-  .tui-xs-w-130 { width: 130px; }
-  .tui-xs-w-140 { width: 140px; }
-  .tui-xs-w-150 { width: 150px; }
-  .tui-xs-w-160 { width: 160px; }
-  .tui-xs-w-170 { width: 170px; }
-  .tui-xs-w-180 { width: 180px; }
-  .tui-xs-w-190 { width: 190px; }
-  .tui-xs-w-200 { width: 200px; }
-  .tui-xs-w-220 { width: 220px; }
-  .tui-xs-w-240 { width: 240px; }
-  .tui-xs-w-260 { width: 260px; }
-  .tui-xs-w-280 { width: 280px; }
-  .tui-xs-w-300 { width: 300px; }
-  .tui-xs-w-320 { width: 320px; }
-  .tui-xs-w-340 { width: 340px; }
-  .tui-xs-w-360 { width: 360px; }
-  .tui-xs-w-full { width: 100%; }
-
-  .tui-xs-mw-xs { max-width: 360px; }
-  .tui-xs-mw-xs { max-width: 420px; }
-  .tui-xs-mw-md { max-width: 767px; }
-  .tui-xs-mw-lg { max-width: 992px; }
-  .tui-xs-mw-xl { max-width: 1024px; }
-  .tui-xs-mw-full { max-width: 100%; }
-
-  /* Text
-  ---------------------------------*/
-  .tui-xs-tx-2xs { font-size: 8px; }
-  .tui-xs-tx-xs { font-size: 10px; }
-  .tui-xs-tx-sm { font-size: 12px; }
-  .tui-xs-tx-md { font-size: 14px; }
-  .tui-xs-tx-lg { font-size: 16px; }
-  .tui-xs-tx-xl { font-size: 18px; }
-  .tui-xs-tx-2xl { font-size: 20px; }
-  .tui-xs-tx-3xl { font-size: 22px; }
-  .tui-xs-tx-4xl { font-size: 24px; }
-  .tui-xs-tx-5xl { font-size: 26px; }
-  .tui-xs-tx-6xl { font-size: 28px; }
-  .tui-xs-tx-7xl { font-size: 30px; }
-
-  .tui-xs-tx-center { text-align: center; }
-  .tui-xs-tx-left { text-align: left; }
-  .tui-xs-tx-right { text-align: right; }
-
-  .tui-xs-tx-bold { font-weight: bold; }
-  .tui-xs-tx-normal { font-weight: normal; }
-  .tui-xs-tx-italic { font-style: italic; }
-  .tui-xs-tx-uppercase { text-transform: uppercase; }
-  .tui-xs-tx-underline { text-decoration: underline; }
-  .tui-xs-tx-nowrap { white-space: nowrap; }
-
-  /* Borders
-  ---------------------------------*/
-  .tui-xs-bd-solid { border-style: solid; }
-  .tui-xs-bd-dash { border-style: dashed; }
-  .tui-xs-bd-dotted { border-style: dotted; }
-
-  .tui-xs-bd { border: 1px solid var(--black); }
-  .tui-xs-bdt { border-top: 1px solid var(--black); }
-  .tui-xs-bdb { border-bottom: 1px solid var(--black); }
-  .tui-xs-bdl { border-left: 1px solid var(--black); }
-  .tui-xs-bdr { border-right: 1px solid var(--black); }
-
-  .tui-xs-bd-xs { border-width: 1px; }
-  .tui-xs-bd-sm { border-width: 2px; }
-  .tui-xs-bd-md { border-width: 3px; }
-  .tui-xs-bd-lg { border-width: 4px; }
-  .tui-xs-bd-xl { border-width: 5px; }
-
-  .tui-xs-bdt-xs { border-top-width: 1px; }
-  .tui-xs-bdt-sm { border-top-width: 2px; }
-  .tui-xs-bdt-md { border-top-width: 3px; }
-  .tui-xs-bdt-lg { border-top-width: 4px; }
-  .tui-xs-bdt-xl { border-top-width: 5px; }
-
-  .tui-xs-bdb-xs { border-bottom-width: 1px; }
-  .tui-xs-bdb-sm { border-bottom-width: 2px; }
-  .tui-xs-bdb-md { border-bottom-width: 3px; }
-  .tui-xs-bdb-lg { border-bottom-width: 4px; }
-  .tui-xs-bdb-xl { border-bottom-width: 5px; }
-
-  .tui-xs-bdl-xs { border-left-width: 1px; }
-  .tui-xs-bdl-sm { border-left-width: 2px; }
-  .tui-xs-bdl-md { border-left-width: 3px; }
-  .tui-xs-bdl-lg { border-left-width: 4px; }
-  .tui-xs-bdl-xl { border-left-width: 5px; }
-
-  .tui-xs-bdr-xs { border-right-width: 1px; }
-  .tui-xs-bdr-sm { border-right-width: 2px; }
-  .tui-xs-bdr-md { border-right-width: 3px; }
-  .tui-xs-bdr-lg { border-right-width: 4px; }
-  .tui-xs-bdr-xl { border-right-width: 5px; }
-
-  .tui-xs-bd-rad-xs { border-radius: 2px; }
-  .tui-xs-bd-rad-sm, .tui-bd-curved { border-radius: 4px; }
-  .tui-xs-bd-rad-md { border-radius: 6px; }
-  .tui-xs-bd-rad-lg { border-radius: 8px; }
-  .tui-xs-bd-rad-xl, .tui-bd-rounded { border-radius: 12px; }
-  .tui-xs-bd-rad-full, .tui-bd-pill { border-radius: 10000px; }
-
-  .tui-xs-bdl-rad-xs { border-radius: 2px 0 0 2px; }
-  .tui-xs-bdl-rad-sm, .tui-bdl-curved { border-radius: 4px 0 0 4px; }
-  .tui-xs-bdl-rad-md { border-radius: 6px 0 0 6px; }
-  .tui-xs-bdl-rad-lg { border-radius: 8px 0 0 8px; }
-  .tui-xs-bdl-rad-xl, .tui-bdl-rounded { border-radius: 12px 0 0 12px; }
-  .tui-xs-bdl-rad-full, .tui-bdl-pill { border-radius: 10000px 0 0 10000px; }
-
-  .tui-xs-bdr-rad-xs { border-radius: 0 2px 2px 0; }
-  .tui-xs-bdr-rad-sm, .tui-bdr-curved { border-radius: 0 4px 4px 0; }
-  .tui-xs-bdr-rad-md { border-radius: 0 6px 6px 0; }
-  .tui-xs-bdr-rad-lg { border-radius: 0 8px 8px 0; }
-  .tui-xs-bdr-rad-xl, .tui-bdr-rounded { border-radius: 0 12px 12px 0; }
-  .tui-xs-bdr-rad-full, .tui-bdr-pill { border-radius: 0 10000px 10000px 0; }
-
-  .tui-xs-bdt-rad-xs { border-radius: 2px 2px 0 0; }
-  .tui-xs-bdt-rad-sm, .tui-bdt-curved { border-radius: 4px 4px 0 0; }
-  .tui-xs-bdt-rad-md { border-radius: 6px 6px 0 0; }
-  .tui-xs-bdt-rad-lg { border-radius: 8px 8px 0 0; }
-  .tui-xs-bdt-rad-xl, .tui-bdt-rounded { border-radius: 12px 12px 0 0; }
-  .tui-xs-bdt-rad-full, .tui-bdt-pill { border-radius: 10000px 10000px 0 0; }
-
-  .tui-xs-bdb-rad-xs { border-radius: 2px 2px 0 0; }
-  .tui-xs-bdb-rad-sm, .tui-bdb-curved { border-radius: 0 0 4px 4px; }
-  .tui-xs-bdb-rad-md { border-radius: 0 0 6px 6px; }
-  .tui-xs-bdb-rad-lg { border-radius: 0 0 8px 8px; }
-  .tui-xs-bdb-rad-xl, .tui-bdb-rounded { border-radius: 0 0 12px 12px; }
-  .tui-xs-bdb-rad-full, .tui-bdb-pill { border-radius: 0 0 10000px 10000px; }
-
-  /* Padding
-  ---------------------------------*/
-  .tui-xs-p-0 { padding: 0; }
-  .tui-xs-p-2 { padding: 2px; }
-  .tui-xs-p-4 { padding: 4px; }
-  .tui-xs-p-6 { padding: 6px; }
-  .tui-xs-p-8 { padding: 8px; }
-  .tui-xs-p-10 { padding: 10px; }
-  .tui-xs-p-12 { padding: 12px; }
-  .tui-xs-p-14 { padding: 14px; }
-  .tui-xs-p-16 { padding: 16px; }
-  .tui-xs-p-18 { padding: 18px; }
-  .tui-xs-p-20 { padding: 20px; }
-  .tui-xs-p-22 { padding: 22px; }
-  .tui-xs-p-24 { padding: 24px; }
-  .tui-xs-p-26 { padding: 26px; }
-  .tui-xs-p-28 { padding: 28px; }
-  .tui-xs-p-30 { padding: 30px; }
-  .tui-xs-p-32 { padding: 32px; }
-  .tui-xs-p-34 { padding: 34px; }
-  .tui-xs-p-36 { padding: 36px; }
-  .tui-xs-p-38 { padding: 38px; }
-  .tui-xs-p-40 { padding: 40px; }
-
-  .tui-xs-pl-0 { padding-left: 0; }
-  .tui-xs-pl-2 { padding-left: 2px; }
-  .tui-xs-pl-4 { padding-left: 4px; }
-  .tui-xs-pl-6 { padding-left: 6px; }
-  .tui-xs-pl-8 { padding-left: 8px; }
-  .tui-xs-pl-10 { padding-left: 10px; }
-  .tui-xs-pl-12 { padding-left: 12px; }
-  .tui-xs-pl-14 { padding-left: 14px; }
-  .tui-xs-pl-16 { padding-left: 16px; }
-  .tui-xs-pl-18 { padding-left: 18px; }
-  .tui-xs-pl-20 { padding-left: 20px; }
-  .tui-xs-pl-22 { padding-left: 22px; }
-  .tui-xs-pl-24 { padding-left: 24px; }
-  .tui-xs-pl-26 { padding-left: 26px; }
-  .tui-xs-pl-28 { padding-left: 28px; }
-  .tui-xs-pl-30 { padding-left: 30px; }
-  .tui-xs-pl-32 { padding-left: 32px; }
-  .tui-xs-pl-34 { padding-left: 34px; }
-  .tui-xs-pl-36 { padding-left: 36px; }
-  .tui-xs-pl-38 { padding-left: 38px; }
-  .tui-xs-pl-40 { padding-left: 40px; }
-
-  .tui-xs-pr-0 { padding-right: 0; }
-  .tui-xs-pr-2 { padding-right: 2px; }
-  .tui-xs-pr-4 { padding-right: 4px; }
-  .tui-xs-pr-6 { padding-right: 6px; }
-  .tui-xs-pr-8 { padding-right: 8px; }
-  .tui-xs-pr-10 { padding-right: 10px; }
-  .tui-xs-pr-12 { padding-right: 12px; }
-  .tui-xs-pr-14 { padding-right: 14px; }
-  .tui-xs-pr-16 { padding-right: 16px; }
-  .tui-xs-pr-18 { padding-right: 18px; }
-  .tui-xs-pr-20 { padding-right: 20px; }
-  .tui-xs-pr-22 { padding-right: 22px; }
-  .tui-xs-pr-24 { padding-right: 24px; }
-  .tui-xs-pr-26 { padding-right: 26px; }
-  .tui-xs-pr-28 { padding-right: 28px; }
-  .tui-xs-pr-30 { padding-right: 30px; }
-  .tui-xs-pr-32 { padding-right: 32px; }
-  .tui-xs-pr-34 { padding-right: 34px; }
-  .tui-xs-pr-36 { padding-right: 36px; }
-  .tui-xs-pr-38 { padding-right: 38px; }
-  .tui-xs-pr-40 { padding-right: 40px; }
-
-  .tui-xs-pt-0 { padding-top: 0; }
-  .tui-xs-pt-2 { padding-top: 2px; }
-  .tui-xs-pt-4 { padding-top: 4px; }
-  .tui-xs-pt-6 { padding-top: 6px; }
-  .tui-xs-pt-8 { padding-top: 8px; }
-  .tui-xs-pt-10 { padding-top: 10px; }
-  .tui-xs-pt-12 { padding-top: 12px; }
-  .tui-xs-pt-14 { padding-top: 14px; }
-  .tui-xs-pt-16 { padding-top: 16px; }
-  .tui-xs-pt-18 { padding-top: 18px; }
-  .tui-xs-pt-20 { padding-top: 20px; }
-  .tui-xs-pt-22 { padding-top: 22px; }
-  .tui-xs-pt-24 { padding-top: 24px; }
-  .tui-xs-pt-26 { padding-top: 26px; }
-  .tui-xs-pt-28 { padding-top: 28px; }
-  .tui-xs-pt-30 { padding-top: 30px; }
-  .tui-xs-pt-32 { padding-top: 32px; }
-  .tui-xs-pt-34 { padding-top: 34px; }
-  .tui-xs-pt-36 { padding-top: 36px; }
-  .tui-xs-pt-38 { padding-top: 38px; }
-  .tui-xs-pt-40 { padding-top: 40px; }
-
-  .tui-xs-pb-0 { padding-bottom: 0; }
-  .tui-xs-pb-2 { padding-bottom: 2px; }
-  .tui-xs-pb-4 { padding-bottom: 4px; }
-  .tui-xs-pb-6 { padding-bottom: 6px; }
-  .tui-xs-pb-8 { padding-bottom: 8px; }
-  .tui-xs-pb-10 { padding-bottom: 10px; }
-  .tui-xs-pb-12 { padding-bottom: 12px; }
-  .tui-xs-pb-14 { padding-bottom: 14px; }
-  .tui-xs-pb-16 { padding-bottom: 16px; }
-  .tui-xs-pb-18 { padding-bottom: 18px; }
-  .tui-xs-pb-20 { padding-bottom: 20px; }
-  .tui-xs-pb-22 { padding-bottom: 22px; }
-  .tui-xs-pb-24 { padding-bottom: 24px; }
-  .tui-xs-pb-26 { padding-bottom: 26px; }
-  .tui-xs-pb-28 { padding-bottom: 28px; }
-  .tui-xs-pb-30 { padding-bottom: 30px; }
-  .tui-xs-pb-32 { padding-bottom: 32px; }
-  .tui-xs-pb-34 { padding-bottom: 34px; }
-  .tui-xs-pb-36 { padding-bottom: 36px; }
-  .tui-xs-pb-38 { padding-bottom: 38px; }
-  .tui-xs-pb-40 { padding-bottom: 40px; }
-
-  /* Margin
-  ---------------------------------*/
-  .tui-xs-m-0 { margin: 0; }
-  .tui-xs-m-2 { margin: 2px; }
-  .tui-xs-m-4 { margin: 4px; }
-  .tui-xs-m-6 { margin: 6px; }
-  .tui-xs-m-8 { margin: 8px; }
-  .tui-xs-m-10 { margin: 10px; }
-  .tui-xs-m-12 { margin: 12px; }
-  .tui-xs-m-14 { margin: 14px; }
-  .tui-xs-m-16 { margin: 16px; }
-  .tui-xs-m-18 { margin: 18px; }
-  .tui-xs-m-20 { margin: 20px; }
-  .tui-xs-m-22 { margin: 22px; }
-  .tui-xs-m-24 { margin: 24px; }
-  .tui-xs-m-26 { margin: 26px; }
-  .tui-xs-m-28 { margin: 28px; }
-  .tui-xs-m-30 { margin: 30px; }
-  .tui-xs-m-32 { margin: 32px; }
-  .tui-xs-m-34 { margin: 34px; }
-  .tui-xs-m-36 { margin: 36px; }
-  .tui-xs-m-38 { margin: 38px; }
-  .tui-xs-m-40 { margin: 40px; }
-
-  .tui-xs-ml-0 { margin-left: 0; }
-  .tui-xs-ml-2 { margin-left: 2px; }
-  .tui-xs-ml-4 { margin-left: 4px; }
-  .tui-xs-ml-6 { margin-left: 6px; }
-  .tui-xs-ml-8 { margin-left: 8px; }
-  .tui-xs-ml-10 { margin-left: 10px; }
-  .tui-xs-ml-12 { margin-left: 12px; }
-  .tui-xs-ml-14 { margin-left: 14px; }
-  .tui-xs-ml-16 { margin-left: 16px; }
-  .tui-xs-ml-18 { margin-left: 18px; }
-  .tui-xs-ml-20 { margin-left: 20px; }
-  .tui-xs-ml-22 { margin-left: 22px; }
-  .tui-xs-ml-24 { margin-left: 24px; }
-  .tui-xs-ml-26 { margin-left: 26px; }
-  .tui-xs-ml-28 { margin-left: 28px; }
-  .tui-xs-ml-30 { margin-left: 30px; }
-  .tui-xs-ml-32 { margin-left: 32px; }
-  .tui-xs-ml-34 { margin-left: 34px; }
-  .tui-xs-ml-36 { margin-left: 36px; }
-  .tui-xs-ml-38 { margin-left: 38px; }
-  .tui-xs-ml-40 { margin-left: 40px; }
-
-  .tui-xs-mr-0 { margin-right: 0; }
-  .tui-xs-mr-2 { margin-right: 2px; }
-  .tui-xs-mr-4 { margin-right: 4px; }
-  .tui-xs-mr-6 { margin-right: 6px; }
-  .tui-xs-mr-8 { margin-right: 8px; }
-  .tui-xs-mr-10 { margin-right: 10px; }
-  .tui-xs-mr-12 { margin-right: 12px; }
-  .tui-xs-mr-14 { margin-right: 14px; }
-  .tui-xs-mr-16 { margin-right: 16px; }
-  .tui-xs-mr-18 { margin-right: 18px; }
-  .tui-xs-mr-20 { margin-right: 20px; }
-  .tui-xs-mr-22 { margin-right: 22px; }
-  .tui-xs-mr-24 { margin-right: 24px; }
-  .tui-xs-mr-26 { margin-right: 26px; }
-  .tui-xs-mr-28 { margin-right: 28px; }
-  .tui-xs-mr-30 { margin-right: 30px; }
-  .tui-xs-mr-32 { margin-right: 32px; }
-  .tui-xs-mr-34 { margin-right: 34px; }
-  .tui-xs-mr-36 { margin-right: 36px; }
-  .tui-xs-mr-38 { margin-right: 38px; }
-  .tui-xs-mr-40 { margin-right: 40px; }
-
-  .tui-xs-mt-0 { margin-top: 0; }
-  .tui-xs-mt-2 { margin-top: 2px; }
-  .tui-xs-mt-4 { margin-top: 4px; }
-  .tui-xs-mt-6 { margin-top: 6px; }
-  .tui-xs-mt-8 { margin-top: 8px; }
-  .tui-xs-mt-10 { margin-top: 10px; }
-  .tui-xs-mt-12 { margin-top: 12px; }
-  .tui-xs-mt-14 { margin-top: 14px; }
-  .tui-xs-mt-16 { margin-top: 16px; }
-  .tui-xs-mt-18 { margin-top: 18px; }
-  .tui-xs-mt-20 { margin-top: 20px; }
-  .tui-xs-mt-22 { margin-top: 22px; }
-  .tui-xs-mt-24 { margin-top: 24px; }
-  .tui-xs-mt-26 { margin-top: 26px; }
-  .tui-xs-mt-28 { margin-top: 28px; }
-  .tui-xs-mt-30 { margin-top: 30px; }
-  .tui-xs-mt-32 { margin-top: 32px; }
-  .tui-xs-mt-34 { margin-top: 34px; }
-  .tui-xs-mt-36 { margin-top: 36px; }
-  .tui-xs-mt-38 { margin-top: 38px; }
-  .tui-xs-mt-40 { margin-top: 40px; }
-
-  .tui-xs-mb-0 { margin-bottom: 0; }
-  .tui-xs-mb-2 { margin-bottom: 2px; }
-  .tui-xs-mb-4 { margin-bottom: 4px; }
-  .tui-xs-mb-6 { margin-bottom: 6px; }
-  .tui-xs-mb-8 { margin-bottom: 8px; }
-  .tui-xs-mb-10 { margin-bottom: 10px; }
-  .tui-xs-mb-12 { margin-bottom: 12px; }
-  .tui-xs-mb-14 { margin-bottom: 14px; }
-  .tui-xs-mb-16 { margin-bottom: 16px; }
-  .tui-xs-mb-18 { margin-bottom: 18px; }
-  .tui-xs-mb-20 { margin-bottom: 20px; }
-  .tui-xs-mb-22 { margin-bottom: 22px; }
-  .tui-xs-mb-24 { margin-bottom: 24px; }
-  .tui-xs-mb-26 { margin-bottom: 26px; }
-  .tui-xs-mb-28 { margin-bottom: 28px; }
-  .tui-xs-mb-30 { margin-bottom: 30px; }
-  .tui-xs-mb-32 { margin-bottom: 32px; }
-  .tui-xs-mb-34 { margin-bottom: 34px; }
-  .tui-xs-mb-36 { margin-bottom: 36px; }
-  .tui-xs-mb-38 { margin-bottom: 38px; }
-  .tui-xs-mb-40 { margin-bottom: 40px; }
-}
\ No newline at end of file
diff --git a/packages/temple-ui-src/src/data/utilities.json b/packages/temple-ui-src/src/data/utilities.json
deleted file mode 100644
index 5afaa60..0000000
--- a/packages/temple-ui-src/src/data/utilities.json
+++ /dev/null
@@ -1 +0,0 @@
-[{"media":"all","selector":"none","style":"display: none;"},{"media":"all","selector":"block","style":"display: block;"},{"media":"all","selector":"flex","style":"display: flex;"},{"media":"all","selector":"inline","style":"display: inline;"},{"media":"all","selector":"inline-block","style":"display: inline-block;"},{"media":"all","selector":"icy","style":"opacity: 0.85;"},{"media":"all","selector":"glassy","style":"opacity: 0.5;"},{"media":"all","selector":"ghostly","style":"opacity: 0.25;"},{"media":"all","selector":"transparent","style":"opacity: 0;"},{"media":"all","selector":"hidden","style":"visibility: hidden;"},{"media":"all","selector":"flex-row","style":"flex-direction: row;"},{"media":"all","selector":"flex-col","style":"flex-direction: column;"},{"media":"all","selector":"flex-grow","style":"flex-grow: 1;"},{"media":"all","selector":"flex-wrap","style":"flex-wrap: wrap;"},{"media":"all","selector":"flex-center","style":"align-items: center; justify-content: center;"},{"media":"all","selector":"flex-x-center","style":"align-items: center;"},{"media":"all","selector":"flex-y-center","style":"justify-content: center;"},{"media":"all","selector":"h-10","style":"height: 10px;"},{"media":"all","selector":"h-12","style":"height: 12px;"},{"media":"all","selector":"h-15","style":"height: 15px;"},{"media":"all","selector":"h-16","style":"height: 16px;"},{"media":"all","selector":"h-20","style":"height: 20px;"},{"media":"all","selector":"h-24","style":"height: 24px;"},{"media":"all","selector":"h-25","style":"height: 25px;"},{"media":"all","selector":"h-30","style":"height: 30px;"},{"media":"all","selector":"h-32","style":"height: 32px;"},{"media":"all","selector":"h-35","style":"height: 35px;"},{"media":"all","selector":"h-36","style":"height: 36px;"},{"media":"all","selector":"h-40","style":"height: 40px;"},{"media":"all","selector":"h-45","style":"height: 45px;"},{"media":"all","selector":"h-48","style":"height: 48px;"},{"media":"all","selector":"h-50","style":"height: 50px;"},{"media":"all","selector":"h-55","style":"height: 55px;"},{"media":"all","selector":"h-60","style":"height: 60px;"},{"media":"all","selector":"h-64","style":"height: 64px;"},{"media":"all","selector":"h-65","style":"height: 65px;"},{"media":"all","selector":"h-70","style":"height: 70px;"},{"media":"all","selector":"h-75","style":"height: 75px;"},{"media":"all","selector":"h-80","style":"height: 80px;"},{"media":"all","selector":"h-85","style":"height: 85px;"},{"media":"all","selector":"h-90","style":"height: 90px;"},{"media":"all","selector":"h-95","style":"height: 95px;"},{"media":"all","selector":"h-96","style":"height: 96px;"},{"media":"all","selector":"h-100","style":"height: 100px;"},{"media":"all","selector":"h-110","style":"height: 110px;"},{"media":"all","selector":"h-120","style":"height: 120px;"},{"media":"all","selector":"h-130","style":"height: 130px;"},{"media":"all","selector":"h-140","style":"height: 140px;"},{"media":"all","selector":"h-150","style":"height: 150px;"},{"media":"all","selector":"h-160","style":"height: 160px;"},{"media":"all","selector":"h-170","style":"height: 170px;"},{"media":"all","selector":"h-180","style":"height: 180px;"},{"media":"all","selector":"h-190","style":"height: 190px;"},{"media":"all","selector":"h-200","style":"height: 200px;"},{"media":"all","selector":"h-220","style":"height: 220px;"},{"media":"all","selector":"h-240","style":"height: 240px;"},{"media":"all","selector":"h-260","style":"height: 260px;"},{"media":"all","selector":"h-280","style":"height: 280px;"},{"media":"all","selector":"h-300","style":"height: 300px;"},{"media":"all","selector":"h-320","style":"height: 320px;"},{"media":"all","selector":"h-340","style":"height: 340px;"},{"media":"all","selector":"h-360","style":"height: 360px;"},{"media":"all","selector":"h-full","style":"height: 100%;"},{"media":"all","selector":"w-10","style":"width: 10px;"},{"media":"all","selector":"w-12","style":"width: 12px;"},{"media":"all","selector":"w-15","style":"width: 15px;"},{"media":"all","selector":"w-16","style":"width: 16px;"},{"media":"all","selector":"w-20","style":"width: 20px;"},{"media":"all","selector":"w-24","style":"width: 24px;"},{"media":"all","selector":"w-25","style":"width: 25px;"},{"media":"all","selector":"w-30","style":"width: 30px;"},{"media":"all","selector":"w-32","style":"width: 32px;"},{"media":"all","selector":"w-35","style":"width: 35px;"},{"media":"all","selector":"w-36","style":"width: 36px;"},{"media":"all","selector":"w-40","style":"width: 40px;"},{"media":"all","selector":"w-45","style":"width: 45px;"},{"media":"all","selector":"w-48","style":"width: 48px;"},{"media":"all","selector":"w-50","style":"width: 50px;"},{"media":"all","selector":"w-55","style":"width: 55px;"},{"media":"all","selector":"w-60","style":"width: 60px;"},{"media":"all","selector":"w-64","style":"width: 64px;"},{"media":"all","selector":"w-65","style":"width: 65px;"},{"media":"all","selector":"w-70","style":"width: 70px;"},{"media":"all","selector":"w-75","style":"width: 75px;"},{"media":"all","selector":"w-80","style":"width: 80px;"},{"media":"all","selector":"w-85","style":"width: 85px;"},{"media":"all","selector":"w-90","style":"width: 90px;"},{"media":"all","selector":"w-95","style":"width: 95px;"},{"media":"all","selector":"w-96","style":"width: 96px;"},{"media":"all","selector":"w-100","style":"width: 100px;"},{"media":"all","selector":"w-110","style":"width: 110px;"},{"media":"all","selector":"w-120","style":"width: 120px;"},{"media":"all","selector":"w-130","style":"width: 130px;"},{"media":"all","selector":"w-140","style":"width: 140px;"},{"media":"all","selector":"w-150","style":"width: 150px;"},{"media":"all","selector":"w-160","style":"width: 160px;"},{"media":"all","selector":"w-170","style":"width: 170px;"},{"media":"all","selector":"w-180","style":"width: 180px;"},{"media":"all","selector":"w-190","style":"width: 190px;"},{"media":"all","selector":"w-200","style":"width: 200px;"},{"media":"all","selector":"w-220","style":"width: 220px;"},{"media":"all","selector":"w-240","style":"width: 240px;"},{"media":"all","selector":"w-260","style":"width: 260px;"},{"media":"all","selector":"w-280","style":"width: 280px;"},{"media":"all","selector":"w-300","style":"width: 300px;"},{"media":"all","selector":"w-320","style":"width: 320px;"},{"media":"all","selector":"w-340","style":"width: 340px;"},{"media":"all","selector":"w-360","style":"width: 360px;"},{"media":"all","selector":"w-full","style":"width: 100%;"},{"media":"all","selector":"mw-xs","style":"max-width: 360px;"},{"media":"all","selector":"mw-xs","style":"max-width: 420px;"},{"media":"all","selector":"mw-md","style":"max-width: 767px;"},{"media":"all","selector":"mw-lg","style":"max-width: 992px;"},{"media":"all","selector":"mw-xl","style":"max-width: 1024px;"},{"media":"all","selector":"mw-full","style":"max-width: 100%;"},{"media":"all","selector":"bg-primary","style":"background-color: var(--primary) !important;"},{"media":"all","selector":"bg-secondary","style":"background-color: var(--secondary) !important;"},{"media":"all","selector":"bg-black","style":"background-color: var(--black) !important;"},{"media":"all","selector":"bg-white","style":"background-color: var(--white) !important;"},{"media":"all","selector":"bg-info","style":"background-color: var(--info) !important;"},{"media":"all","selector":"bg-error","style":"background-color: var(--error) !important;"},{"media":"all","selector":"bg-warning","style":"background-color: var(--warning) !important;"},{"media":"all","selector":"bg-success","style":"background-color: var(--success) !important;"},{"media":"all","selector":"bg-muted","style":"background-color: var(--muted) !important;"},{"media":"all","selector":"tx-2xs","style":"font-size: 8px;"},{"media":"all","selector":"tx-xs","style":"font-size: 10px;"},{"media":"all","selector":"tx-sm","style":"font-size: 12px;"},{"media":"all","selector":"tx-md","style":"font-size: 14px;"},{"media":"all","selector":"tx-lg","style":"font-size: 16px;"},{"media":"all","selector":"tx-xl","style":"font-size: 18px;"},{"media":"all","selector":"tx-2xl","style":"font-size: 20px;"},{"media":"all","selector":"tx-3xl","style":"font-size: 22px;"},{"media":"all","selector":"tx-4xl","style":"font-size: 24px;"},{"media":"all","selector":"tx-5xl","style":"font-size: 26px;"},{"media":"all","selector":"tx-6xl","style":"font-size: 28px;"},{"media":"all","selector":"tx-7xl","style":"font-size: 30px;"},{"media":"all","selector":"tx-center","style":"text-align: center;"},{"media":"all","selector":"tx-left","style":"text-align: left;"},{"media":"all","selector":"tx-right","style":"text-align: right;"},{"media":"all","selector":"tx-bold","style":"font-weight: bold;"},{"media":"all","selector":"tx-normal","style":"font-weight: normal;"},{"media":"all","selector":"tx-italic","style":"font-style: italic;"},{"media":"all","selector":"tx-uppercase","style":"text-transform: uppercase;"},{"media":"all","selector":"tx-underline","style":"text-decoration: underline;"},{"media":"all","selector":"tx-nowrap","style":"white-space: nowrap;"},{"media":"all","selector":"tx-nodecor","style":"text-decoration: none;"},{"media":"all","selector":"tx-primary","style":"color: var(--primary) !important;"},{"media":"all","selector":"tx-secondary","style":"color: var(--secondary) !important;"},{"media":"all","selector":"tx-black","style":"color: var(--black) !important;"},{"media":"all","selector":"tx-white","style":"color: var(--white) !important;"},{"media":"all","selector":"tx-info","style":"color: var(--info) !important;"},{"media":"all","selector":"tx-error","style":"color: var(--error) !important;"},{"media":"all","selector":"tx-warning","style":"color: var(--warning) !important;"},{"media":"all","selector":"tx-success","style":"color: var(--success) !important;"},{"media":"all","selector":"tx-muted","style":"color: var(--muted) !important;"},{"media":"all","selector":"bd-solid","style":"border-style: solid;"},{"media":"all","selector":"bd-dash","style":"border-style: dashed;"},{"media":"all","selector":"bd-dotted","style":"border-style: dotted;"},{"media":"all","selector":"bd","style":"border: 1px solid var(--black);"},{"media":"all","selector":"bdt","style":"border-top: 1px solid var(--black);"},{"media":"all","selector":"bdb","style":"border-bottom: 1px solid var(--black);"},{"media":"all","selector":"bdl","style":"border-left: 1px solid var(--black);"},{"media":"all","selector":"bdr","style":"border-right: 1px solid var(--black);"},{"media":"all","selector":"bd-xs","style":"border-width: 1px;"},{"media":"all","selector":"bd-sm","style":"border-width: 2px;"},{"media":"all","selector":"bd-md","style":"border-width: 3px;"},{"media":"all","selector":"bd-lg","style":"border-width: 4px;"},{"media":"all","selector":"bd-xl","style":"border-width: 5px;"},{"media":"all","selector":"bdt-xs","style":"border-top-width: 1px;"},{"media":"all","selector":"bdt-sm","style":"border-top-width: 2px;"},{"media":"all","selector":"bdt-md","style":"border-top-width: 3px;"},{"media":"all","selector":"bdt-lg","style":"border-top-width: 4px;"},{"media":"all","selector":"bdt-xl","style":"border-top-width: 5px;"},{"media":"all","selector":"bdb-xs","style":"border-bottom-width: 1px;"},{"media":"all","selector":"bdb-sm","style":"border-bottom-width: 2px;"},{"media":"all","selector":"bdb-md","style":"border-bottom-width: 3px;"},{"media":"all","selector":"bdb-lg","style":"border-bottom-width: 4px;"},{"media":"all","selector":"bdb-xl","style":"border-bottom-width: 5px;"},{"media":"all","selector":"bdl-xs","style":"border-left-width: 1px;"},{"media":"all","selector":"bdl-sm","style":"border-left-width: 2px;"},{"media":"all","selector":"bdl-md","style":"border-left-width: 3px;"},{"media":"all","selector":"bdl-lg","style":"border-left-width: 4px;"},{"media":"all","selector":"bdl-xl","style":"border-left-width: 5px;"},{"media":"all","selector":"bdr-xs","style":"border-right-width: 1px;"},{"media":"all","selector":"bdr-sm","style":"border-right-width: 2px;"},{"media":"all","selector":"bdr-md","style":"border-right-width: 3px;"},{"media":"all","selector":"bdr-lg","style":"border-right-width: 4px;"},{"media":"all","selector":"bdr-xl","style":"border-right-width: 5px;"},{"media":"all","selector":"bd-rad-xs","style":"border-radius: 2px;"},{"media":"all","selector":"bd-rad-sm,","style":"border-radius: 4px;"},{"media":"all","selector":"bd-curved","style":"border-radius: 4px;"},{"media":"all","selector":"bd-rad-md","style":"border-radius: 6px;"},{"media":"all","selector":"bd-rad-lg","style":"border-radius: 8px;"},{"media":"all","selector":"bd-rad-xl,","style":"border-radius: 12px;"},{"media":"all","selector":"bd-rounded","style":"border-radius: 12px;"},{"media":"all","selector":"bd-rad-full,","style":"border-radius: 10000px;"},{"media":"all","selector":"bd-pill","style":"border-radius: 10000px;"},{"media":"all","selector":"bdl-rad-xs","style":"border-radius: 2px 0 0 2px;"},{"media":"all","selector":"bdl-rad-sm,","style":"border-radius: 4px 0 0 4px;"},{"media":"all","selector":"bdl-curved","style":"border-radius: 4px 0 0 4px;"},{"media":"all","selector":"bdl-rad-md","style":"border-radius: 6px 0 0 6px;"},{"media":"all","selector":"bdl-rad-lg","style":"border-radius: 8px 0 0 8px;"},{"media":"all","selector":"bdl-rad-xl,","style":"border-radius: 12px 0 0 12px;"},{"media":"all","selector":"bdl-rounded","style":"border-radius: 12px 0 0 12px;"},{"media":"all","selector":"bdl-rad-full,","style":"border-radius: 10000px 0 0 10000px;"},{"media":"all","selector":"bdl-pill","style":"border-radius: 10000px 0 0 10000px;"},{"media":"all","selector":"bdr-rad-xs","style":"border-radius: 0 2px 2px 0;"},{"media":"all","selector":"bdr-rad-sm,","style":"border-radius: 0 4px 4px 0;"},{"media":"all","selector":"bdr-curved","style":"border-radius: 0 4px 4px 0;"},{"media":"all","selector":"bdr-rad-md","style":"border-radius: 0 6px 6px 0;"},{"media":"all","selector":"bdr-rad-lg","style":"border-radius: 0 8px 8px 0;"},{"media":"all","selector":"bdr-rad-xl,","style":"border-radius: 0 12px 12px 0;"},{"media":"all","selector":"bdr-rounded","style":"border-radius: 0 12px 12px 0;"},{"media":"all","selector":"bdr-rad-full,","style":"border-radius: 0 10000px 10000px 0;"},{"media":"all","selector":"bdr-pill","style":"border-radius: 0 10000px 10000px 0;"},{"media":"all","selector":"bdt-rad-xs","style":"border-radius: 2px 2px 0 0;"},{"media":"all","selector":"bdt-rad-sm,","style":"border-radius: 4px 4px 0 0;"},{"media":"all","selector":"bdt-curved","style":"border-radius: 4px 4px 0 0;"},{"media":"all","selector":"bdt-rad-md","style":"border-radius: 6px 6px 0 0;"},{"media":"all","selector":"bdt-rad-lg","style":"border-radius: 8px 8px 0 0;"},{"media":"all","selector":"bdt-rad-xl,","style":"border-radius: 12px 12px 0 0;"},{"media":"all","selector":"bdt-rounded","style":"border-radius: 12px 12px 0 0;"},{"media":"all","selector":"bdt-rad-full,","style":"border-radius: 10000px 10000px 0 0;"},{"media":"all","selector":"bdt-pill","style":"border-radius: 10000px 10000px 0 0;"},{"media":"all","selector":"bdb-rad-xs","style":"border-radius: 2px 2px 0 0;"},{"media":"all","selector":"bdb-rad-sm,","style":"border-radius: 0 0 4px 4px;"},{"media":"all","selector":"bdb-curved","style":"border-radius: 0 0 4px 4px;"},{"media":"all","selector":"bdb-rad-md","style":"border-radius: 0 0 6px 6px;"},{"media":"all","selector":"bdb-rad-lg","style":"border-radius: 0 0 8px 8px;"},{"media":"all","selector":"bdb-rad-xl,","style":"border-radius: 0 0 12px 12px;"},{"media":"all","selector":"bdb-rounded","style":"border-radius: 0 0 12px 12px;"},{"media":"all","selector":"bdb-rad-full,","style":"border-radius: 0 0 10000px 10000px;"},{"media":"all","selector":"bdb-pill","style":"border-radius: 0 0 10000px 10000px;"},{"media":"all","selector":"bd-primary","style":"border-color: var(--primary) !important;"},{"media":"all","selector":"bd-secondary","style":"border-color: var(--secondary) !important;"},{"media":"all","selector":"bd-black","style":"border-color: var(--black) !important;"},{"media":"all","selector":"bd-white","style":"border-color: var(--white) !important;"},{"media":"all","selector":"bd-info","style":"border-color: var(--info) !important;"},{"media":"all","selector":"bd-error","style":"border-color: var(--error) !important;"},{"media":"all","selector":"bd-warning","style":"border-color: var(--warning) !important;"},{"media":"all","selector":"bd-success","style":"border-color: var(--success) !important;"},{"media":"all","selector":"bd-muted","style":"border-color: var(--muted) !important;"},{"media":"all","selector":"p-0","style":"padding: 0;"},{"media":"all","selector":"p-2","style":"padding: 2px;"},{"media":"all","selector":"p-4","style":"padding: 4px;"},{"media":"all","selector":"p-6","style":"padding: 6px;"},{"media":"all","selector":"p-8","style":"padding: 8px;"},{"media":"all","selector":"p-10","style":"padding: 10px;"},{"media":"all","selector":"p-12","style":"padding: 12px;"},{"media":"all","selector":"p-14","style":"padding: 14px;"},{"media":"all","selector":"p-16","style":"padding: 16px;"},{"media":"all","selector":"p-18","style":"padding: 18px;"},{"media":"all","selector":"p-20","style":"padding: 20px;"},{"media":"all","selector":"p-22","style":"padding: 22px;"},{"media":"all","selector":"p-24","style":"padding: 24px;"},{"media":"all","selector":"p-26","style":"padding: 26px;"},{"media":"all","selector":"p-28","style":"padding: 28px;"},{"media":"all","selector":"p-30","style":"padding: 30px;"},{"media":"all","selector":"p-32","style":"padding: 32px;"},{"media":"all","selector":"p-34","style":"padding: 34px;"},{"media":"all","selector":"p-36","style":"padding: 36px;"},{"media":"all","selector":"p-38","style":"padding: 38px;"},{"media":"all","selector":"p-40","style":"padding: 40px;"},{"media":"all","selector":"pl-0","style":"padding-left: 0;"},{"media":"all","selector":"pl-2","style":"padding-left: 2px;"},{"media":"all","selector":"pl-4","style":"padding-left: 4px;"},{"media":"all","selector":"pl-6","style":"padding-left: 6px;"},{"media":"all","selector":"pl-8","style":"padding-left: 8px;"},{"media":"all","selector":"pl-10","style":"padding-left: 10px;"},{"media":"all","selector":"pl-12","style":"padding-left: 12px;"},{"media":"all","selector":"pl-14","style":"padding-left: 14px;"},{"media":"all","selector":"pl-16","style":"padding-left: 16px;"},{"media":"all","selector":"pl-18","style":"padding-left: 18px;"},{"media":"all","selector":"pl-20","style":"padding-left: 20px;"},{"media":"all","selector":"pl-22","style":"padding-left: 22px;"},{"media":"all","selector":"pl-24","style":"padding-left: 24px;"},{"media":"all","selector":"pl-26","style":"padding-left: 26px;"},{"media":"all","selector":"pl-28","style":"padding-left: 28px;"},{"media":"all","selector":"pl-30","style":"padding-left: 30px;"},{"media":"all","selector":"pl-32","style":"padding-left: 32px;"},{"media":"all","selector":"pl-34","style":"padding-left: 34px;"},{"media":"all","selector":"pl-36","style":"padding-left: 36px;"},{"media":"all","selector":"pl-38","style":"padding-left: 38px;"},{"media":"all","selector":"pl-40","style":"padding-left: 40px;"},{"media":"all","selector":"pr-0","style":"padding-right: 0;"},{"media":"all","selector":"pr-2","style":"padding-right: 2px;"},{"media":"all","selector":"pr-4","style":"padding-right: 4px;"},{"media":"all","selector":"pr-6","style":"padding-right: 6px;"},{"media":"all","selector":"pr-8","style":"padding-right: 8px;"},{"media":"all","selector":"pr-10","style":"padding-right: 10px;"},{"media":"all","selector":"pr-12","style":"padding-right: 12px;"},{"media":"all","selector":"pr-14","style":"padding-right: 14px;"},{"media":"all","selector":"pr-16","style":"padding-right: 16px;"},{"media":"all","selector":"pr-18","style":"padding-right: 18px;"},{"media":"all","selector":"pr-20","style":"padding-right: 20px;"},{"media":"all","selector":"pr-22","style":"padding-right: 22px;"},{"media":"all","selector":"pr-24","style":"padding-right: 24px;"},{"media":"all","selector":"pr-26","style":"padding-right: 26px;"},{"media":"all","selector":"pr-28","style":"padding-right: 28px;"},{"media":"all","selector":"pr-30","style":"padding-right: 30px;"},{"media":"all","selector":"pr-32","style":"padding-right: 32px;"},{"media":"all","selector":"pr-34","style":"padding-right: 34px;"},{"media":"all","selector":"pr-36","style":"padding-right: 36px;"},{"media":"all","selector":"pr-38","style":"padding-right: 38px;"},{"media":"all","selector":"pr-40","style":"padding-right: 40px;"},{"media":"all","selector":"pt-0","style":"padding-top: 0;"},{"media":"all","selector":"pt-2","style":"padding-top: 2px;"},{"media":"all","selector":"pt-4","style":"padding-top: 4px;"},{"media":"all","selector":"pt-6","style":"padding-top: 6px;"},{"media":"all","selector":"pt-8","style":"padding-top: 8px;"},{"media":"all","selector":"pt-10","style":"padding-top: 10px;"},{"media":"all","selector":"pt-12","style":"padding-top: 12px;"},{"media":"all","selector":"pt-14","style":"padding-top: 14px;"},{"media":"all","selector":"pt-16","style":"padding-top: 16px;"},{"media":"all","selector":"pt-18","style":"padding-top: 18px;"},{"media":"all","selector":"pt-20","style":"padding-top: 20px;"},{"media":"all","selector":"pt-22","style":"padding-top: 22px;"},{"media":"all","selector":"pt-24","style":"padding-top: 24px;"},{"media":"all","selector":"pt-26","style":"padding-top: 26px;"},{"media":"all","selector":"pt-28","style":"padding-top: 28px;"},{"media":"all","selector":"pt-30","style":"padding-top: 30px;"},{"media":"all","selector":"pt-32","style":"padding-top: 32px;"},{"media":"all","selector":"pt-34","style":"padding-top: 34px;"},{"media":"all","selector":"pt-36","style":"padding-top: 36px;"},{"media":"all","selector":"pt-38","style":"padding-top: 38px;"},{"media":"all","selector":"pt-40","style":"padding-top: 40px;"},{"media":"all","selector":"pb-0","style":"padding-bottom: 0;"},{"media":"all","selector":"pb-2","style":"padding-bottom: 2px;"},{"media":"all","selector":"pb-4","style":"padding-bottom: 4px;"},{"media":"all","selector":"pb-6","style":"padding-bottom: 6px;"},{"media":"all","selector":"pb-8","style":"padding-bottom: 8px;"},{"media":"all","selector":"pb-10","style":"padding-bottom: 10px;"},{"media":"all","selector":"pb-12","style":"padding-bottom: 12px;"},{"media":"all","selector":"pb-14","style":"padding-bottom: 14px;"},{"media":"all","selector":"pb-16","style":"padding-bottom: 16px;"},{"media":"all","selector":"pb-18","style":"padding-bottom: 18px;"},{"media":"all","selector":"pb-20","style":"padding-bottom: 20px;"},{"media":"all","selector":"pb-22","style":"padding-bottom: 22px;"},{"media":"all","selector":"pb-24","style":"padding-bottom: 24px;"},{"media":"all","selector":"pb-26","style":"padding-bottom: 26px;"},{"media":"all","selector":"pb-28","style":"padding-bottom: 28px;"},{"media":"all","selector":"pb-30","style":"padding-bottom: 30px;"},{"media":"all","selector":"pb-32","style":"padding-bottom: 32px;"},{"media":"all","selector":"pb-34","style":"padding-bottom: 34px;"},{"media":"all","selector":"pb-36","style":"padding-bottom: 36px;"},{"media":"all","selector":"pb-38","style":"padding-bottom: 38px;"},{"media":"all","selector":"pb-40","style":"padding-bottom: 40px;"},{"media":"all","selector":"m-0","style":"margin: 0;"},{"media":"all","selector":"m-2","style":"margin: 2px;"},{"media":"all","selector":"m-4","style":"margin: 4px;"},{"media":"all","selector":"m-6","style":"margin: 6px;"},{"media":"all","selector":"m-8","style":"margin: 8px;"},{"media":"all","selector":"m-10","style":"margin: 10px;"},{"media":"all","selector":"m-12","style":"margin: 12px;"},{"media":"all","selector":"m-14","style":"margin: 14px;"},{"media":"all","selector":"m-16","style":"margin: 16px;"},{"media":"all","selector":"m-18","style":"margin: 18px;"},{"media":"all","selector":"m-20","style":"margin: 20px;"},{"media":"all","selector":"m-22","style":"margin: 22px;"},{"media":"all","selector":"m-24","style":"margin: 24px;"},{"media":"all","selector":"m-26","style":"margin: 26px;"},{"media":"all","selector":"m-28","style":"margin: 28px;"},{"media":"all","selector":"m-30","style":"margin: 30px;"},{"media":"all","selector":"m-32","style":"margin: 32px;"},{"media":"all","selector":"m-34","style":"margin: 34px;"},{"media":"all","selector":"m-36","style":"margin: 36px;"},{"media":"all","selector":"m-38","style":"margin: 38px;"},{"media":"all","selector":"m-40","style":"margin: 40px;"},{"media":"all","selector":"ml-0","style":"margin-left: 0;"},{"media":"all","selector":"ml-2","style":"margin-left: 2px;"},{"media":"all","selector":"ml-4","style":"margin-left: 4px;"},{"media":"all","selector":"ml-6","style":"margin-left: 6px;"},{"media":"all","selector":"ml-8","style":"margin-left: 8px;"},{"media":"all","selector":"ml-10","style":"margin-left: 10px;"},{"media":"all","selector":"ml-12","style":"margin-left: 12px;"},{"media":"all","selector":"ml-14","style":"margin-left: 14px;"},{"media":"all","selector":"ml-16","style":"margin-left: 16px;"},{"media":"all","selector":"ml-18","style":"margin-left: 18px;"},{"media":"all","selector":"ml-20","style":"margin-left: 20px;"},{"media":"all","selector":"ml-22","style":"margin-left: 22px;"},{"media":"all","selector":"ml-24","style":"margin-left: 24px;"},{"media":"all","selector":"ml-26","style":"margin-left: 26px;"},{"media":"all","selector":"ml-28","style":"margin-left: 28px;"},{"media":"all","selector":"ml-30","style":"margin-left: 30px;"},{"media":"all","selector":"ml-32","style":"margin-left: 32px;"},{"media":"all","selector":"ml-34","style":"margin-left: 34px;"},{"media":"all","selector":"ml-36","style":"margin-left: 36px;"},{"media":"all","selector":"ml-38","style":"margin-left: 38px;"},{"media":"all","selector":"ml-40","style":"margin-left: 40px;"},{"media":"all","selector":"mr-0","style":"margin-right: 0;"},{"media":"all","selector":"mr-2","style":"margin-right: 2px;"},{"media":"all","selector":"mr-4","style":"margin-right: 4px;"},{"media":"all","selector":"mr-6","style":"margin-right: 6px;"},{"media":"all","selector":"mr-8","style":"margin-right: 8px;"},{"media":"all","selector":"mr-10","style":"margin-right: 10px;"},{"media":"all","selector":"mr-12","style":"margin-right: 12px;"},{"media":"all","selector":"mr-14","style":"margin-right: 14px;"},{"media":"all","selector":"mr-16","style":"margin-right: 16px;"},{"media":"all","selector":"mr-18","style":"margin-right: 18px;"},{"media":"all","selector":"mr-20","style":"margin-right: 20px;"},{"media":"all","selector":"mr-22","style":"margin-right: 22px;"},{"media":"all","selector":"mr-24","style":"margin-right: 24px;"},{"media":"all","selector":"mr-26","style":"margin-right: 26px;"},{"media":"all","selector":"mr-28","style":"margin-right: 28px;"},{"media":"all","selector":"mr-30","style":"margin-right: 30px;"},{"media":"all","selector":"mr-32","style":"margin-right: 32px;"},{"media":"all","selector":"mr-34","style":"margin-right: 34px;"},{"media":"all","selector":"mr-36","style":"margin-right: 36px;"},{"media":"all","selector":"mr-38","style":"margin-right: 38px;"},{"media":"all","selector":"mr-40","style":"margin-right: 40px;"},{"media":"all","selector":"mt-0","style":"margin-top: 0;"},{"media":"all","selector":"mt-2","style":"margin-top: 2px;"},{"media":"all","selector":"mt-4","style":"margin-top: 4px;"},{"media":"all","selector":"mt-6","style":"margin-top: 6px;"},{"media":"all","selector":"mt-8","style":"margin-top: 8px;"},{"media":"all","selector":"mt-10","style":"margin-top: 10px;"},{"media":"all","selector":"mt-12","style":"margin-top: 12px;"},{"media":"all","selector":"mt-14","style":"margin-top: 14px;"},{"media":"all","selector":"mt-16","style":"margin-top: 16px;"},{"media":"all","selector":"mt-18","style":"margin-top: 18px;"},{"media":"all","selector":"mt-20","style":"margin-top: 20px;"},{"media":"all","selector":"mt-22","style":"margin-top: 22px;"},{"media":"all","selector":"mt-24","style":"margin-top: 24px;"},{"media":"all","selector":"mt-26","style":"margin-top: 26px;"},{"media":"all","selector":"mt-28","style":"margin-top: 28px;"},{"media":"all","selector":"mt-30","style":"margin-top: 30px;"},{"media":"all","selector":"mt-32","style":"margin-top: 32px;"},{"media":"all","selector":"mt-34","style":"margin-top: 34px;"},{"media":"all","selector":"mt-36","style":"margin-top: 36px;"},{"media":"all","selector":"mt-38","style":"margin-top: 38px;"},{"media":"all","selector":"mt-40","style":"margin-top: 40px;"},{"media":"all","selector":"mb-0","style":"margin-bottom: 0;"},{"media":"all","selector":"mb-2","style":"margin-bottom: 2px;"},{"media":"all","selector":"mb-4","style":"margin-bottom: 4px;"},{"media":"all","selector":"mb-6","style":"margin-bottom: 6px;"},{"media":"all","selector":"mb-8","style":"margin-bottom: 8px;"},{"media":"all","selector":"mb-10","style":"margin-bottom: 10px;"},{"media":"all","selector":"mb-12","style":"margin-bottom: 12px;"},{"media":"all","selector":"mb-14","style":"margin-bottom: 14px;"},{"media":"all","selector":"mb-16","style":"margin-bottom: 16px;"},{"media":"all","selector":"mb-18","style":"margin-bottom: 18px;"},{"media":"all","selector":"mb-20","style":"margin-bottom: 20px;"},{"media":"all","selector":"mb-22","style":"margin-bottom: 22px;"},{"media":"all","selector":"mb-24","style":"margin-bottom: 24px;"},{"media":"all","selector":"mb-26","style":"margin-bottom: 26px;"},{"media":"all","selector":"mb-28","style":"margin-bottom: 28px;"},{"media":"all","selector":"mb-30","style":"margin-bottom: 30px;"},{"media":"all","selector":"mb-32","style":"margin-bottom: 32px;"},{"media":"all","selector":"mb-34","style":"margin-bottom: 34px;"},{"media":"all","selector":"mb-36","style":"margin-bottom: 36px;"},{"media":"all","selector":"mb-38","style":"margin-bottom: 38px;"},{"media":"all","selector":"mb-40","style":"margin-bottom: 40px;"},{"media":"1024px","selector":"xl-none","style":"display: none;"},{"media":"1024px","selector":"xl-block","style":"display: block;"},{"media":"1024px","selector":"xl-flex","style":"display: flex;"},{"media":"1024px","selector":"xl-inline","style":"display: inline;"},{"media":"1024px","selector":"xl-inline-block","style":"display: inline-block;"},{"media":"1024px","selector":"xl-icy","style":"opacity: 0.85;"},{"media":"1024px","selector":"xl-glassy","style":"opacity: 0.5;"},{"media":"1024px","selector":"xl-ghostly","style":"opacity: 0.25;"},{"media":"1024px","selector":"xl-transparent","style":"opacity: 0;"},{"media":"1024px","selector":"xl-hidden","style":"visibility: hidden;"},{"media":"1024px","selector":"xl-flex-row","style":"flex-direction: row;"},{"media":"1024px","selector":"xl-flex-col","style":"flex-direction: column;"},{"media":"1024px","selector":"xl-flex-grow","style":"flex-grow: 1;"},{"media":"1024px","selector":"xl-flex-wrap","style":"flex-wrap: wrap;"},{"media":"1024px","selector":"xl-flex-center","style":"align-items: center; justify-content: center;"},{"media":"1024px","selector":"xl-flex-x-center","style":"align-items: center;"},{"media":"1024px","selector":"xl-flex-y-center","style":"justify-content: center;"},{"media":"1024px","selector":"xl-h-10","style":"height: 10px;"},{"media":"1024px","selector":"xl-h-12","style":"height: 12px;"},{"media":"1024px","selector":"xl-h-15","style":"height: 15px;"},{"media":"1024px","selector":"xl-h-16","style":"height: 16px;"},{"media":"1024px","selector":"xl-h-20","style":"height: 20px;"},{"media":"1024px","selector":"xl-h-24","style":"height: 24px;"},{"media":"1024px","selector":"xl-h-25","style":"height: 25px;"},{"media":"1024px","selector":"xl-h-30","style":"height: 30px;"},{"media":"1024px","selector":"xl-h-32","style":"height: 32px;"},{"media":"1024px","selector":"xl-h-35","style":"height: 35px;"},{"media":"1024px","selector":"xl-h-36","style":"height: 36px;"},{"media":"1024px","selector":"xl-h-40","style":"height: 40px;"},{"media":"1024px","selector":"xl-h-45","style":"height: 45px;"},{"media":"1024px","selector":"xl-h-48","style":"height: 48px;"},{"media":"1024px","selector":"xl-h-50","style":"height: 50px;"},{"media":"1024px","selector":"xl-h-55","style":"height: 55px;"},{"media":"1024px","selector":"xl-h-60","style":"height: 60px;"},{"media":"1024px","selector":"xl-h-64","style":"height: 64px;"},{"media":"1024px","selector":"xl-h-65","style":"height: 65px;"},{"media":"1024px","selector":"xl-h-70","style":"height: 70px;"},{"media":"1024px","selector":"xl-h-75","style":"height: 75px;"},{"media":"1024px","selector":"xl-h-80","style":"height: 80px;"},{"media":"1024px","selector":"xl-h-85","style":"height: 85px;"},{"media":"1024px","selector":"xl-h-90","style":"height: 90px;"},{"media":"1024px","selector":"xl-h-95","style":"height: 95px;"},{"media":"1024px","selector":"xl-h-96","style":"height: 96px;"},{"media":"1024px","selector":"xl-h-100","style":"height: 100px;"},{"media":"1024px","selector":"xl-h-110","style":"height: 110px;"},{"media":"1024px","selector":"xl-h-120","style":"height: 120px;"},{"media":"1024px","selector":"xl-h-130","style":"height: 130px;"},{"media":"1024px","selector":"xl-h-140","style":"height: 140px;"},{"media":"1024px","selector":"xl-h-150","style":"height: 150px;"},{"media":"1024px","selector":"xl-h-160","style":"height: 160px;"},{"media":"1024px","selector":"xl-h-170","style":"height: 170px;"},{"media":"1024px","selector":"xl-h-180","style":"height: 180px;"},{"media":"1024px","selector":"xl-h-190","style":"height: 190px;"},{"media":"1024px","selector":"xl-h-200","style":"height: 200px;"},{"media":"1024px","selector":"xl-h-220","style":"height: 220px;"},{"media":"1024px","selector":"xl-h-240","style":"height: 240px;"},{"media":"1024px","selector":"xl-h-260","style":"height: 260px;"},{"media":"1024px","selector":"xl-h-280","style":"height: 280px;"},{"media":"1024px","selector":"xl-h-300","style":"height: 300px;"},{"media":"1024px","selector":"xl-h-320","style":"height: 320px;"},{"media":"1024px","selector":"xl-h-340","style":"height: 340px;"},{"media":"1024px","selector":"xl-h-360","style":"height: 360px;"},{"media":"1024px","selector":"xl-h-full","style":"height: 100%;"},{"media":"1024px","selector":"xl-w-10","style":"width: 10px;"},{"media":"1024px","selector":"xl-w-12","style":"width: 12px;"},{"media":"1024px","selector":"xl-w-15","style":"width: 15px;"},{"media":"1024px","selector":"xl-w-16","style":"width: 16px;"},{"media":"1024px","selector":"xl-w-20","style":"width: 20px;"},{"media":"1024px","selector":"xl-w-24","style":"width: 24px;"},{"media":"1024px","selector":"xl-w-25","style":"width: 25px;"},{"media":"1024px","selector":"xl-w-30","style":"width: 30px;"},{"media":"1024px","selector":"xl-w-32","style":"width: 32px;"},{"media":"1024px","selector":"xl-w-35","style":"width: 35px;"},{"media":"1024px","selector":"xl-w-36","style":"width: 36px;"},{"media":"1024px","selector":"xl-w-40","style":"width: 40px;"},{"media":"1024px","selector":"xl-w-45","style":"width: 45px;"},{"media":"1024px","selector":"xl-w-48","style":"width: 48px;"},{"media":"1024px","selector":"xl-w-50","style":"width: 50px;"},{"media":"1024px","selector":"xl-w-55","style":"width: 55px;"},{"media":"1024px","selector":"xl-w-60","style":"width: 60px;"},{"media":"1024px","selector":"xl-w-64","style":"width: 64px;"},{"media":"1024px","selector":"xl-w-65","style":"width: 65px;"},{"media":"1024px","selector":"xl-w-70","style":"width: 70px;"},{"media":"1024px","selector":"xl-w-75","style":"width: 75px;"},{"media":"1024px","selector":"xl-w-80","style":"width: 80px;"},{"media":"1024px","selector":"xl-w-85","style":"width: 85px;"},{"media":"1024px","selector":"xl-w-90","style":"width: 90px;"},{"media":"1024px","selector":"xl-w-95","style":"width: 95px;"},{"media":"1024px","selector":"xl-w-96","style":"width: 96px;"},{"media":"1024px","selector":"xl-w-100","style":"width: 100px;"},{"media":"1024px","selector":"xl-w-110","style":"width: 110px;"},{"media":"1024px","selector":"xl-w-120","style":"width: 120px;"},{"media":"1024px","selector":"xl-w-130","style":"width: 130px;"},{"media":"1024px","selector":"xl-w-140","style":"width: 140px;"},{"media":"1024px","selector":"xl-w-150","style":"width: 150px;"},{"media":"1024px","selector":"xl-w-160","style":"width: 160px;"},{"media":"1024px","selector":"xl-w-170","style":"width: 170px;"},{"media":"1024px","selector":"xl-w-180","style":"width: 180px;"},{"media":"1024px","selector":"xl-w-190","style":"width: 190px;"},{"media":"1024px","selector":"xl-w-200","style":"width: 200px;"},{"media":"1024px","selector":"xl-w-220","style":"width: 220px;"},{"media":"1024px","selector":"xl-w-240","style":"width: 240px;"},{"media":"1024px","selector":"xl-w-260","style":"width: 260px;"},{"media":"1024px","selector":"xl-w-280","style":"width: 280px;"},{"media":"1024px","selector":"xl-w-300","style":"width: 300px;"},{"media":"1024px","selector":"xl-w-320","style":"width: 320px;"},{"media":"1024px","selector":"xl-w-340","style":"width: 340px;"},{"media":"1024px","selector":"xl-w-360","style":"width: 360px;"},{"media":"1024px","selector":"xl-w-full","style":"width: 100%;"},{"media":"1024px","selector":"xl-mw-xs","style":"max-width: 360px;"},{"media":"1024px","selector":"xl-mw-xs","style":"max-width: 420px;"},{"media":"1024px","selector":"xl-mw-md","style":"max-width: 767px;"},{"media":"1024px","selector":"xl-mw-lg","style":"max-width: 992px;"},{"media":"1024px","selector":"xl-mw-xl","style":"max-width: 1024px;"},{"media":"1024px","selector":"xl-mw-full","style":"max-width: 100%;"},{"media":"1024px","selector":"xl-tx-2xs","style":"font-size: 8px;"},{"media":"1024px","selector":"xl-tx-xs","style":"font-size: 10px;"},{"media":"1024px","selector":"xl-tx-sm","style":"font-size: 12px;"},{"media":"1024px","selector":"xl-tx-md","style":"font-size: 14px;"},{"media":"1024px","selector":"xl-tx-lg","style":"font-size: 16px;"},{"media":"1024px","selector":"xl-tx-xl","style":"font-size: 18px;"},{"media":"1024px","selector":"xl-tx-2xl","style":"font-size: 20px;"},{"media":"1024px","selector":"xl-tx-3xl","style":"font-size: 22px;"},{"media":"1024px","selector":"xl-tx-4xl","style":"font-size: 24px;"},{"media":"1024px","selector":"xl-tx-5xl","style":"font-size: 26px;"},{"media":"1024px","selector":"xl-tx-6xl","style":"font-size: 28px;"},{"media":"1024px","selector":"xl-tx-7xl","style":"font-size: 30px;"},{"media":"1024px","selector":"xl-tx-center","style":"text-align: center;"},{"media":"1024px","selector":"xl-tx-left","style":"text-align: left;"},{"media":"1024px","selector":"xl-tx-right","style":"text-align: right;"},{"media":"1024px","selector":"xl-tx-bold","style":"font-weight: bold;"},{"media":"1024px","selector":"xl-tx-normal","style":"font-weight: normal;"},{"media":"1024px","selector":"xl-tx-italic","style":"font-style: italic;"},{"media":"1024px","selector":"xl-tx-uppercase","style":"text-transform: uppercase;"},{"media":"1024px","selector":"xl-tx-underline","style":"text-decoration: underline;"},{"media":"1024px","selector":"xl-tx-nowrap","style":"white-space: nowrap;"},{"media":"1024px","selector":"xl-tx-primary","style":"color: var(--primary) !important;"},{"media":"1024px","selector":"xl-tx-secondary","style":"color: var(--secondary) !important;"},{"media":"1024px","selector":"xl-tx-black","style":"color: var(--black) !important;"},{"media":"1024px","selector":"xl-tx-white","style":"color: var(--white) !important;"},{"media":"1024px","selector":"xl-tx-info","style":"color: var(--info) !important;"},{"media":"1024px","selector":"xl-tx-error","style":"color: var(--error) !important;"},{"media":"1024px","selector":"xl-tx-warning","style":"color: var(--warning) !important;"},{"media":"1024px","selector":"xl-tx-success","style":"color: var(--success) !important;"},{"media":"1024px","selector":"xl-tx-muted","style":"color: var(--muted) !important;"},{"media":"1024px","selector":"xl-bd-solid","style":"border-style: solid;"},{"media":"1024px","selector":"xl-bd-dash","style":"border-style: dashed;"},{"media":"1024px","selector":"xl-bd-dotted","style":"border-style: dotted;"},{"media":"1024px","selector":"xl-bd-xs","style":"border-width: 1px;"},{"media":"1024px","selector":"xl-bd-sm","style":"border-width: 2px;"},{"media":"1024px","selector":"xl-bd-md","style":"border-width: 3px;"},{"media":"1024px","selector":"xl-bd-lg","style":"border-width: 4px;"},{"media":"1024px","selector":"xl-bd-xl","style":"border-width: 5px;"},{"media":"1024px","selector":"xl-bdt-xs","style":"border-top-width: 1px;"},{"media":"1024px","selector":"xl-bdt-sm","style":"border-top-width: 2px;"},{"media":"1024px","selector":"xl-bdt-md","style":"border-top-width: 3px;"},{"media":"1024px","selector":"xl-bdt-lg","style":"border-top-width: 4px;"},{"media":"1024px","selector":"xl-bdt-xl","style":"border-top-width: 5px;"},{"media":"1024px","selector":"xl-bdb-xs","style":"border-bottom-width: 1px;"},{"media":"1024px","selector":"xl-bdb-sm","style":"border-bottom-width: 2px;"},{"media":"1024px","selector":"xl-bdb-md","style":"border-bottom-width: 3px;"},{"media":"1024px","selector":"xl-bdb-lg","style":"border-bottom-width: 4px;"},{"media":"1024px","selector":"xl-bdb-xl","style":"border-bottom-width: 5px;"},{"media":"1024px","selector":"xl-bdl-xs","style":"border-left-width: 1px;"},{"media":"1024px","selector":"xl-bdl-sm","style":"border-left-width: 2px;"},{"media":"1024px","selector":"xl-bdl-md","style":"border-left-width: 3px;"},{"media":"1024px","selector":"xl-bdl-lg","style":"border-left-width: 4px;"},{"media":"1024px","selector":"xl-bdl-xl","style":"border-left-width: 5px;"},{"media":"1024px","selector":"xl-bdr-xs","style":"border-right-width: 1px;"},{"media":"1024px","selector":"xl-bdr-sm","style":"border-right-width: 2px;"},{"media":"1024px","selector":"xl-bdr-md","style":"border-right-width: 3px;"},{"media":"1024px","selector":"xl-bdr-lg","style":"border-right-width: 4px;"},{"media":"1024px","selector":"xl-bdr-xl","style":"border-right-width: 5px;"},{"media":"1024px","selector":"xl-bd-rad-xs","style":"border-radius: 2px;"},{"media":"1024px","selector":"xl-bd-rad-sm,","style":"border-radius: 4px;"},{"media":"1024px","selector":"bd-curved","style":"border-radius: 4px;"},{"media":"1024px","selector":"xl-bd-rad-md","style":"border-radius: 6px;"},{"media":"1024px","selector":"xl-bd-rad-lg","style":"border-radius: 8px;"},{"media":"1024px","selector":"xl-bd-rad-xl,","style":"border-radius: 12px;"},{"media":"1024px","selector":"bd-rounded","style":"border-radius: 12px;"},{"media":"1024px","selector":"xl-bd-rad-full,","style":"border-radius: 10000px;"},{"media":"1024px","selector":"bd-pill","style":"border-radius: 10000px;"},{"media":"1024px","selector":"xl-bdl-rad-xs","style":"border-radius: 2px 0 0 2px;"},{"media":"1024px","selector":"xl-bdl-rad-sm,","style":"border-radius: 4px 0 0 4px;"},{"media":"1024px","selector":"bdl-curved","style":"border-radius: 4px 0 0 4px;"},{"media":"1024px","selector":"xl-bdl-rad-md","style":"border-radius: 6px 0 0 6px;"},{"media":"1024px","selector":"xl-bdl-rad-lg","style":"border-radius: 8px 0 0 8px;"},{"media":"1024px","selector":"xl-bdl-rad-xl,","style":"border-radius: 12px 0 0 12px;"},{"media":"1024px","selector":"bdl-rounded","style":"border-radius: 12px 0 0 12px;"},{"media":"1024px","selector":"xl-bdl-rad-full,","style":"border-radius: 10000px 0 0 10000px;"},{"media":"1024px","selector":"bdl-pill","style":"border-radius: 10000px 0 0 10000px;"},{"media":"1024px","selector":"xl-bdr-rad-xs","style":"border-radius: 0 2px 2px 0;"},{"media":"1024px","selector":"xl-bdr-rad-sm,","style":"border-radius: 0 4px 4px 0;"},{"media":"1024px","selector":"bdr-curved","style":"border-radius: 0 4px 4px 0;"},{"media":"1024px","selector":"xl-bdr-rad-md","style":"border-radius: 0 6px 6px 0;"},{"media":"1024px","selector":"xl-bdr-rad-lg","style":"border-radius: 0 8px 8px 0;"},{"media":"1024px","selector":"xl-bdr-rad-xl,","style":"border-radius: 0 12px 12px 0;"},{"media":"1024px","selector":"bdr-rounded","style":"border-radius: 0 12px 12px 0;"},{"media":"1024px","selector":"xl-bdr-rad-full,","style":"border-radius: 0 10000px 10000px 0;"},{"media":"1024px","selector":"bdr-pill","style":"border-radius: 0 10000px 10000px 0;"},{"media":"1024px","selector":"xl-bdt-rad-xs","style":"border-radius: 2px 2px 0 0;"},{"media":"1024px","selector":"xl-bdt-rad-sm,","style":"border-radius: 4px 4px 0 0;"},{"media":"1024px","selector":"bdt-curved","style":"border-radius: 4px 4px 0 0;"},{"media":"1024px","selector":"xl-bdt-rad-md","style":"border-radius: 6px 6px 0 0;"},{"media":"1024px","selector":"xl-bdt-rad-lg","style":"border-radius: 8px 8px 0 0;"},{"media":"1024px","selector":"xl-bdt-rad-xl,","style":"border-radius: 12px 12px 0 0;"},{"media":"1024px","selector":"bdt-rounded","style":"border-radius: 12px 12px 0 0;"},{"media":"1024px","selector":"xl-bdt-rad-full,","style":"border-radius: 10000px 10000px 0 0;"},{"media":"1024px","selector":"bdt-pill","style":"border-radius: 10000px 10000px 0 0;"},{"media":"1024px","selector":"xl-bdb-rad-xs","style":"border-radius: 2px 2px 0 0;"},{"media":"1024px","selector":"xl-bdb-rad-sm,","style":"border-radius: 0 0 4px 4px;"},{"media":"1024px","selector":"bdb-curved","style":"border-radius: 0 0 4px 4px;"},{"media":"1024px","selector":"xl-bdb-rad-md","style":"border-radius: 0 0 6px 6px;"},{"media":"1024px","selector":"xl-bdb-rad-lg","style":"border-radius: 0 0 8px 8px;"},{"media":"1024px","selector":"xl-bdb-rad-xl,","style":"border-radius: 0 0 12px 12px;"},{"media":"1024px","selector":"bdb-rounded","style":"border-radius: 0 0 12px 12px;"},{"media":"1024px","selector":"xl-bdb-rad-full,","style":"border-radius: 0 0 10000px 10000px;"},{"media":"1024px","selector":"bdb-pill","style":"border-radius: 0 0 10000px 10000px;"},{"media":"1024px","selector":"xl-p-0","style":"padding: 0;"},{"media":"1024px","selector":"xl-p-2","style":"padding: 2px;"},{"media":"1024px","selector":"xl-p-4","style":"padding: 4px;"},{"media":"1024px","selector":"xl-p-6","style":"padding: 6px;"},{"media":"1024px","selector":"xl-p-8","style":"padding: 8px;"},{"media":"1024px","selector":"xl-p-10","style":"padding: 10px;"},{"media":"1024px","selector":"xl-p-12","style":"padding: 12px;"},{"media":"1024px","selector":"xl-p-14","style":"padding: 14px;"},{"media":"1024px","selector":"xl-p-16","style":"padding: 16px;"},{"media":"1024px","selector":"xl-p-18","style":"padding: 18px;"},{"media":"1024px","selector":"xl-p-20","style":"padding: 20px;"},{"media":"1024px","selector":"xl-p-22","style":"padding: 22px;"},{"media":"1024px","selector":"xl-p-24","style":"padding: 24px;"},{"media":"1024px","selector":"xl-p-26","style":"padding: 26px;"},{"media":"1024px","selector":"xl-p-28","style":"padding: 28px;"},{"media":"1024px","selector":"xl-p-30","style":"padding: 30px;"},{"media":"1024px","selector":"xl-p-32","style":"padding: 32px;"},{"media":"1024px","selector":"xl-p-34","style":"padding: 34px;"},{"media":"1024px","selector":"xl-p-36","style":"padding: 36px;"},{"media":"1024px","selector":"xl-p-38","style":"padding: 38px;"},{"media":"1024px","selector":"xl-p-40","style":"padding: 40px;"},{"media":"1024px","selector":"xl-pl-0","style":"padding-left: 0;"},{"media":"1024px","selector":"xl-pl-2","style":"padding-left: 2px;"},{"media":"1024px","selector":"xl-pl-4","style":"padding-left: 4px;"},{"media":"1024px","selector":"xl-pl-6","style":"padding-left: 6px;"},{"media":"1024px","selector":"xl-pl-8","style":"padding-left: 8px;"},{"media":"1024px","selector":"xl-pl-10","style":"padding-left: 10px;"},{"media":"1024px","selector":"xl-pl-12","style":"padding-left: 12px;"},{"media":"1024px","selector":"xl-pl-14","style":"padding-left: 14px;"},{"media":"1024px","selector":"xl-pl-16","style":"padding-left: 16px;"},{"media":"1024px","selector":"xl-pl-18","style":"padding-left: 18px;"},{"media":"1024px","selector":"xl-pl-20","style":"padding-left: 20px;"},{"media":"1024px","selector":"xl-pl-22","style":"padding-left: 22px;"},{"media":"1024px","selector":"xl-pl-24","style":"padding-left: 24px;"},{"media":"1024px","selector":"xl-pl-26","style":"padding-left: 26px;"},{"media":"1024px","selector":"xl-pl-28","style":"padding-left: 28px;"},{"media":"1024px","selector":"xl-pl-30","style":"padding-left: 30px;"},{"media":"1024px","selector":"xl-pl-32","style":"padding-left: 32px;"},{"media":"1024px","selector":"xl-pl-34","style":"padding-left: 34px;"},{"media":"1024px","selector":"xl-pl-36","style":"padding-left: 36px;"},{"media":"1024px","selector":"xl-pl-38","style":"padding-left: 38px;"},{"media":"1024px","selector":"xl-pl-40","style":"padding-left: 40px;"},{"media":"1024px","selector":"xl-pr-0","style":"padding-right: 0;"},{"media":"1024px","selector":"xl-pr-2","style":"padding-right: 2px;"},{"media":"1024px","selector":"xl-pr-4","style":"padding-right: 4px;"},{"media":"1024px","selector":"xl-pr-6","style":"padding-right: 6px;"},{"media":"1024px","selector":"xl-pr-8","style":"padding-right: 8px;"},{"media":"1024px","selector":"xl-pr-10","style":"padding-right: 10px;"},{"media":"1024px","selector":"xl-pr-12","style":"padding-right: 12px;"},{"media":"1024px","selector":"xl-pr-14","style":"padding-right: 14px;"},{"media":"1024px","selector":"xl-pr-16","style":"padding-right: 16px;"},{"media":"1024px","selector":"xl-pr-18","style":"padding-right: 18px;"},{"media":"1024px","selector":"xl-pr-20","style":"padding-right: 20px;"},{"media":"1024px","selector":"xl-pr-22","style":"padding-right: 22px;"},{"media":"1024px","selector":"xl-pr-24","style":"padding-right: 24px;"},{"media":"1024px","selector":"xl-pr-26","style":"padding-right: 26px;"},{"media":"1024px","selector":"xl-pr-28","style":"padding-right: 28px;"},{"media":"1024px","selector":"xl-pr-30","style":"padding-right: 30px;"},{"media":"1024px","selector":"xl-pr-32","style":"padding-right: 32px;"},{"media":"1024px","selector":"xl-pr-34","style":"padding-right: 34px;"},{"media":"1024px","selector":"xl-pr-36","style":"padding-right: 36px;"},{"media":"1024px","selector":"xl-pr-38","style":"padding-right: 38px;"},{"media":"1024px","selector":"xl-pr-40","style":"padding-right: 40px;"},{"media":"1024px","selector":"xl-pt-0","style":"padding-top: 0;"},{"media":"1024px","selector":"xl-pt-2","style":"padding-top: 2px;"},{"media":"1024px","selector":"xl-pt-4","style":"padding-top: 4px;"},{"media":"1024px","selector":"xl-pt-6","style":"padding-top: 6px;"},{"media":"1024px","selector":"xl-pt-8","style":"padding-top: 8px;"},{"media":"1024px","selector":"xl-pt-10","style":"padding-top: 10px;"},{"media":"1024px","selector":"xl-pt-12","style":"padding-top: 12px;"},{"media":"1024px","selector":"xl-pt-14","style":"padding-top: 14px;"},{"media":"1024px","selector":"xl-pt-16","style":"padding-top: 16px;"},{"media":"1024px","selector":"xl-pt-18","style":"padding-top: 18px;"},{"media":"1024px","selector":"xl-pt-20","style":"padding-top: 20px;"},{"media":"1024px","selector":"xl-pt-22","style":"padding-top: 22px;"},{"media":"1024px","selector":"xl-pt-24","style":"padding-top: 24px;"},{"media":"1024px","selector":"xl-pt-26","style":"padding-top: 26px;"},{"media":"1024px","selector":"xl-pt-28","style":"padding-top: 28px;"},{"media":"1024px","selector":"xl-pt-30","style":"padding-top: 30px;"},{"media":"1024px","selector":"xl-pt-32","style":"padding-top: 32px;"},{"media":"1024px","selector":"xl-pt-34","style":"padding-top: 34px;"},{"media":"1024px","selector":"xl-pt-36","style":"padding-top: 36px;"},{"media":"1024px","selector":"xl-pt-38","style":"padding-top: 38px;"},{"media":"1024px","selector":"xl-pt-40","style":"padding-top: 40px;"},{"media":"1024px","selector":"xl-pb-0","style":"padding-bottom: 0;"},{"media":"1024px","selector":"xl-pb-2","style":"padding-bottom: 2px;"},{"media":"1024px","selector":"xl-pb-4","style":"padding-bottom: 4px;"},{"media":"1024px","selector":"xl-pb-6","style":"padding-bottom: 6px;"},{"media":"1024px","selector":"xl-pb-8","style":"padding-bottom: 8px;"},{"media":"1024px","selector":"xl-pb-10","style":"padding-bottom: 10px;"},{"media":"1024px","selector":"xl-pb-12","style":"padding-bottom: 12px;"},{"media":"1024px","selector":"xl-pb-14","style":"padding-bottom: 14px;"},{"media":"1024px","selector":"xl-pb-16","style":"padding-bottom: 16px;"},{"media":"1024px","selector":"xl-pb-18","style":"padding-bottom: 18px;"},{"media":"1024px","selector":"xl-pb-20","style":"padding-bottom: 20px;"},{"media":"1024px","selector":"xl-pb-22","style":"padding-bottom: 22px;"},{"media":"1024px","selector":"xl-pb-24","style":"padding-bottom: 24px;"},{"media":"1024px","selector":"xl-pb-26","style":"padding-bottom: 26px;"},{"media":"1024px","selector":"xl-pb-28","style":"padding-bottom: 28px;"},{"media":"1024px","selector":"xl-pb-30","style":"padding-bottom: 30px;"},{"media":"1024px","selector":"xl-pb-32","style":"padding-bottom: 32px;"},{"media":"1024px","selector":"xl-pb-34","style":"padding-bottom: 34px;"},{"media":"1024px","selector":"xl-pb-36","style":"padding-bottom: 36px;"},{"media":"1024px","selector":"xl-pb-38","style":"padding-bottom: 38px;"},{"media":"1024px","selector":"xl-pb-40","style":"padding-bottom: 40px;"},{"media":"1024px","selector":"xl-m-0","style":"margin: 0;"},{"media":"1024px","selector":"xl-m-2","style":"margin: 2px;"},{"media":"1024px","selector":"xl-m-4","style":"margin: 4px;"},{"media":"1024px","selector":"xl-m-6","style":"margin: 6px;"},{"media":"1024px","selector":"xl-m-8","style":"margin: 8px;"},{"media":"1024px","selector":"xl-m-10","style":"margin: 10px;"},{"media":"1024px","selector":"xl-m-12","style":"margin: 12px;"},{"media":"1024px","selector":"xl-m-14","style":"margin: 14px;"},{"media":"1024px","selector":"xl-m-16","style":"margin: 16px;"},{"media":"1024px","selector":"xl-m-18","style":"margin: 18px;"},{"media":"1024px","selector":"xl-m-20","style":"margin: 20px;"},{"media":"1024px","selector":"xl-m-22","style":"margin: 22px;"},{"media":"1024px","selector":"xl-m-24","style":"margin: 24px;"},{"media":"1024px","selector":"xl-m-26","style":"margin: 26px;"},{"media":"1024px","selector":"xl-m-28","style":"margin: 28px;"},{"media":"1024px","selector":"xl-m-30","style":"margin: 30px;"},{"media":"1024px","selector":"xl-m-32","style":"margin: 32px;"},{"media":"1024px","selector":"xl-m-34","style":"margin: 34px;"},{"media":"1024px","selector":"xl-m-36","style":"margin: 36px;"},{"media":"1024px","selector":"xl-m-38","style":"margin: 38px;"},{"media":"1024px","selector":"xl-m-40","style":"margin: 40px;"},{"media":"1024px","selector":"xl-ml-0","style":"margin-left: 0;"},{"media":"1024px","selector":"xl-ml-2","style":"margin-left: 2px;"},{"media":"1024px","selector":"xl-ml-4","style":"margin-left: 4px;"},{"media":"1024px","selector":"xl-ml-6","style":"margin-left: 6px;"},{"media":"1024px","selector":"xl-ml-8","style":"margin-left: 8px;"},{"media":"1024px","selector":"xl-ml-10","style":"margin-left: 10px;"},{"media":"1024px","selector":"xl-ml-12","style":"margin-left: 12px;"},{"media":"1024px","selector":"xl-ml-14","style":"margin-left: 14px;"},{"media":"1024px","selector":"xl-ml-16","style":"margin-left: 16px;"},{"media":"1024px","selector":"xl-ml-18","style":"margin-left: 18px;"},{"media":"1024px","selector":"xl-ml-20","style":"margin-left: 20px;"},{"media":"1024px","selector":"xl-ml-22","style":"margin-left: 22px;"},{"media":"1024px","selector":"xl-ml-24","style":"margin-left: 24px;"},{"media":"1024px","selector":"xl-ml-26","style":"margin-left: 26px;"},{"media":"1024px","selector":"xl-ml-28","style":"margin-left: 28px;"},{"media":"1024px","selector":"xl-ml-30","style":"margin-left: 30px;"},{"media":"1024px","selector":"xl-ml-32","style":"margin-left: 32px;"},{"media":"1024px","selector":"xl-ml-34","style":"margin-left: 34px;"},{"media":"1024px","selector":"xl-ml-36","style":"margin-left: 36px;"},{"media":"1024px","selector":"xl-ml-38","style":"margin-left: 38px;"},{"media":"1024px","selector":"xl-ml-40","style":"margin-left: 40px;"},{"media":"1024px","selector":"xl-mr-0","style":"margin-right: 0;"},{"media":"1024px","selector":"xl-mr-2","style":"margin-right: 2px;"},{"media":"1024px","selector":"xl-mr-4","style":"margin-right: 4px;"},{"media":"1024px","selector":"xl-mr-6","style":"margin-right: 6px;"},{"media":"1024px","selector":"xl-mr-8","style":"margin-right: 8px;"},{"media":"1024px","selector":"xl-mr-10","style":"margin-right: 10px;"},{"media":"1024px","selector":"xl-mr-12","style":"margin-right: 12px;"},{"media":"1024px","selector":"xl-mr-14","style":"margin-right: 14px;"},{"media":"1024px","selector":"xl-mr-16","style":"margin-right: 16px;"},{"media":"1024px","selector":"xl-mr-18","style":"margin-right: 18px;"},{"media":"1024px","selector":"xl-mr-20","style":"margin-right: 20px;"},{"media":"1024px","selector":"xl-mr-22","style":"margin-right: 22px;"},{"media":"1024px","selector":"xl-mr-24","style":"margin-right: 24px;"},{"media":"1024px","selector":"xl-mr-26","style":"margin-right: 26px;"},{"media":"1024px","selector":"xl-mr-28","style":"margin-right: 28px;"},{"media":"1024px","selector":"xl-mr-30","style":"margin-right: 30px;"},{"media":"1024px","selector":"xl-mr-32","style":"margin-right: 32px;"},{"media":"1024px","selector":"xl-mr-34","style":"margin-right: 34px;"},{"media":"1024px","selector":"xl-mr-36","style":"margin-right: 36px;"},{"media":"1024px","selector":"xl-mr-38","style":"margin-right: 38px;"},{"media":"1024px","selector":"xl-mr-40","style":"margin-right: 40px;"},{"media":"1024px","selector":"xl-mt-0","style":"margin-top: 0;"},{"media":"1024px","selector":"xl-mt-2","style":"margin-top: 2px;"},{"media":"1024px","selector":"xl-mt-4","style":"margin-top: 4px;"},{"media":"1024px","selector":"xl-mt-6","style":"margin-top: 6px;"},{"media":"1024px","selector":"xl-mt-8","style":"margin-top: 8px;"},{"media":"1024px","selector":"xl-mt-10","style":"margin-top: 10px;"},{"media":"1024px","selector":"xl-mt-12","style":"margin-top: 12px;"},{"media":"1024px","selector":"xl-mt-14","style":"margin-top: 14px;"},{"media":"1024px","selector":"xl-mt-16","style":"margin-top: 16px;"},{"media":"1024px","selector":"xl-mt-18","style":"margin-top: 18px;"},{"media":"1024px","selector":"xl-mt-20","style":"margin-top: 20px;"},{"media":"1024px","selector":"xl-mt-22","style":"margin-top: 22px;"},{"media":"1024px","selector":"xl-mt-24","style":"margin-top: 24px;"},{"media":"1024px","selector":"xl-mt-26","style":"margin-top: 26px;"},{"media":"1024px","selector":"xl-mt-28","style":"margin-top: 28px;"},{"media":"1024px","selector":"xl-mt-30","style":"margin-top: 30px;"},{"media":"1024px","selector":"xl-mt-32","style":"margin-top: 32px;"},{"media":"1024px","selector":"xl-mt-34","style":"margin-top: 34px;"},{"media":"1024px","selector":"xl-mt-36","style":"margin-top: 36px;"},{"media":"1024px","selector":"xl-mt-38","style":"margin-top: 38px;"},{"media":"1024px","selector":"xl-mt-40","style":"margin-top: 40px;"},{"media":"1024px","selector":"xl-mb-0","style":"margin-bottom: 0;"},{"media":"1024px","selector":"xl-mb-2","style":"margin-bottom: 2px;"},{"media":"1024px","selector":"xl-mb-4","style":"margin-bottom: 4px;"},{"media":"1024px","selector":"xl-mb-6","style":"margin-bottom: 6px;"},{"media":"1024px","selector":"xl-mb-8","style":"margin-bottom: 8px;"},{"media":"1024px","selector":"xl-mb-10","style":"margin-bottom: 10px;"},{"media":"1024px","selector":"xl-mb-12","style":"margin-bottom: 12px;"},{"media":"1024px","selector":"xl-mb-14","style":"margin-bottom: 14px;"},{"media":"1024px","selector":"xl-mb-16","style":"margin-bottom: 16px;"},{"media":"1024px","selector":"xl-mb-18","style":"margin-bottom: 18px;"},{"media":"1024px","selector":"xl-mb-20","style":"margin-bottom: 20px;"},{"media":"1024px","selector":"xl-mb-22","style":"margin-bottom: 22px;"},{"media":"1024px","selector":"xl-mb-24","style":"margin-bottom: 24px;"},{"media":"1024px","selector":"xl-mb-26","style":"margin-bottom: 26px;"},{"media":"1024px","selector":"xl-mb-28","style":"margin-bottom: 28px;"},{"media":"1024px","selector":"xl-mb-30","style":"margin-bottom: 30px;"},{"media":"1024px","selector":"xl-mb-32","style":"margin-bottom: 32px;"},{"media":"1024px","selector":"xl-mb-34","style":"margin-bottom: 34px;"},{"media":"1024px","selector":"xl-mb-36","style":"margin-bottom: 36px;"},{"media":"1024px","selector":"xl-mb-38","style":"margin-bottom: 38px;"},{"media":"1024px","selector":"xl-mb-40","style":"margin-bottom: 40px;"},{"media":"992px","selector":"lg-none","style":"display: none;"},{"media":"992px","selector":"lg-block","style":"display: block;"},{"media":"992px","selector":"lg-flex","style":"display: flex;"},{"media":"992px","selector":"lg-inline","style":"display: inline;"},{"media":"992px","selector":"lg-inline-block","style":"display: inline-block;"},{"media":"992px","selector":"lg-icy","style":"opacity: 0.85;"},{"media":"992px","selector":"lg-glassy","style":"opacity: 0.5;"},{"media":"992px","selector":"lg-ghostly","style":"opacity: 0.25;"},{"media":"992px","selector":"lg-transparent","style":"opacity: 0;"},{"media":"992px","selector":"lg-hidden","style":"visibility: hidden;"},{"media":"992px","selector":"lg-flex-row","style":"flex-direction: row;"},{"media":"992px","selector":"lg-flex-col","style":"flex-direction: column;"},{"media":"992px","selector":"lg-flex-grow","style":"flex-grow: 1;"},{"media":"992px","selector":"lg-flex-wrap","style":"flex-wrap: wrap;"},{"media":"992px","selector":"lg-flex-center","style":"align-items: center; justify-content: center;"},{"media":"992px","selector":"lg-flex-x-center","style":"align-items: center;"},{"media":"992px","selector":"lg-flex-y-center","style":"justify-content: center;"},{"media":"992px","selector":"lg-h-10","style":"height: 10px;"},{"media":"992px","selector":"lg-h-12","style":"height: 12px;"},{"media":"992px","selector":"lg-h-15","style":"height: 15px;"},{"media":"992px","selector":"lg-h-16","style":"height: 16px;"},{"media":"992px","selector":"lg-h-20","style":"height: 20px;"},{"media":"992px","selector":"lg-h-24","style":"height: 24px;"},{"media":"992px","selector":"lg-h-25","style":"height: 25px;"},{"media":"992px","selector":"lg-h-30","style":"height: 30px;"},{"media":"992px","selector":"lg-h-32","style":"height: 32px;"},{"media":"992px","selector":"lg-h-35","style":"height: 35px;"},{"media":"992px","selector":"lg-h-36","style":"height: 36px;"},{"media":"992px","selector":"lg-h-40","style":"height: 40px;"},{"media":"992px","selector":"lg-h-45","style":"height: 45px;"},{"media":"992px","selector":"lg-h-48","style":"height: 48px;"},{"media":"992px","selector":"lg-h-50","style":"height: 50px;"},{"media":"992px","selector":"lg-h-55","style":"height: 55px;"},{"media":"992px","selector":"lg-h-60","style":"height: 60px;"},{"media":"992px","selector":"lg-h-64","style":"height: 64px;"},{"media":"992px","selector":"lg-h-65","style":"height: 65px;"},{"media":"992px","selector":"lg-h-70","style":"height: 70px;"},{"media":"992px","selector":"lg-h-75","style":"height: 75px;"},{"media":"992px","selector":"lg-h-80","style":"height: 80px;"},{"media":"992px","selector":"lg-h-85","style":"height: 85px;"},{"media":"992px","selector":"lg-h-90","style":"height: 90px;"},{"media":"992px","selector":"lg-h-95","style":"height: 95px;"},{"media":"992px","selector":"lg-h-96","style":"height: 96px;"},{"media":"992px","selector":"lg-h-100","style":"height: 100px;"},{"media":"992px","selector":"lg-h-110","style":"height: 110px;"},{"media":"992px","selector":"lg-h-120","style":"height: 120px;"},{"media":"992px","selector":"lg-h-130","style":"height: 130px;"},{"media":"992px","selector":"lg-h-140","style":"height: 140px;"},{"media":"992px","selector":"lg-h-150","style":"height: 150px;"},{"media":"992px","selector":"lg-h-160","style":"height: 160px;"},{"media":"992px","selector":"lg-h-170","style":"height: 170px;"},{"media":"992px","selector":"lg-h-180","style":"height: 180px;"},{"media":"992px","selector":"lg-h-190","style":"height: 190px;"},{"media":"992px","selector":"lg-h-200","style":"height: 200px;"},{"media":"992px","selector":"lg-h-220","style":"height: 220px;"},{"media":"992px","selector":"lg-h-240","style":"height: 240px;"},{"media":"992px","selector":"lg-h-260","style":"height: 260px;"},{"media":"992px","selector":"lg-h-280","style":"height: 280px;"},{"media":"992px","selector":"lg-h-300","style":"height: 300px;"},{"media":"992px","selector":"lg-h-320","style":"height: 320px;"},{"media":"992px","selector":"lg-h-340","style":"height: 340px;"},{"media":"992px","selector":"lg-h-360","style":"height: 360px;"},{"media":"992px","selector":"lg-h-full","style":"height: 100%;"},{"media":"992px","selector":"lg-w-10","style":"width: 10px;"},{"media":"992px","selector":"lg-w-12","style":"width: 12px;"},{"media":"992px","selector":"lg-w-15","style":"width: 15px;"},{"media":"992px","selector":"lg-w-16","style":"width: 16px;"},{"media":"992px","selector":"lg-w-20","style":"width: 20px;"},{"media":"992px","selector":"lg-w-24","style":"width: 24px;"},{"media":"992px","selector":"lg-w-25","style":"width: 25px;"},{"media":"992px","selector":"lg-w-30","style":"width: 30px;"},{"media":"992px","selector":"lg-w-32","style":"width: 32px;"},{"media":"992px","selector":"lg-w-35","style":"width: 35px;"},{"media":"992px","selector":"lg-w-36","style":"width: 36px;"},{"media":"992px","selector":"lg-w-40","style":"width: 40px;"},{"media":"992px","selector":"lg-w-45","style":"width: 45px;"},{"media":"992px","selector":"lg-w-48","style":"width: 48px;"},{"media":"992px","selector":"lg-w-50","style":"width: 50px;"},{"media":"992px","selector":"lg-w-55","style":"width: 55px;"},{"media":"992px","selector":"lg-w-60","style":"width: 60px;"},{"media":"992px","selector":"lg-w-64","style":"width: 64px;"},{"media":"992px","selector":"lg-w-65","style":"width: 65px;"},{"media":"992px","selector":"lg-w-70","style":"width: 70px;"},{"media":"992px","selector":"lg-w-75","style":"width: 75px;"},{"media":"992px","selector":"lg-w-80","style":"width: 80px;"},{"media":"992px","selector":"lg-w-85","style":"width: 85px;"},{"media":"992px","selector":"lg-w-90","style":"width: 90px;"},{"media":"992px","selector":"lg-w-95","style":"width: 95px;"},{"media":"992px","selector":"lg-w-96","style":"width: 96px;"},{"media":"992px","selector":"lg-w-100","style":"width: 100px;"},{"media":"992px","selector":"lg-w-110","style":"width: 110px;"},{"media":"992px","selector":"lg-w-120","style":"width: 120px;"},{"media":"992px","selector":"lg-w-130","style":"width: 130px;"},{"media":"992px","selector":"lg-w-140","style":"width: 140px;"},{"media":"992px","selector":"lg-w-150","style":"width: 150px;"},{"media":"992px","selector":"lg-w-160","style":"width: 160px;"},{"media":"992px","selector":"lg-w-170","style":"width: 170px;"},{"media":"992px","selector":"lg-w-180","style":"width: 180px;"},{"media":"992px","selector":"lg-w-190","style":"width: 190px;"},{"media":"992px","selector":"lg-w-200","style":"width: 200px;"},{"media":"992px","selector":"lg-w-220","style":"width: 220px;"},{"media":"992px","selector":"lg-w-240","style":"width: 240px;"},{"media":"992px","selector":"lg-w-260","style":"width: 260px;"},{"media":"992px","selector":"lg-w-280","style":"width: 280px;"},{"media":"992px","selector":"lg-w-300","style":"width: 300px;"},{"media":"992px","selector":"lg-w-320","style":"width: 320px;"},{"media":"992px","selector":"lg-w-340","style":"width: 340px;"},{"media":"992px","selector":"lg-w-360","style":"width: 360px;"},{"media":"992px","selector":"lg-w-full","style":"width: 100%;"},{"media":"992px","selector":"lg-mw-xs","style":"max-width: 360px;"},{"media":"992px","selector":"lg-mw-xs","style":"max-width: 420px;"},{"media":"992px","selector":"lg-mw-md","style":"max-width: 767px;"},{"media":"992px","selector":"lg-mw-lg","style":"max-width: 992px;"},{"media":"992px","selector":"lg-mw-xl","style":"max-width: 1024px;"},{"media":"992px","selector":"lg-mw-full","style":"max-width: 100%;"},{"media":"992px","selector":"lg-tx-2xs","style":"font-size: 8px;"},{"media":"992px","selector":"lg-tx-xs","style":"font-size: 10px;"},{"media":"992px","selector":"lg-tx-sm","style":"font-size: 12px;"},{"media":"992px","selector":"lg-tx-md","style":"font-size: 14px;"},{"media":"992px","selector":"lg-tx-lg","style":"font-size: 16px;"},{"media":"992px","selector":"lg-tx-xl","style":"font-size: 18px;"},{"media":"992px","selector":"lg-tx-2xl","style":"font-size: 20px;"},{"media":"992px","selector":"lg-tx-3xl","style":"font-size: 22px;"},{"media":"992px","selector":"lg-tx-4xl","style":"font-size: 24px;"},{"media":"992px","selector":"lg-tx-5xl","style":"font-size: 26px;"},{"media":"992px","selector":"lg-tx-6xl","style":"font-size: 28px;"},{"media":"992px","selector":"lg-tx-7xl","style":"font-size: 30px;"},{"media":"992px","selector":"lg-tx-center","style":"text-align: center;"},{"media":"992px","selector":"lg-tx-left","style":"text-align: left;"},{"media":"992px","selector":"lg-tx-right","style":"text-align: right;"},{"media":"992px","selector":"lg-tx-bold","style":"font-weight: bold;"},{"media":"992px","selector":"lg-tx-normal","style":"font-weight: normal;"},{"media":"992px","selector":"lg-tx-italic","style":"font-style: italic;"},{"media":"992px","selector":"lg-tx-uppercase","style":"text-transform: uppercase;"},{"media":"992px","selector":"lg-tx-underline","style":"text-decoration: underline;"},{"media":"992px","selector":"lg-tx-nowrap","style":"white-space: nowrap;"},{"media":"992px","selector":"lg-bd-solid","style":"border-style: solid;"},{"media":"992px","selector":"lg-bd-dash","style":"border-style: dashed;"},{"media":"992px","selector":"lg-bd-dotted","style":"border-style: dotted;"},{"media":"992px","selector":"lg-bd","style":"border: 1px solid var(--black);"},{"media":"992px","selector":"lg-bdt","style":"border-top: 1px solid var(--black);"},{"media":"992px","selector":"lg-bdb","style":"border-bottom: 1px solid var(--black);"},{"media":"992px","selector":"lg-bdl","style":"border-left: 1px solid var(--black);"},{"media":"992px","selector":"lg-bdr","style":"border-right: 1px solid var(--black);"},{"media":"992px","selector":"lg-bd-xs","style":"border-width: 1px;"},{"media":"992px","selector":"lg-bd-sm","style":"border-width: 2px;"},{"media":"992px","selector":"lg-bd-md","style":"border-width: 3px;"},{"media":"992px","selector":"lg-bd-lg","style":"border-width: 4px;"},{"media":"992px","selector":"lg-bd-xl","style":"border-width: 5px;"},{"media":"992px","selector":"lg-bdt-xs","style":"border-top-width: 1px;"},{"media":"992px","selector":"lg-bdt-sm","style":"border-top-width: 2px;"},{"media":"992px","selector":"lg-bdt-md","style":"border-top-width: 3px;"},{"media":"992px","selector":"lg-bdt-lg","style":"border-top-width: 4px;"},{"media":"992px","selector":"lg-bdt-xl","style":"border-top-width: 5px;"},{"media":"992px","selector":"lg-bdb-xs","style":"border-bottom-width: 1px;"},{"media":"992px","selector":"lg-bdb-sm","style":"border-bottom-width: 2px;"},{"media":"992px","selector":"lg-bdb-md","style":"border-bottom-width: 3px;"},{"media":"992px","selector":"lg-bdb-lg","style":"border-bottom-width: 4px;"},{"media":"992px","selector":"lg-bdb-xl","style":"border-bottom-width: 5px;"},{"media":"992px","selector":"lg-bdl-xs","style":"border-left-width: 1px;"},{"media":"992px","selector":"lg-bdl-sm","style":"border-left-width: 2px;"},{"media":"992px","selector":"lg-bdl-md","style":"border-left-width: 3px;"},{"media":"992px","selector":"lg-bdl-lg","style":"border-left-width: 4px;"},{"media":"992px","selector":"lg-bdl-xl","style":"border-left-width: 5px;"},{"media":"992px","selector":"lg-bdr-xs","style":"border-right-width: 1px;"},{"media":"992px","selector":"lg-bdr-sm","style":"border-right-width: 2px;"},{"media":"992px","selector":"lg-bdr-md","style":"border-right-width: 3px;"},{"media":"992px","selector":"lg-bdr-lg","style":"border-right-width: 4px;"},{"media":"992px","selector":"lg-bdr-xl","style":"border-right-width: 5px;"},{"media":"992px","selector":"lg-bd-rad-xs","style":"border-radius: 2px;"},{"media":"992px","selector":"lg-bd-rad-sm,","style":"border-radius: 4px;"},{"media":"992px","selector":"bd-curved","style":"border-radius: 4px;"},{"media":"992px","selector":"lg-bd-rad-md","style":"border-radius: 6px;"},{"media":"992px","selector":"lg-bd-rad-lg","style":"border-radius: 8px;"},{"media":"992px","selector":"lg-bd-rad-xl,","style":"border-radius: 12px;"},{"media":"992px","selector":"bd-rounded","style":"border-radius: 12px;"},{"media":"992px","selector":"lg-bd-rad-full,","style":"border-radius: 10000px;"},{"media":"992px","selector":"bd-pill","style":"border-radius: 10000px;"},{"media":"992px","selector":"lg-bdl-rad-xs","style":"border-radius: 2px 0 0 2px;"},{"media":"992px","selector":"lg-bdl-rad-sm,","style":"border-radius: 4px 0 0 4px;"},{"media":"992px","selector":"bdl-curved","style":"border-radius: 4px 0 0 4px;"},{"media":"992px","selector":"lg-bdl-rad-md","style":"border-radius: 6px 0 0 6px;"},{"media":"992px","selector":"lg-bdl-rad-lg","style":"border-radius: 8px 0 0 8px;"},{"media":"992px","selector":"lg-bdl-rad-xl,","style":"border-radius: 12px 0 0 12px;"},{"media":"992px","selector":"bdl-rounded","style":"border-radius: 12px 0 0 12px;"},{"media":"992px","selector":"lg-bdl-rad-full,","style":"border-radius: 10000px 0 0 10000px;"},{"media":"992px","selector":"bdl-pill","style":"border-radius: 10000px 0 0 10000px;"},{"media":"992px","selector":"lg-bdr-rad-xs","style":"border-radius: 0 2px 2px 0;"},{"media":"992px","selector":"lg-bdr-rad-sm,","style":"border-radius: 0 4px 4px 0;"},{"media":"992px","selector":"bdr-curved","style":"border-radius: 0 4px 4px 0;"},{"media":"992px","selector":"lg-bdr-rad-md","style":"border-radius: 0 6px 6px 0;"},{"media":"992px","selector":"lg-bdr-rad-lg","style":"border-radius: 0 8px 8px 0;"},{"media":"992px","selector":"lg-bdr-rad-xl,","style":"border-radius: 0 12px 12px 0;"},{"media":"992px","selector":"bdr-rounded","style":"border-radius: 0 12px 12px 0;"},{"media":"992px","selector":"lg-bdr-rad-full,","style":"border-radius: 0 10000px 10000px 0;"},{"media":"992px","selector":"bdr-pill","style":"border-radius: 0 10000px 10000px 0;"},{"media":"992px","selector":"lg-bdt-rad-xs","style":"border-radius: 2px 2px 0 0;"},{"media":"992px","selector":"lg-bdt-rad-sm,","style":"border-radius: 4px 4px 0 0;"},{"media":"992px","selector":"bdt-curved","style":"border-radius: 4px 4px 0 0;"},{"media":"992px","selector":"lg-bdt-rad-md","style":"border-radius: 6px 6px 0 0;"},{"media":"992px","selector":"lg-bdt-rad-lg","style":"border-radius: 8px 8px 0 0;"},{"media":"992px","selector":"lg-bdt-rad-xl,","style":"border-radius: 12px 12px 0 0;"},{"media":"992px","selector":"bdt-rounded","style":"border-radius: 12px 12px 0 0;"},{"media":"992px","selector":"lg-bdt-rad-full,","style":"border-radius: 10000px 10000px 0 0;"},{"media":"992px","selector":"bdt-pill","style":"border-radius: 10000px 10000px 0 0;"},{"media":"992px","selector":"lg-bdb-rad-xs","style":"border-radius: 2px 2px 0 0;"},{"media":"992px","selector":"lg-bdb-rad-sm,","style":"border-radius: 0 0 4px 4px;"},{"media":"992px","selector":"bdb-curved","style":"border-radius: 0 0 4px 4px;"},{"media":"992px","selector":"lg-bdb-rad-md","style":"border-radius: 0 0 6px 6px;"},{"media":"992px","selector":"lg-bdb-rad-lg","style":"border-radius: 0 0 8px 8px;"},{"media":"992px","selector":"lg-bdb-rad-xl,","style":"border-radius: 0 0 12px 12px;"},{"media":"992px","selector":"bdb-rounded","style":"border-radius: 0 0 12px 12px;"},{"media":"992px","selector":"lg-bdb-rad-full,","style":"border-radius: 0 0 10000px 10000px;"},{"media":"992px","selector":"bdb-pill","style":"border-radius: 0 0 10000px 10000px;"},{"media":"992px","selector":"lg-p-0","style":"padding: 0;"},{"media":"992px","selector":"lg-p-2","style":"padding: 2px;"},{"media":"992px","selector":"lg-p-4","style":"padding: 4px;"},{"media":"992px","selector":"lg-p-6","style":"padding: 6px;"},{"media":"992px","selector":"lg-p-8","style":"padding: 8px;"},{"media":"992px","selector":"lg-p-10","style":"padding: 10px;"},{"media":"992px","selector":"lg-p-12","style":"padding: 12px;"},{"media":"992px","selector":"lg-p-14","style":"padding: 14px;"},{"media":"992px","selector":"lg-p-16","style":"padding: 16px;"},{"media":"992px","selector":"lg-p-18","style":"padding: 18px;"},{"media":"992px","selector":"lg-p-20","style":"padding: 20px;"},{"media":"992px","selector":"lg-p-22","style":"padding: 22px;"},{"media":"992px","selector":"lg-p-24","style":"padding: 24px;"},{"media":"992px","selector":"lg-p-26","style":"padding: 26px;"},{"media":"992px","selector":"lg-p-28","style":"padding: 28px;"},{"media":"992px","selector":"lg-p-30","style":"padding: 30px;"},{"media":"992px","selector":"lg-p-32","style":"padding: 32px;"},{"media":"992px","selector":"lg-p-34","style":"padding: 34px;"},{"media":"992px","selector":"lg-p-36","style":"padding: 36px;"},{"media":"992px","selector":"lg-p-38","style":"padding: 38px;"},{"media":"992px","selector":"lg-p-40","style":"padding: 40px;"},{"media":"992px","selector":"lg-pl-0","style":"padding-left: 0;"},{"media":"992px","selector":"lg-pl-2","style":"padding-left: 2px;"},{"media":"992px","selector":"lg-pl-4","style":"padding-left: 4px;"},{"media":"992px","selector":"lg-pl-6","style":"padding-left: 6px;"},{"media":"992px","selector":"lg-pl-8","style":"padding-left: 8px;"},{"media":"992px","selector":"lg-pl-10","style":"padding-left: 10px;"},{"media":"992px","selector":"lg-pl-12","style":"padding-left: 12px;"},{"media":"992px","selector":"lg-pl-14","style":"padding-left: 14px;"},{"media":"992px","selector":"lg-pl-16","style":"padding-left: 16px;"},{"media":"992px","selector":"lg-pl-18","style":"padding-left: 18px;"},{"media":"992px","selector":"lg-pl-20","style":"padding-left: 20px;"},{"media":"992px","selector":"lg-pl-22","style":"padding-left: 22px;"},{"media":"992px","selector":"lg-pl-24","style":"padding-left: 24px;"},{"media":"992px","selector":"lg-pl-26","style":"padding-left: 26px;"},{"media":"992px","selector":"lg-pl-28","style":"padding-left: 28px;"},{"media":"992px","selector":"lg-pl-30","style":"padding-left: 30px;"},{"media":"992px","selector":"lg-pl-32","style":"padding-left: 32px;"},{"media":"992px","selector":"lg-pl-34","style":"padding-left: 34px;"},{"media":"992px","selector":"lg-pl-36","style":"padding-left: 36px;"},{"media":"992px","selector":"lg-pl-38","style":"padding-left: 38px;"},{"media":"992px","selector":"lg-pl-40","style":"padding-left: 40px;"},{"media":"992px","selector":"lg-pr-0","style":"padding-right: 0;"},{"media":"992px","selector":"lg-pr-2","style":"padding-right: 2px;"},{"media":"992px","selector":"lg-pr-4","style":"padding-right: 4px;"},{"media":"992px","selector":"lg-pr-6","style":"padding-right: 6px;"},{"media":"992px","selector":"lg-pr-8","style":"padding-right: 8px;"},{"media":"992px","selector":"lg-pr-10","style":"padding-right: 10px;"},{"media":"992px","selector":"lg-pr-12","style":"padding-right: 12px;"},{"media":"992px","selector":"lg-pr-14","style":"padding-right: 14px;"},{"media":"992px","selector":"lg-pr-16","style":"padding-right: 16px;"},{"media":"992px","selector":"lg-pr-18","style":"padding-right: 18px;"},{"media":"992px","selector":"lg-pr-20","style":"padding-right: 20px;"},{"media":"992px","selector":"lg-pr-22","style":"padding-right: 22px;"},{"media":"992px","selector":"lg-pr-24","style":"padding-right: 24px;"},{"media":"992px","selector":"lg-pr-26","style":"padding-right: 26px;"},{"media":"992px","selector":"lg-pr-28","style":"padding-right: 28px;"},{"media":"992px","selector":"lg-pr-30","style":"padding-right: 30px;"},{"media":"992px","selector":"lg-pr-32","style":"padding-right: 32px;"},{"media":"992px","selector":"lg-pr-34","style":"padding-right: 34px;"},{"media":"992px","selector":"lg-pr-36","style":"padding-right: 36px;"},{"media":"992px","selector":"lg-pr-38","style":"padding-right: 38px;"},{"media":"992px","selector":"lg-pr-40","style":"padding-right: 40px;"},{"media":"992px","selector":"lg-pt-0","style":"padding-top: 0;"},{"media":"992px","selector":"lg-pt-2","style":"padding-top: 2px;"},{"media":"992px","selector":"lg-pt-4","style":"padding-top: 4px;"},{"media":"992px","selector":"lg-pt-6","style":"padding-top: 6px;"},{"media":"992px","selector":"lg-pt-8","style":"padding-top: 8px;"},{"media":"992px","selector":"lg-pt-10","style":"padding-top: 10px;"},{"media":"992px","selector":"lg-pt-12","style":"padding-top: 12px;"},{"media":"992px","selector":"lg-pt-14","style":"padding-top: 14px;"},{"media":"992px","selector":"lg-pt-16","style":"padding-top: 16px;"},{"media":"992px","selector":"lg-pt-18","style":"padding-top: 18px;"},{"media":"992px","selector":"lg-pt-20","style":"padding-top: 20px;"},{"media":"992px","selector":"lg-pt-22","style":"padding-top: 22px;"},{"media":"992px","selector":"lg-pt-24","style":"padding-top: 24px;"},{"media":"992px","selector":"lg-pt-26","style":"padding-top: 26px;"},{"media":"992px","selector":"lg-pt-28","style":"padding-top: 28px;"},{"media":"992px","selector":"lg-pt-30","style":"padding-top: 30px;"},{"media":"992px","selector":"lg-pt-32","style":"padding-top: 32px;"},{"media":"992px","selector":"lg-pt-34","style":"padding-top: 34px;"},{"media":"992px","selector":"lg-pt-36","style":"padding-top: 36px;"},{"media":"992px","selector":"lg-pt-38","style":"padding-top: 38px;"},{"media":"992px","selector":"lg-pt-40","style":"padding-top: 40px;"},{"media":"992px","selector":"lg-pb-0","style":"padding-bottom: 0;"},{"media":"992px","selector":"lg-pb-2","style":"padding-bottom: 2px;"},{"media":"992px","selector":"lg-pb-4","style":"padding-bottom: 4px;"},{"media":"992px","selector":"lg-pb-6","style":"padding-bottom: 6px;"},{"media":"992px","selector":"lg-pb-8","style":"padding-bottom: 8px;"},{"media":"992px","selector":"lg-pb-10","style":"padding-bottom: 10px;"},{"media":"992px","selector":"lg-pb-12","style":"padding-bottom: 12px;"},{"media":"992px","selector":"lg-pb-14","style":"padding-bottom: 14px;"},{"media":"992px","selector":"lg-pb-16","style":"padding-bottom: 16px;"},{"media":"992px","selector":"lg-pb-18","style":"padding-bottom: 18px;"},{"media":"992px","selector":"lg-pb-20","style":"padding-bottom: 20px;"},{"media":"992px","selector":"lg-pb-22","style":"padding-bottom: 22px;"},{"media":"992px","selector":"lg-pb-24","style":"padding-bottom: 24px;"},{"media":"992px","selector":"lg-pb-26","style":"padding-bottom: 26px;"},{"media":"992px","selector":"lg-pb-28","style":"padding-bottom: 28px;"},{"media":"992px","selector":"lg-pb-30","style":"padding-bottom: 30px;"},{"media":"992px","selector":"lg-pb-32","style":"padding-bottom: 32px;"},{"media":"992px","selector":"lg-pb-34","style":"padding-bottom: 34px;"},{"media":"992px","selector":"lg-pb-36","style":"padding-bottom: 36px;"},{"media":"992px","selector":"lg-pb-38","style":"padding-bottom: 38px;"},{"media":"992px","selector":"lg-pb-40","style":"padding-bottom: 40px;"},{"media":"992px","selector":"lg-m-0","style":"margin: 0;"},{"media":"992px","selector":"lg-m-2","style":"margin: 2px;"},{"media":"992px","selector":"lg-m-4","style":"margin: 4px;"},{"media":"992px","selector":"lg-m-6","style":"margin: 6px;"},{"media":"992px","selector":"lg-m-8","style":"margin: 8px;"},{"media":"992px","selector":"lg-m-10","style":"margin: 10px;"},{"media":"992px","selector":"lg-m-12","style":"margin: 12px;"},{"media":"992px","selector":"lg-m-14","style":"margin: 14px;"},{"media":"992px","selector":"lg-m-16","style":"margin: 16px;"},{"media":"992px","selector":"lg-m-18","style":"margin: 18px;"},{"media":"992px","selector":"lg-m-20","style":"margin: 20px;"},{"media":"992px","selector":"lg-m-22","style":"margin: 22px;"},{"media":"992px","selector":"lg-m-24","style":"margin: 24px;"},{"media":"992px","selector":"lg-m-26","style":"margin: 26px;"},{"media":"992px","selector":"lg-m-28","style":"margin: 28px;"},{"media":"992px","selector":"lg-m-30","style":"margin: 30px;"},{"media":"992px","selector":"lg-m-32","style":"margin: 32px;"},{"media":"992px","selector":"lg-m-34","style":"margin: 34px;"},{"media":"992px","selector":"lg-m-36","style":"margin: 36px;"},{"media":"992px","selector":"lg-m-38","style":"margin: 38px;"},{"media":"992px","selector":"lg-m-40","style":"margin: 40px;"},{"media":"992px","selector":"lg-ml-0","style":"margin-left: 0;"},{"media":"992px","selector":"lg-ml-2","style":"margin-left: 2px;"},{"media":"992px","selector":"lg-ml-4","style":"margin-left: 4px;"},{"media":"992px","selector":"lg-ml-6","style":"margin-left: 6px;"},{"media":"992px","selector":"lg-ml-8","style":"margin-left: 8px;"},{"media":"992px","selector":"lg-ml-10","style":"margin-left: 10px;"},{"media":"992px","selector":"lg-ml-12","style":"margin-left: 12px;"},{"media":"992px","selector":"lg-ml-14","style":"margin-left: 14px;"},{"media":"992px","selector":"lg-ml-16","style":"margin-left: 16px;"},{"media":"992px","selector":"lg-ml-18","style":"margin-left: 18px;"},{"media":"992px","selector":"lg-ml-20","style":"margin-left: 20px;"},{"media":"992px","selector":"lg-ml-22","style":"margin-left: 22px;"},{"media":"992px","selector":"lg-ml-24","style":"margin-left: 24px;"},{"media":"992px","selector":"lg-ml-26","style":"margin-left: 26px;"},{"media":"992px","selector":"lg-ml-28","style":"margin-left: 28px;"},{"media":"992px","selector":"lg-ml-30","style":"margin-left: 30px;"},{"media":"992px","selector":"lg-ml-32","style":"margin-left: 32px;"},{"media":"992px","selector":"lg-ml-34","style":"margin-left: 34px;"},{"media":"992px","selector":"lg-ml-36","style":"margin-left: 36px;"},{"media":"992px","selector":"lg-ml-38","style":"margin-left: 38px;"},{"media":"992px","selector":"lg-ml-40","style":"margin-left: 40px;"},{"media":"992px","selector":"lg-mr-0","style":"margin-right: 0;"},{"media":"992px","selector":"lg-mr-2","style":"margin-right: 2px;"},{"media":"992px","selector":"lg-mr-4","style":"margin-right: 4px;"},{"media":"992px","selector":"lg-mr-6","style":"margin-right: 6px;"},{"media":"992px","selector":"lg-mr-8","style":"margin-right: 8px;"},{"media":"992px","selector":"lg-mr-10","style":"margin-right: 10px;"},{"media":"992px","selector":"lg-mr-12","style":"margin-right: 12px;"},{"media":"992px","selector":"lg-mr-14","style":"margin-right: 14px;"},{"media":"992px","selector":"lg-mr-16","style":"margin-right: 16px;"},{"media":"992px","selector":"lg-mr-18","style":"margin-right: 18px;"},{"media":"992px","selector":"lg-mr-20","style":"margin-right: 20px;"},{"media":"992px","selector":"lg-mr-22","style":"margin-right: 22px;"},{"media":"992px","selector":"lg-mr-24","style":"margin-right: 24px;"},{"media":"992px","selector":"lg-mr-26","style":"margin-right: 26px;"},{"media":"992px","selector":"lg-mr-28","style":"margin-right: 28px;"},{"media":"992px","selector":"lg-mr-30","style":"margin-right: 30px;"},{"media":"992px","selector":"lg-mr-32","style":"margin-right: 32px;"},{"media":"992px","selector":"lg-mr-34","style":"margin-right: 34px;"},{"media":"992px","selector":"lg-mr-36","style":"margin-right: 36px;"},{"media":"992px","selector":"lg-mr-38","style":"margin-right: 38px;"},{"media":"992px","selector":"lg-mr-40","style":"margin-right: 40px;"},{"media":"992px","selector":"lg-mt-0","style":"margin-top: 0;"},{"media":"992px","selector":"lg-mt-2","style":"margin-top: 2px;"},{"media":"992px","selector":"lg-mt-4","style":"margin-top: 4px;"},{"media":"992px","selector":"lg-mt-6","style":"margin-top: 6px;"},{"media":"992px","selector":"lg-mt-8","style":"margin-top: 8px;"},{"media":"992px","selector":"lg-mt-10","style":"margin-top: 10px;"},{"media":"992px","selector":"lg-mt-12","style":"margin-top: 12px;"},{"media":"992px","selector":"lg-mt-14","style":"margin-top: 14px;"},{"media":"992px","selector":"lg-mt-16","style":"margin-top: 16px;"},{"media":"992px","selector":"lg-mt-18","style":"margin-top: 18px;"},{"media":"992px","selector":"lg-mt-20","style":"margin-top: 20px;"},{"media":"992px","selector":"lg-mt-22","style":"margin-top: 22px;"},{"media":"992px","selector":"lg-mt-24","style":"margin-top: 24px;"},{"media":"992px","selector":"lg-mt-26","style":"margin-top: 26px;"},{"media":"992px","selector":"lg-mt-28","style":"margin-top: 28px;"},{"media":"992px","selector":"lg-mt-30","style":"margin-top: 30px;"},{"media":"992px","selector":"lg-mt-32","style":"margin-top: 32px;"},{"media":"992px","selector":"lg-mt-34","style":"margin-top: 34px;"},{"media":"992px","selector":"lg-mt-36","style":"margin-top: 36px;"},{"media":"992px","selector":"lg-mt-38","style":"margin-top: 38px;"},{"media":"992px","selector":"lg-mt-40","style":"margin-top: 40px;"},{"media":"992px","selector":"lg-mb-0","style":"margin-bottom: 0;"},{"media":"992px","selector":"lg-mb-2","style":"margin-bottom: 2px;"},{"media":"992px","selector":"lg-mb-4","style":"margin-bottom: 4px;"},{"media":"992px","selector":"lg-mb-6","style":"margin-bottom: 6px;"},{"media":"992px","selector":"lg-mb-8","style":"margin-bottom: 8px;"},{"media":"992px","selector":"lg-mb-10","style":"margin-bottom: 10px;"},{"media":"992px","selector":"lg-mb-12","style":"margin-bottom: 12px;"},{"media":"992px","selector":"lg-mb-14","style":"margin-bottom: 14px;"},{"media":"992px","selector":"lg-mb-16","style":"margin-bottom: 16px;"},{"media":"992px","selector":"lg-mb-18","style":"margin-bottom: 18px;"},{"media":"992px","selector":"lg-mb-20","style":"margin-bottom: 20px;"},{"media":"992px","selector":"lg-mb-22","style":"margin-bottom: 22px;"},{"media":"992px","selector":"lg-mb-24","style":"margin-bottom: 24px;"},{"media":"992px","selector":"lg-mb-26","style":"margin-bottom: 26px;"},{"media":"992px","selector":"lg-mb-28","style":"margin-bottom: 28px;"},{"media":"992px","selector":"lg-mb-30","style":"margin-bottom: 30px;"},{"media":"992px","selector":"lg-mb-32","style":"margin-bottom: 32px;"},{"media":"992px","selector":"lg-mb-34","style":"margin-bottom: 34px;"},{"media":"992px","selector":"lg-mb-36","style":"margin-bottom: 36px;"},{"media":"992px","selector":"lg-mb-38","style":"margin-bottom: 38px;"},{"media":"992px","selector":"lg-mb-40","style":"margin-bottom: 40px;"},{"media":"767px","selector":"md-none","style":"display: none;"},{"media":"767px","selector":"md-block","style":"display: block;"},{"media":"767px","selector":"md-flex","style":"display: flex;"},{"media":"767px","selector":"md-inline","style":"display: inline;"},{"media":"767px","selector":"md-inline-block","style":"display: inline-block;"},{"media":"767px","selector":"md-icy","style":"opacity: 0.85;"},{"media":"767px","selector":"md-glassy","style":"opacity: 0.5;"},{"media":"767px","selector":"md-ghostly","style":"opacity: 0.25;"},{"media":"767px","selector":"md-transparent","style":"opacity: 0;"},{"media":"767px","selector":"md-hidden","style":"visibility: hidden;"},{"media":"767px","selector":"md-flex-row","style":"flex-direction: row;"},{"media":"767px","selector":"md-flex-col","style":"flex-direction: column;"},{"media":"767px","selector":"md-flex-grow","style":"flex-grow: 1;"},{"media":"767px","selector":"md-flex-wrap","style":"flex-wrap: wrap;"},{"media":"767px","selector":"md-flex-center","style":"align-items: center; justify-content: center;"},{"media":"767px","selector":"md-flex-x-center","style":"align-items: center;"},{"media":"767px","selector":"md-flex-y-center","style":"justify-content: center;"},{"media":"767px","selector":"md-h-10","style":"height: 10px;"},{"media":"767px","selector":"md-h-12","style":"height: 12px;"},{"media":"767px","selector":"md-h-15","style":"height: 15px;"},{"media":"767px","selector":"md-h-16","style":"height: 16px;"},{"media":"767px","selector":"md-h-20","style":"height: 20px;"},{"media":"767px","selector":"md-h-24","style":"height: 24px;"},{"media":"767px","selector":"md-h-25","style":"height: 25px;"},{"media":"767px","selector":"md-h-30","style":"height: 30px;"},{"media":"767px","selector":"md-h-32","style":"height: 32px;"},{"media":"767px","selector":"md-h-35","style":"height: 35px;"},{"media":"767px","selector":"md-h-36","style":"height: 36px;"},{"media":"767px","selector":"md-h-40","style":"height: 40px;"},{"media":"767px","selector":"md-h-45","style":"height: 45px;"},{"media":"767px","selector":"md-h-48","style":"height: 48px;"},{"media":"767px","selector":"md-h-50","style":"height: 50px;"},{"media":"767px","selector":"md-h-55","style":"height: 55px;"},{"media":"767px","selector":"md-h-60","style":"height: 60px;"},{"media":"767px","selector":"md-h-64","style":"height: 64px;"},{"media":"767px","selector":"md-h-65","style":"height: 65px;"},{"media":"767px","selector":"md-h-70","style":"height: 70px;"},{"media":"767px","selector":"md-h-75","style":"height: 75px;"},{"media":"767px","selector":"md-h-80","style":"height: 80px;"},{"media":"767px","selector":"md-h-85","style":"height: 85px;"},{"media":"767px","selector":"md-h-90","style":"height: 90px;"},{"media":"767px","selector":"md-h-95","style":"height: 95px;"},{"media":"767px","selector":"md-h-96","style":"height: 96px;"},{"media":"767px","selector":"md-h-100","style":"height: 100px;"},{"media":"767px","selector":"md-h-110","style":"height: 110px;"},{"media":"767px","selector":"md-h-120","style":"height: 120px;"},{"media":"767px","selector":"md-h-130","style":"height: 130px;"},{"media":"767px","selector":"md-h-140","style":"height: 140px;"},{"media":"767px","selector":"md-h-150","style":"height: 150px;"},{"media":"767px","selector":"md-h-160","style":"height: 160px;"},{"media":"767px","selector":"md-h-170","style":"height: 170px;"},{"media":"767px","selector":"md-h-180","style":"height: 180px;"},{"media":"767px","selector":"md-h-190","style":"height: 190px;"},{"media":"767px","selector":"md-h-200","style":"height: 200px;"},{"media":"767px","selector":"md-h-220","style":"height: 220px;"},{"media":"767px","selector":"md-h-240","style":"height: 240px;"},{"media":"767px","selector":"md-h-260","style":"height: 260px;"},{"media":"767px","selector":"md-h-280","style":"height: 280px;"},{"media":"767px","selector":"md-h-300","style":"height: 300px;"},{"media":"767px","selector":"md-h-320","style":"height: 320px;"},{"media":"767px","selector":"md-h-340","style":"height: 340px;"},{"media":"767px","selector":"md-h-360","style":"height: 360px;"},{"media":"767px","selector":"md-h-full","style":"height: 100%;"},{"media":"767px","selector":"md-w-10","style":"width: 10px;"},{"media":"767px","selector":"md-w-12","style":"width: 12px;"},{"media":"767px","selector":"md-w-15","style":"width: 15px;"},{"media":"767px","selector":"md-w-16","style":"width: 16px;"},{"media":"767px","selector":"md-w-20","style":"width: 20px;"},{"media":"767px","selector":"md-w-24","style":"width: 24px;"},{"media":"767px","selector":"md-w-25","style":"width: 25px;"},{"media":"767px","selector":"md-w-30","style":"width: 30px;"},{"media":"767px","selector":"md-w-32","style":"width: 32px;"},{"media":"767px","selector":"md-w-35","style":"width: 35px;"},{"media":"767px","selector":"md-w-36","style":"width: 36px;"},{"media":"767px","selector":"md-w-40","style":"width: 40px;"},{"media":"767px","selector":"md-w-45","style":"width: 45px;"},{"media":"767px","selector":"md-w-48","style":"width: 48px;"},{"media":"767px","selector":"md-w-50","style":"width: 50px;"},{"media":"767px","selector":"md-w-55","style":"width: 55px;"},{"media":"767px","selector":"md-w-60","style":"width: 60px;"},{"media":"767px","selector":"md-w-64","style":"width: 64px;"},{"media":"767px","selector":"md-w-65","style":"width: 65px;"},{"media":"767px","selector":"md-w-70","style":"width: 70px;"},{"media":"767px","selector":"md-w-75","style":"width: 75px;"},{"media":"767px","selector":"md-w-80","style":"width: 80px;"},{"media":"767px","selector":"md-w-85","style":"width: 85px;"},{"media":"767px","selector":"md-w-90","style":"width: 90px;"},{"media":"767px","selector":"md-w-95","style":"width: 95px;"},{"media":"767px","selector":"md-w-96","style":"width: 96px;"},{"media":"767px","selector":"md-w-100","style":"width: 100px;"},{"media":"767px","selector":"md-w-110","style":"width: 110px;"},{"media":"767px","selector":"md-w-120","style":"width: 120px;"},{"media":"767px","selector":"md-w-130","style":"width: 130px;"},{"media":"767px","selector":"md-w-140","style":"width: 140px;"},{"media":"767px","selector":"md-w-150","style":"width: 150px;"},{"media":"767px","selector":"md-w-160","style":"width: 160px;"},{"media":"767px","selector":"md-w-170","style":"width: 170px;"},{"media":"767px","selector":"md-w-180","style":"width: 180px;"},{"media":"767px","selector":"md-w-190","style":"width: 190px;"},{"media":"767px","selector":"md-w-200","style":"width: 200px;"},{"media":"767px","selector":"md-w-220","style":"width: 220px;"},{"media":"767px","selector":"md-w-240","style":"width: 240px;"},{"media":"767px","selector":"md-w-260","style":"width: 260px;"},{"media":"767px","selector":"md-w-280","style":"width: 280px;"},{"media":"767px","selector":"md-w-300","style":"width: 300px;"},{"media":"767px","selector":"md-w-320","style":"width: 320px;"},{"media":"767px","selector":"md-w-340","style":"width: 340px;"},{"media":"767px","selector":"md-w-360","style":"width: 360px;"},{"media":"767px","selector":"md-w-full","style":"width: 100%;"},{"media":"767px","selector":"md-mw-xs","style":"max-width: 360px;"},{"media":"767px","selector":"md-mw-xs","style":"max-width: 420px;"},{"media":"767px","selector":"md-mw-md","style":"max-width: 767px;"},{"media":"767px","selector":"md-mw-lg","style":"max-width: 992px;"},{"media":"767px","selector":"md-mw-xl","style":"max-width: 1024px;"},{"media":"767px","selector":"md-mw-full","style":"max-width: 100%;"},{"media":"767px","selector":"md-tx-2xs","style":"font-size: 8px;"},{"media":"767px","selector":"md-tx-xs","style":"font-size: 10px;"},{"media":"767px","selector":"md-tx-sm","style":"font-size: 12px;"},{"media":"767px","selector":"md-tx-md","style":"font-size: 14px;"},{"media":"767px","selector":"md-tx-lg","style":"font-size: 16px;"},{"media":"767px","selector":"md-tx-xl","style":"font-size: 18px;"},{"media":"767px","selector":"md-tx-2xl","style":"font-size: 20px;"},{"media":"767px","selector":"md-tx-3xl","style":"font-size: 22px;"},{"media":"767px","selector":"md-tx-4xl","style":"font-size: 24px;"},{"media":"767px","selector":"md-tx-5xl","style":"font-size: 26px;"},{"media":"767px","selector":"md-tx-6xl","style":"font-size: 28px;"},{"media":"767px","selector":"md-tx-7xl","style":"font-size: 30px;"},{"media":"767px","selector":"md-tx-center","style":"text-align: center;"},{"media":"767px","selector":"md-tx-left","style":"text-align: left;"},{"media":"767px","selector":"md-tx-right","style":"text-align: right;"},{"media":"767px","selector":"md-tx-bold","style":"font-weight: bold;"},{"media":"767px","selector":"md-tx-normal","style":"font-weight: normal;"},{"media":"767px","selector":"md-tx-italic","style":"font-style: italic;"},{"media":"767px","selector":"md-tx-uppercase","style":"text-transform: uppercase;"},{"media":"767px","selector":"md-tx-underline","style":"text-decoration: underline;"},{"media":"767px","selector":"md-tx-nowrap","style":"white-space: nowrap;"},{"media":"767px","selector":"md-bd-solid","style":"border-style: solid;"},{"media":"767px","selector":"md-bd-dash","style":"border-style: dashed;"},{"media":"767px","selector":"md-bd-dotted","style":"border-style: dotted;"},{"media":"767px","selector":"md-bd","style":"border: 1px solid var(--black);"},{"media":"767px","selector":"md-bdt","style":"border-top: 1px solid var(--black);"},{"media":"767px","selector":"md-bdb","style":"border-bottom: 1px solid var(--black);"},{"media":"767px","selector":"md-bdl","style":"border-left: 1px solid var(--black);"},{"media":"767px","selector":"md-bdr","style":"border-right: 1px solid var(--black);"},{"media":"767px","selector":"md-bd-xs","style":"border-width: 1px;"},{"media":"767px","selector":"md-bd-sm","style":"border-width: 2px;"},{"media":"767px","selector":"md-bd-md","style":"border-width: 3px;"},{"media":"767px","selector":"md-bd-lg","style":"border-width: 4px;"},{"media":"767px","selector":"md-bd-xl","style":"border-width: 5px;"},{"media":"767px","selector":"md-bdt-xs","style":"border-top-width: 1px;"},{"media":"767px","selector":"md-bdt-sm","style":"border-top-width: 2px;"},{"media":"767px","selector":"md-bdt-md","style":"border-top-width: 3px;"},{"media":"767px","selector":"md-bdt-lg","style":"border-top-width: 4px;"},{"media":"767px","selector":"md-bdt-xl","style":"border-top-width: 5px;"},{"media":"767px","selector":"md-bdb-xs","style":"border-bottom-width: 1px;"},{"media":"767px","selector":"md-bdb-sm","style":"border-bottom-width: 2px;"},{"media":"767px","selector":"md-bdb-md","style":"border-bottom-width: 3px;"},{"media":"767px","selector":"md-bdb-lg","style":"border-bottom-width: 4px;"},{"media":"767px","selector":"md-bdb-xl","style":"border-bottom-width: 5px;"},{"media":"767px","selector":"md-bdl-xs","style":"border-left-width: 1px;"},{"media":"767px","selector":"md-bdl-sm","style":"border-left-width: 2px;"},{"media":"767px","selector":"md-bdl-md","style":"border-left-width: 3px;"},{"media":"767px","selector":"md-bdl-lg","style":"border-left-width: 4px;"},{"media":"767px","selector":"md-bdl-xl","style":"border-left-width: 5px;"},{"media":"767px","selector":"md-bdr-xs","style":"border-right-width: 1px;"},{"media":"767px","selector":"md-bdr-sm","style":"border-right-width: 2px;"},{"media":"767px","selector":"md-bdr-md","style":"border-right-width: 3px;"},{"media":"767px","selector":"md-bdr-lg","style":"border-right-width: 4px;"},{"media":"767px","selector":"md-bdr-xl","style":"border-right-width: 5px;"},{"media":"767px","selector":"md-bd-rad-xs","style":"border-radius: 2px;"},{"media":"767px","selector":"md-bd-rad-sm,","style":"border-radius: 4px;"},{"media":"767px","selector":"bd-curved","style":"border-radius: 4px;"},{"media":"767px","selector":"md-bd-rad-md","style":"border-radius: 6px;"},{"media":"767px","selector":"md-bd-rad-lg","style":"border-radius: 8px;"},{"media":"767px","selector":"md-bd-rad-xl,","style":"border-radius: 12px;"},{"media":"767px","selector":"bd-rounded","style":"border-radius: 12px;"},{"media":"767px","selector":"md-bd-rad-full,","style":"border-radius: 10000px;"},{"media":"767px","selector":"bd-pill","style":"border-radius: 10000px;"},{"media":"767px","selector":"md-bdl-rad-xs","style":"border-radius: 2px 0 0 2px;"},{"media":"767px","selector":"md-bdl-rad-sm,","style":"border-radius: 4px 0 0 4px;"},{"media":"767px","selector":"bdl-curved","style":"border-radius: 4px 0 0 4px;"},{"media":"767px","selector":"md-bdl-rad-md","style":"border-radius: 6px 0 0 6px;"},{"media":"767px","selector":"md-bdl-rad-lg","style":"border-radius: 8px 0 0 8px;"},{"media":"767px","selector":"md-bdl-rad-xl,","style":"border-radius: 12px 0 0 12px;"},{"media":"767px","selector":"bdl-rounded","style":"border-radius: 12px 0 0 12px;"},{"media":"767px","selector":"md-bdl-rad-full,","style":"border-radius: 10000px 0 0 10000px;"},{"media":"767px","selector":"bdl-pill","style":"border-radius: 10000px 0 0 10000px;"},{"media":"767px","selector":"md-bdr-rad-xs","style":"border-radius: 0 2px 2px 0;"},{"media":"767px","selector":"md-bdr-rad-sm,","style":"border-radius: 0 4px 4px 0;"},{"media":"767px","selector":"bdr-curved","style":"border-radius: 0 4px 4px 0;"},{"media":"767px","selector":"md-bdr-rad-md","style":"border-radius: 0 6px 6px 0;"},{"media":"767px","selector":"md-bdr-rad-lg","style":"border-radius: 0 8px 8px 0;"},{"media":"767px","selector":"md-bdr-rad-xl,","style":"border-radius: 0 12px 12px 0;"},{"media":"767px","selector":"bdr-rounded","style":"border-radius: 0 12px 12px 0;"},{"media":"767px","selector":"md-bdr-rad-full,","style":"border-radius: 0 10000px 10000px 0;"},{"media":"767px","selector":"bdr-pill","style":"border-radius: 0 10000px 10000px 0;"},{"media":"767px","selector":"md-bdt-rad-xs","style":"border-radius: 2px 2px 0 0;"},{"media":"767px","selector":"md-bdt-rad-sm,","style":"border-radius: 4px 4px 0 0;"},{"media":"767px","selector":"bdt-curved","style":"border-radius: 4px 4px 0 0;"},{"media":"767px","selector":"md-bdt-rad-md","style":"border-radius: 6px 6px 0 0;"},{"media":"767px","selector":"md-bdt-rad-lg","style":"border-radius: 8px 8px 0 0;"},{"media":"767px","selector":"md-bdt-rad-xl,","style":"border-radius: 12px 12px 0 0;"},{"media":"767px","selector":"bdt-rounded","style":"border-radius: 12px 12px 0 0;"},{"media":"767px","selector":"md-bdt-rad-full,","style":"border-radius: 10000px 10000px 0 0;"},{"media":"767px","selector":"bdt-pill","style":"border-radius: 10000px 10000px 0 0;"},{"media":"767px","selector":"md-bdb-rad-xs","style":"border-radius: 2px 2px 0 0;"},{"media":"767px","selector":"md-bdb-rad-sm,","style":"border-radius: 0 0 4px 4px;"},{"media":"767px","selector":"bdb-curved","style":"border-radius: 0 0 4px 4px;"},{"media":"767px","selector":"md-bdb-rad-md","style":"border-radius: 0 0 6px 6px;"},{"media":"767px","selector":"md-bdb-rad-lg","style":"border-radius: 0 0 8px 8px;"},{"media":"767px","selector":"md-bdb-rad-xl,","style":"border-radius: 0 0 12px 12px;"},{"media":"767px","selector":"bdb-rounded","style":"border-radius: 0 0 12px 12px;"},{"media":"767px","selector":"md-bdb-rad-full,","style":"border-radius: 0 0 10000px 10000px;"},{"media":"767px","selector":"bdb-pill","style":"border-radius: 0 0 10000px 10000px;"},{"media":"767px","selector":"md-p-0","style":"padding: 0;"},{"media":"767px","selector":"md-p-2","style":"padding: 2px;"},{"media":"767px","selector":"md-p-4","style":"padding: 4px;"},{"media":"767px","selector":"md-p-6","style":"padding: 6px;"},{"media":"767px","selector":"md-p-8","style":"padding: 8px;"},{"media":"767px","selector":"md-p-10","style":"padding: 10px;"},{"media":"767px","selector":"md-p-12","style":"padding: 12px;"},{"media":"767px","selector":"md-p-14","style":"padding: 14px;"},{"media":"767px","selector":"md-p-16","style":"padding: 16px;"},{"media":"767px","selector":"md-p-18","style":"padding: 18px;"},{"media":"767px","selector":"md-p-20","style":"padding: 20px;"},{"media":"767px","selector":"md-p-22","style":"padding: 22px;"},{"media":"767px","selector":"md-p-24","style":"padding: 24px;"},{"media":"767px","selector":"md-p-26","style":"padding: 26px;"},{"media":"767px","selector":"md-p-28","style":"padding: 28px;"},{"media":"767px","selector":"md-p-30","style":"padding: 30px;"},{"media":"767px","selector":"md-p-32","style":"padding: 32px;"},{"media":"767px","selector":"md-p-34","style":"padding: 34px;"},{"media":"767px","selector":"md-p-36","style":"padding: 36px;"},{"media":"767px","selector":"md-p-38","style":"padding: 38px;"},{"media":"767px","selector":"md-p-40","style":"padding: 40px;"},{"media":"767px","selector":"md-pl-0","style":"padding-left: 0;"},{"media":"767px","selector":"md-pl-2","style":"padding-left: 2px;"},{"media":"767px","selector":"md-pl-4","style":"padding-left: 4px;"},{"media":"767px","selector":"md-pl-6","style":"padding-left: 6px;"},{"media":"767px","selector":"md-pl-8","style":"padding-left: 8px;"},{"media":"767px","selector":"md-pl-10","style":"padding-left: 10px;"},{"media":"767px","selector":"md-pl-12","style":"padding-left: 12px;"},{"media":"767px","selector":"md-pl-14","style":"padding-left: 14px;"},{"media":"767px","selector":"md-pl-16","style":"padding-left: 16px;"},{"media":"767px","selector":"md-pl-18","style":"padding-left: 18px;"},{"media":"767px","selector":"md-pl-20","style":"padding-left: 20px;"},{"media":"767px","selector":"md-pl-22","style":"padding-left: 22px;"},{"media":"767px","selector":"md-pl-24","style":"padding-left: 24px;"},{"media":"767px","selector":"md-pl-26","style":"padding-left: 26px;"},{"media":"767px","selector":"md-pl-28","style":"padding-left: 28px;"},{"media":"767px","selector":"md-pl-30","style":"padding-left: 30px;"},{"media":"767px","selector":"md-pl-32","style":"padding-left: 32px;"},{"media":"767px","selector":"md-pl-34","style":"padding-left: 34px;"},{"media":"767px","selector":"md-pl-36","style":"padding-left: 36px;"},{"media":"767px","selector":"md-pl-38","style":"padding-left: 38px;"},{"media":"767px","selector":"md-pl-40","style":"padding-left: 40px;"},{"media":"767px","selector":"md-pr-0","style":"padding-right: 0;"},{"media":"767px","selector":"md-pr-2","style":"padding-right: 2px;"},{"media":"767px","selector":"md-pr-4","style":"padding-right: 4px;"},{"media":"767px","selector":"md-pr-6","style":"padding-right: 6px;"},{"media":"767px","selector":"md-pr-8","style":"padding-right: 8px;"},{"media":"767px","selector":"md-pr-10","style":"padding-right: 10px;"},{"media":"767px","selector":"md-pr-12","style":"padding-right: 12px;"},{"media":"767px","selector":"md-pr-14","style":"padding-right: 14px;"},{"media":"767px","selector":"md-pr-16","style":"padding-right: 16px;"},{"media":"767px","selector":"md-pr-18","style":"padding-right: 18px;"},{"media":"767px","selector":"md-pr-20","style":"padding-right: 20px;"},{"media":"767px","selector":"md-pr-22","style":"padding-right: 22px;"},{"media":"767px","selector":"md-pr-24","style":"padding-right: 24px;"},{"media":"767px","selector":"md-pr-26","style":"padding-right: 26px;"},{"media":"767px","selector":"md-pr-28","style":"padding-right: 28px;"},{"media":"767px","selector":"md-pr-30","style":"padding-right: 30px;"},{"media":"767px","selector":"md-pr-32","style":"padding-right: 32px;"},{"media":"767px","selector":"md-pr-34","style":"padding-right: 34px;"},{"media":"767px","selector":"md-pr-36","style":"padding-right: 36px;"},{"media":"767px","selector":"md-pr-38","style":"padding-right: 38px;"},{"media":"767px","selector":"md-pr-40","style":"padding-right: 40px;"},{"media":"767px","selector":"md-pt-0","style":"padding-top: 0;"},{"media":"767px","selector":"md-pt-2","style":"padding-top: 2px;"},{"media":"767px","selector":"md-pt-4","style":"padding-top: 4px;"},{"media":"767px","selector":"md-pt-6","style":"padding-top: 6px;"},{"media":"767px","selector":"md-pt-8","style":"padding-top: 8px;"},{"media":"767px","selector":"md-pt-10","style":"padding-top: 10px;"},{"media":"767px","selector":"md-pt-12","style":"padding-top: 12px;"},{"media":"767px","selector":"md-pt-14","style":"padding-top: 14px;"},{"media":"767px","selector":"md-pt-16","style":"padding-top: 16px;"},{"media":"767px","selector":"md-pt-18","style":"padding-top: 18px;"},{"media":"767px","selector":"md-pt-20","style":"padding-top: 20px;"},{"media":"767px","selector":"md-pt-22","style":"padding-top: 22px;"},{"media":"767px","selector":"md-pt-24","style":"padding-top: 24px;"},{"media":"767px","selector":"md-pt-26","style":"padding-top: 26px;"},{"media":"767px","selector":"md-pt-28","style":"padding-top: 28px;"},{"media":"767px","selector":"md-pt-30","style":"padding-top: 30px;"},{"media":"767px","selector":"md-pt-32","style":"padding-top: 32px;"},{"media":"767px","selector":"md-pt-34","style":"padding-top: 34px;"},{"media":"767px","selector":"md-pt-36","style":"padding-top: 36px;"},{"media":"767px","selector":"md-pt-38","style":"padding-top: 38px;"},{"media":"767px","selector":"md-pt-40","style":"padding-top: 40px;"},{"media":"767px","selector":"md-pb-0","style":"padding-bottom: 0;"},{"media":"767px","selector":"md-pb-2","style":"padding-bottom: 2px;"},{"media":"767px","selector":"md-pb-4","style":"padding-bottom: 4px;"},{"media":"767px","selector":"md-pb-6","style":"padding-bottom: 6px;"},{"media":"767px","selector":"md-pb-8","style":"padding-bottom: 8px;"},{"media":"767px","selector":"md-pb-10","style":"padding-bottom: 10px;"},{"media":"767px","selector":"md-pb-12","style":"padding-bottom: 12px;"},{"media":"767px","selector":"md-pb-14","style":"padding-bottom: 14px;"},{"media":"767px","selector":"md-pb-16","style":"padding-bottom: 16px;"},{"media":"767px","selector":"md-pb-18","style":"padding-bottom: 18px;"},{"media":"767px","selector":"md-pb-20","style":"padding-bottom: 20px;"},{"media":"767px","selector":"md-pb-22","style":"padding-bottom: 22px;"},{"media":"767px","selector":"md-pb-24","style":"padding-bottom: 24px;"},{"media":"767px","selector":"md-pb-26","style":"padding-bottom: 26px;"},{"media":"767px","selector":"md-pb-28","style":"padding-bottom: 28px;"},{"media":"767px","selector":"md-pb-30","style":"padding-bottom: 30px;"},{"media":"767px","selector":"md-pb-32","style":"padding-bottom: 32px;"},{"media":"767px","selector":"md-pb-34","style":"padding-bottom: 34px;"},{"media":"767px","selector":"md-pb-36","style":"padding-bottom: 36px;"},{"media":"767px","selector":"md-pb-38","style":"padding-bottom: 38px;"},{"media":"767px","selector":"md-pb-40","style":"padding-bottom: 40px;"},{"media":"767px","selector":"md-m-0","style":"margin: 0;"},{"media":"767px","selector":"md-m-2","style":"margin: 2px;"},{"media":"767px","selector":"md-m-4","style":"margin: 4px;"},{"media":"767px","selector":"md-m-6","style":"margin: 6px;"},{"media":"767px","selector":"md-m-8","style":"margin: 8px;"},{"media":"767px","selector":"md-m-10","style":"margin: 10px;"},{"media":"767px","selector":"md-m-12","style":"margin: 12px;"},{"media":"767px","selector":"md-m-14","style":"margin: 14px;"},{"media":"767px","selector":"md-m-16","style":"margin: 16px;"},{"media":"767px","selector":"md-m-18","style":"margin: 18px;"},{"media":"767px","selector":"md-m-20","style":"margin: 20px;"},{"media":"767px","selector":"md-m-22","style":"margin: 22px;"},{"media":"767px","selector":"md-m-24","style":"margin: 24px;"},{"media":"767px","selector":"md-m-26","style":"margin: 26px;"},{"media":"767px","selector":"md-m-28","style":"margin: 28px;"},{"media":"767px","selector":"md-m-30","style":"margin: 30px;"},{"media":"767px","selector":"md-m-32","style":"margin: 32px;"},{"media":"767px","selector":"md-m-34","style":"margin: 34px;"},{"media":"767px","selector":"md-m-36","style":"margin: 36px;"},{"media":"767px","selector":"md-m-38","style":"margin: 38px;"},{"media":"767px","selector":"md-m-40","style":"margin: 40px;"},{"media":"767px","selector":"md-ml-0","style":"margin-left: 0;"},{"media":"767px","selector":"md-ml-2","style":"margin-left: 2px;"},{"media":"767px","selector":"md-ml-4","style":"margin-left: 4px;"},{"media":"767px","selector":"md-ml-6","style":"margin-left: 6px;"},{"media":"767px","selector":"md-ml-8","style":"margin-left: 8px;"},{"media":"767px","selector":"md-ml-10","style":"margin-left: 10px;"},{"media":"767px","selector":"md-ml-12","style":"margin-left: 12px;"},{"media":"767px","selector":"md-ml-14","style":"margin-left: 14px;"},{"media":"767px","selector":"md-ml-16","style":"margin-left: 16px;"},{"media":"767px","selector":"md-ml-18","style":"margin-left: 18px;"},{"media":"767px","selector":"md-ml-20","style":"margin-left: 20px;"},{"media":"767px","selector":"md-ml-22","style":"margin-left: 22px;"},{"media":"767px","selector":"md-ml-24","style":"margin-left: 24px;"},{"media":"767px","selector":"md-ml-26","style":"margin-left: 26px;"},{"media":"767px","selector":"md-ml-28","style":"margin-left: 28px;"},{"media":"767px","selector":"md-ml-30","style":"margin-left: 30px;"},{"media":"767px","selector":"md-ml-32","style":"margin-left: 32px;"},{"media":"767px","selector":"md-ml-34","style":"margin-left: 34px;"},{"media":"767px","selector":"md-ml-36","style":"margin-left: 36px;"},{"media":"767px","selector":"md-ml-38","style":"margin-left: 38px;"},{"media":"767px","selector":"md-ml-40","style":"margin-left: 40px;"},{"media":"767px","selector":"md-mr-0","style":"margin-right: 0;"},{"media":"767px","selector":"md-mr-2","style":"margin-right: 2px;"},{"media":"767px","selector":"md-mr-4","style":"margin-right: 4px;"},{"media":"767px","selector":"md-mr-6","style":"margin-right: 6px;"},{"media":"767px","selector":"md-mr-8","style":"margin-right: 8px;"},{"media":"767px","selector":"md-mr-10","style":"margin-right: 10px;"},{"media":"767px","selector":"md-mr-12","style":"margin-right: 12px;"},{"media":"767px","selector":"md-mr-14","style":"margin-right: 14px;"},{"media":"767px","selector":"md-mr-16","style":"margin-right: 16px;"},{"media":"767px","selector":"md-mr-18","style":"margin-right: 18px;"},{"media":"767px","selector":"md-mr-20","style":"margin-right: 20px;"},{"media":"767px","selector":"md-mr-22","style":"margin-right: 22px;"},{"media":"767px","selector":"md-mr-24","style":"margin-right: 24px;"},{"media":"767px","selector":"md-mr-26","style":"margin-right: 26px;"},{"media":"767px","selector":"md-mr-28","style":"margin-right: 28px;"},{"media":"767px","selector":"md-mr-30","style":"margin-right: 30px;"},{"media":"767px","selector":"md-mr-32","style":"margin-right: 32px;"},{"media":"767px","selector":"md-mr-34","style":"margin-right: 34px;"},{"media":"767px","selector":"md-mr-36","style":"margin-right: 36px;"},{"media":"767px","selector":"md-mr-38","style":"margin-right: 38px;"},{"media":"767px","selector":"md-mr-40","style":"margin-right: 40px;"},{"media":"767px","selector":"md-mt-0","style":"margin-top: 0;"},{"media":"767px","selector":"md-mt-2","style":"margin-top: 2px;"},{"media":"767px","selector":"md-mt-4","style":"margin-top: 4px;"},{"media":"767px","selector":"md-mt-6","style":"margin-top: 6px;"},{"media":"767px","selector":"md-mt-8","style":"margin-top: 8px;"},{"media":"767px","selector":"md-mt-10","style":"margin-top: 10px;"},{"media":"767px","selector":"md-mt-12","style":"margin-top: 12px;"},{"media":"767px","selector":"md-mt-14","style":"margin-top: 14px;"},{"media":"767px","selector":"md-mt-16","style":"margin-top: 16px;"},{"media":"767px","selector":"md-mt-18","style":"margin-top: 18px;"},{"media":"767px","selector":"md-mt-20","style":"margin-top: 20px;"},{"media":"767px","selector":"md-mt-22","style":"margin-top: 22px;"},{"media":"767px","selector":"md-mt-24","style":"margin-top: 24px;"},{"media":"767px","selector":"md-mt-26","style":"margin-top: 26px;"},{"media":"767px","selector":"md-mt-28","style":"margin-top: 28px;"},{"media":"767px","selector":"md-mt-30","style":"margin-top: 30px;"},{"media":"767px","selector":"md-mt-32","style":"margin-top: 32px;"},{"media":"767px","selector":"md-mt-34","style":"margin-top: 34px;"},{"media":"767px","selector":"md-mt-36","style":"margin-top: 36px;"},{"media":"767px","selector":"md-mt-38","style":"margin-top: 38px;"},{"media":"767px","selector":"md-mt-40","style":"margin-top: 40px;"},{"media":"767px","selector":"md-mb-0","style":"margin-bottom: 0;"},{"media":"767px","selector":"md-mb-2","style":"margin-bottom: 2px;"},{"media":"767px","selector":"md-mb-4","style":"margin-bottom: 4px;"},{"media":"767px","selector":"md-mb-6","style":"margin-bottom: 6px;"},{"media":"767px","selector":"md-mb-8","style":"margin-bottom: 8px;"},{"media":"767px","selector":"md-mb-10","style":"margin-bottom: 10px;"},{"media":"767px","selector":"md-mb-12","style":"margin-bottom: 12px;"},{"media":"767px","selector":"md-mb-14","style":"margin-bottom: 14px;"},{"media":"767px","selector":"md-mb-16","style":"margin-bottom: 16px;"},{"media":"767px","selector":"md-mb-18","style":"margin-bottom: 18px;"},{"media":"767px","selector":"md-mb-20","style":"margin-bottom: 20px;"},{"media":"767px","selector":"md-mb-22","style":"margin-bottom: 22px;"},{"media":"767px","selector":"md-mb-24","style":"margin-bottom: 24px;"},{"media":"767px","selector":"md-mb-26","style":"margin-bottom: 26px;"},{"media":"767px","selector":"md-mb-28","style":"margin-bottom: 28px;"},{"media":"767px","selector":"md-mb-30","style":"margin-bottom: 30px;"},{"media":"767px","selector":"md-mb-32","style":"margin-bottom: 32px;"},{"media":"767px","selector":"md-mb-34","style":"margin-bottom: 34px;"},{"media":"767px","selector":"md-mb-36","style":"margin-bottom: 36px;"},{"media":"767px","selector":"md-mb-38","style":"margin-bottom: 38px;"},{"media":"767px","selector":"md-mb-40","style":"margin-bottom: 40px;"},{"media":"420px","selector":"sm-none","style":"display: none;"},{"media":"420px","selector":"sm-block","style":"display: block;"},{"media":"420px","selector":"sm-flex","style":"display: flex;"},{"media":"420px","selector":"sm-inline","style":"display: inline;"},{"media":"420px","selector":"sm-inline-block","style":"display: inline-block;"},{"media":"420px","selector":"sm-icy","style":"opacity: 0.85;"},{"media":"420px","selector":"sm-glassy","style":"opacity: 0.5;"},{"media":"420px","selector":"sm-ghostly","style":"opacity: 0.25;"},{"media":"420px","selector":"sm-transparent","style":"opacity: 0;"},{"media":"420px","selector":"sm-hidden","style":"visibility: hidden;"},{"media":"420px","selector":"sm-flex-row","style":"flex-direction: row;"},{"media":"420px","selector":"sm-flex-col","style":"flex-direction: column;"},{"media":"420px","selector":"sm-flex-grow","style":"flex-grow: 1;"},{"media":"420px","selector":"sm-flex-wrap","style":"flex-wrap: wrap;"},{"media":"420px","selector":"sm-flex-center","style":"align-items: center; justify-content: center;"},{"media":"420px","selector":"sm-flex-x-center","style":"align-items: center;"},{"media":"420px","selector":"sm-flex-y-center","style":"justify-content: center;"},{"media":"420px","selector":"sm-h-10","style":"height: 10px;"},{"media":"420px","selector":"sm-h-12","style":"height: 12px;"},{"media":"420px","selector":"sm-h-15","style":"height: 15px;"},{"media":"420px","selector":"sm-h-16","style":"height: 16px;"},{"media":"420px","selector":"sm-h-20","style":"height: 20px;"},{"media":"420px","selector":"sm-h-24","style":"height: 24px;"},{"media":"420px","selector":"sm-h-25","style":"height: 25px;"},{"media":"420px","selector":"sm-h-30","style":"height: 30px;"},{"media":"420px","selector":"sm-h-32","style":"height: 32px;"},{"media":"420px","selector":"sm-h-35","style":"height: 35px;"},{"media":"420px","selector":"sm-h-36","style":"height: 36px;"},{"media":"420px","selector":"sm-h-40","style":"height: 40px;"},{"media":"420px","selector":"sm-h-45","style":"height: 45px;"},{"media":"420px","selector":"sm-h-48","style":"height: 48px;"},{"media":"420px","selector":"sm-h-50","style":"height: 50px;"},{"media":"420px","selector":"sm-h-55","style":"height: 55px;"},{"media":"420px","selector":"sm-h-60","style":"height: 60px;"},{"media":"420px","selector":"sm-h-64","style":"height: 64px;"},{"media":"420px","selector":"sm-h-65","style":"height: 65px;"},{"media":"420px","selector":"sm-h-70","style":"height: 70px;"},{"media":"420px","selector":"sm-h-75","style":"height: 75px;"},{"media":"420px","selector":"sm-h-80","style":"height: 80px;"},{"media":"420px","selector":"sm-h-85","style":"height: 85px;"},{"media":"420px","selector":"sm-h-90","style":"height: 90px;"},{"media":"420px","selector":"sm-h-95","style":"height: 95px;"},{"media":"420px","selector":"sm-h-96","style":"height: 96px;"},{"media":"420px","selector":"sm-h-100","style":"height: 100px;"},{"media":"420px","selector":"sm-h-110","style":"height: 110px;"},{"media":"420px","selector":"sm-h-120","style":"height: 120px;"},{"media":"420px","selector":"sm-h-130","style":"height: 130px;"},{"media":"420px","selector":"sm-h-140","style":"height: 140px;"},{"media":"420px","selector":"sm-h-150","style":"height: 150px;"},{"media":"420px","selector":"sm-h-160","style":"height: 160px;"},{"media":"420px","selector":"sm-h-170","style":"height: 170px;"},{"media":"420px","selector":"sm-h-180","style":"height: 180px;"},{"media":"420px","selector":"sm-h-190","style":"height: 190px;"},{"media":"420px","selector":"sm-h-200","style":"height: 200px;"},{"media":"420px","selector":"sm-h-220","style":"height: 220px;"},{"media":"420px","selector":"sm-h-240","style":"height: 240px;"},{"media":"420px","selector":"sm-h-260","style":"height: 260px;"},{"media":"420px","selector":"sm-h-280","style":"height: 280px;"},{"media":"420px","selector":"sm-h-300","style":"height: 300px;"},{"media":"420px","selector":"sm-h-320","style":"height: 320px;"},{"media":"420px","selector":"sm-h-340","style":"height: 340px;"},{"media":"420px","selector":"sm-h-360","style":"height: 360px;"},{"media":"420px","selector":"sm-h-full","style":"height: 100%;"},{"media":"420px","selector":"sm-w-10","style":"width: 10px;"},{"media":"420px","selector":"sm-w-12","style":"width: 12px;"},{"media":"420px","selector":"sm-w-15","style":"width: 15px;"},{"media":"420px","selector":"sm-w-16","style":"width: 16px;"},{"media":"420px","selector":"sm-w-20","style":"width: 20px;"},{"media":"420px","selector":"sm-w-24","style":"width: 24px;"},{"media":"420px","selector":"sm-w-25","style":"width: 25px;"},{"media":"420px","selector":"sm-w-30","style":"width: 30px;"},{"media":"420px","selector":"sm-w-32","style":"width: 32px;"},{"media":"420px","selector":"sm-w-35","style":"width: 35px;"},{"media":"420px","selector":"sm-w-36","style":"width: 36px;"},{"media":"420px","selector":"sm-w-40","style":"width: 40px;"},{"media":"420px","selector":"sm-w-45","style":"width: 45px;"},{"media":"420px","selector":"sm-w-48","style":"width: 48px;"},{"media":"420px","selector":"sm-w-50","style":"width: 50px;"},{"media":"420px","selector":"sm-w-55","style":"width: 55px;"},{"media":"420px","selector":"sm-w-60","style":"width: 60px;"},{"media":"420px","selector":"sm-w-64","style":"width: 64px;"},{"media":"420px","selector":"sm-w-65","style":"width: 65px;"},{"media":"420px","selector":"sm-w-70","style":"width: 70px;"},{"media":"420px","selector":"sm-w-75","style":"width: 75px;"},{"media":"420px","selector":"sm-w-80","style":"width: 80px;"},{"media":"420px","selector":"sm-w-85","style":"width: 85px;"},{"media":"420px","selector":"sm-w-90","style":"width: 90px;"},{"media":"420px","selector":"sm-w-95","style":"width: 95px;"},{"media":"420px","selector":"sm-w-96","style":"width: 96px;"},{"media":"420px","selector":"sm-w-100","style":"width: 100px;"},{"media":"420px","selector":"sm-w-110","style":"width: 110px;"},{"media":"420px","selector":"sm-w-120","style":"width: 120px;"},{"media":"420px","selector":"sm-w-130","style":"width: 130px;"},{"media":"420px","selector":"sm-w-140","style":"width: 140px;"},{"media":"420px","selector":"sm-w-150","style":"width: 150px;"},{"media":"420px","selector":"sm-w-160","style":"width: 160px;"},{"media":"420px","selector":"sm-w-170","style":"width: 170px;"},{"media":"420px","selector":"sm-w-180","style":"width: 180px;"},{"media":"420px","selector":"sm-w-190","style":"width: 190px;"},{"media":"420px","selector":"sm-w-200","style":"width: 200px;"},{"media":"420px","selector":"sm-w-220","style":"width: 220px;"},{"media":"420px","selector":"sm-w-240","style":"width: 240px;"},{"media":"420px","selector":"sm-w-260","style":"width: 260px;"},{"media":"420px","selector":"sm-w-280","style":"width: 280px;"},{"media":"420px","selector":"sm-w-300","style":"width: 300px;"},{"media":"420px","selector":"sm-w-320","style":"width: 320px;"},{"media":"420px","selector":"sm-w-340","style":"width: 340px;"},{"media":"420px","selector":"sm-w-360","style":"width: 360px;"},{"media":"420px","selector":"sm-w-full","style":"width: 100%;"},{"media":"420px","selector":"sm-mw-xs","style":"max-width: 360px;"},{"media":"420px","selector":"sm-mw-xs","style":"max-width: 420px;"},{"media":"420px","selector":"sm-mw-md","style":"max-width: 767px;"},{"media":"420px","selector":"sm-mw-lg","style":"max-width: 992px;"},{"media":"420px","selector":"sm-mw-xl","style":"max-width: 1024px;"},{"media":"420px","selector":"sm-mw-full","style":"max-width: 100%;"},{"media":"420px","selector":"sm-tx-2xs","style":"font-size: 8px;"},{"media":"420px","selector":"sm-tx-xs","style":"font-size: 10px;"},{"media":"420px","selector":"sm-tx-sm","style":"font-size: 12px;"},{"media":"420px","selector":"sm-tx-md","style":"font-size: 14px;"},{"media":"420px","selector":"sm-tx-lg","style":"font-size: 16px;"},{"media":"420px","selector":"sm-tx-xl","style":"font-size: 18px;"},{"media":"420px","selector":"sm-tx-2xl","style":"font-size: 20px;"},{"media":"420px","selector":"sm-tx-3xl","style":"font-size: 22px;"},{"media":"420px","selector":"sm-tx-4xl","style":"font-size: 24px;"},{"media":"420px","selector":"sm-tx-5xl","style":"font-size: 26px;"},{"media":"420px","selector":"sm-tx-6xl","style":"font-size: 28px;"},{"media":"420px","selector":"sm-tx-7xl","style":"font-size: 30px;"},{"media":"420px","selector":"sm-tx-center","style":"text-align: center;"},{"media":"420px","selector":"sm-tx-left","style":"text-align: left;"},{"media":"420px","selector":"sm-tx-right","style":"text-align: right;"},{"media":"420px","selector":"sm-tx-bold","style":"font-weight: bold;"},{"media":"420px","selector":"sm-tx-normal","style":"font-weight: normal;"},{"media":"420px","selector":"sm-tx-italic","style":"font-style: italic;"},{"media":"420px","selector":"sm-tx-uppercase","style":"text-transform: uppercase;"},{"media":"420px","selector":"sm-tx-underline","style":"text-decoration: underline;"},{"media":"420px","selector":"sm-tx-nowrap","style":"white-space: nowrap;"},{"media":"420px","selector":"sm-bd-solid","style":"border-style: solid;"},{"media":"420px","selector":"sm-bd-dash","style":"border-style: dashed;"},{"media":"420px","selector":"sm-bd-dotted","style":"border-style: dotted;"},{"media":"420px","selector":"sm-bd","style":"border: 1px solid var(--black);"},{"media":"420px","selector":"sm-bdt","style":"border-top: 1px solid var(--black);"},{"media":"420px","selector":"sm-bdb","style":"border-bottom: 1px solid var(--black);"},{"media":"420px","selector":"sm-bdl","style":"border-left: 1px solid var(--black);"},{"media":"420px","selector":"sm-bdr","style":"border-right: 1px solid var(--black);"},{"media":"420px","selector":"sm-bd-xs","style":"border-width: 1px;"},{"media":"420px","selector":"sm-bd-sm","style":"border-width: 2px;"},{"media":"420px","selector":"sm-bd-md","style":"border-width: 3px;"},{"media":"420px","selector":"sm-bd-lg","style":"border-width: 4px;"},{"media":"420px","selector":"sm-bd-xl","style":"border-width: 5px;"},{"media":"420px","selector":"sm-bdt-xs","style":"border-top-width: 1px;"},{"media":"420px","selector":"sm-bdt-sm","style":"border-top-width: 2px;"},{"media":"420px","selector":"sm-bdt-md","style":"border-top-width: 3px;"},{"media":"420px","selector":"sm-bdt-lg","style":"border-top-width: 4px;"},{"media":"420px","selector":"sm-bdt-xl","style":"border-top-width: 5px;"},{"media":"420px","selector":"sm-bdb-xs","style":"border-bottom-width: 1px;"},{"media":"420px","selector":"sm-bdb-sm","style":"border-bottom-width: 2px;"},{"media":"420px","selector":"sm-bdb-md","style":"border-bottom-width: 3px;"},{"media":"420px","selector":"sm-bdb-lg","style":"border-bottom-width: 4px;"},{"media":"420px","selector":"sm-bdb-xl","style":"border-bottom-width: 5px;"},{"media":"420px","selector":"sm-bdl-xs","style":"border-left-width: 1px;"},{"media":"420px","selector":"sm-bdl-sm","style":"border-left-width: 2px;"},{"media":"420px","selector":"sm-bdl-md","style":"border-left-width: 3px;"},{"media":"420px","selector":"sm-bdl-lg","style":"border-left-width: 4px;"},{"media":"420px","selector":"sm-bdl-xl","style":"border-left-width: 5px;"},{"media":"420px","selector":"sm-bdr-xs","style":"border-right-width: 1px;"},{"media":"420px","selector":"sm-bdr-sm","style":"border-right-width: 2px;"},{"media":"420px","selector":"sm-bdr-md","style":"border-right-width: 3px;"},{"media":"420px","selector":"sm-bdr-lg","style":"border-right-width: 4px;"},{"media":"420px","selector":"sm-bdr-xl","style":"border-right-width: 5px;"},{"media":"420px","selector":"sm-bd-rad-xs","style":"border-radius: 2px;"},{"media":"420px","selector":"sm-bd-rad-sm,","style":"border-radius: 4px;"},{"media":"420px","selector":"bd-curved","style":"border-radius: 4px;"},{"media":"420px","selector":"sm-bd-rad-md","style":"border-radius: 6px;"},{"media":"420px","selector":"sm-bd-rad-lg","style":"border-radius: 8px;"},{"media":"420px","selector":"sm-bd-rad-xl,","style":"border-radius: 12px;"},{"media":"420px","selector":"bd-rounded","style":"border-radius: 12px;"},{"media":"420px","selector":"sm-bd-rad-full,","style":"border-radius: 10000px;"},{"media":"420px","selector":"bd-pill","style":"border-radius: 10000px;"},{"media":"420px","selector":"sm-bdl-rad-xs","style":"border-radius: 2px 0 0 2px;"},{"media":"420px","selector":"sm-bdl-rad-sm,","style":"border-radius: 4px 0 0 4px;"},{"media":"420px","selector":"bdl-curved","style":"border-radius: 4px 0 0 4px;"},{"media":"420px","selector":"sm-bdl-rad-md","style":"border-radius: 6px 0 0 6px;"},{"media":"420px","selector":"sm-bdl-rad-lg","style":"border-radius: 8px 0 0 8px;"},{"media":"420px","selector":"sm-bdl-rad-xl,","style":"border-radius: 12px 0 0 12px;"},{"media":"420px","selector":"bdl-rounded","style":"border-radius: 12px 0 0 12px;"},{"media":"420px","selector":"sm-bdl-rad-full,","style":"border-radius: 10000px 0 0 10000px;"},{"media":"420px","selector":"bdl-pill","style":"border-radius: 10000px 0 0 10000px;"},{"media":"420px","selector":"sm-bdr-rad-xs","style":"border-radius: 0 2px 2px 0;"},{"media":"420px","selector":"sm-bdr-rad-sm,","style":"border-radius: 0 4px 4px 0;"},{"media":"420px","selector":"bdr-curved","style":"border-radius: 0 4px 4px 0;"},{"media":"420px","selector":"sm-bdr-rad-md","style":"border-radius: 0 6px 6px 0;"},{"media":"420px","selector":"sm-bdr-rad-lg","style":"border-radius: 0 8px 8px 0;"},{"media":"420px","selector":"sm-bdr-rad-xl,","style":"border-radius: 0 12px 12px 0;"},{"media":"420px","selector":"bdr-rounded","style":"border-radius: 0 12px 12px 0;"},{"media":"420px","selector":"sm-bdr-rad-full,","style":"border-radius: 0 10000px 10000px 0;"},{"media":"420px","selector":"bdr-pill","style":"border-radius: 0 10000px 10000px 0;"},{"media":"420px","selector":"sm-bdt-rad-xs","style":"border-radius: 2px 2px 0 0;"},{"media":"420px","selector":"sm-bdt-rad-sm,","style":"border-radius: 4px 4px 0 0;"},{"media":"420px","selector":"bdt-curved","style":"border-radius: 4px 4px 0 0;"},{"media":"420px","selector":"sm-bdt-rad-md","style":"border-radius: 6px 6px 0 0;"},{"media":"420px","selector":"sm-bdt-rad-lg","style":"border-radius: 8px 8px 0 0;"},{"media":"420px","selector":"sm-bdt-rad-xl,","style":"border-radius: 12px 12px 0 0;"},{"media":"420px","selector":"bdt-rounded","style":"border-radius: 12px 12px 0 0;"},{"media":"420px","selector":"sm-bdt-rad-full,","style":"border-radius: 10000px 10000px 0 0;"},{"media":"420px","selector":"bdt-pill","style":"border-radius: 10000px 10000px 0 0;"},{"media":"420px","selector":"sm-bdb-rad-xs","style":"border-radius: 2px 2px 0 0;"},{"media":"420px","selector":"sm-bdb-rad-sm,","style":"border-radius: 0 0 4px 4px;"},{"media":"420px","selector":"bdb-curved","style":"border-radius: 0 0 4px 4px;"},{"media":"420px","selector":"sm-bdb-rad-md","style":"border-radius: 0 0 6px 6px;"},{"media":"420px","selector":"sm-bdb-rad-lg","style":"border-radius: 0 0 8px 8px;"},{"media":"420px","selector":"sm-bdb-rad-xl,","style":"border-radius: 0 0 12px 12px;"},{"media":"420px","selector":"bdb-rounded","style":"border-radius: 0 0 12px 12px;"},{"media":"420px","selector":"sm-bdb-rad-full,","style":"border-radius: 0 0 10000px 10000px;"},{"media":"420px","selector":"bdb-pill","style":"border-radius: 0 0 10000px 10000px;"},{"media":"420px","selector":"sm-p-0","style":"padding: 0;"},{"media":"420px","selector":"sm-p-2","style":"padding: 2px;"},{"media":"420px","selector":"sm-p-4","style":"padding: 4px;"},{"media":"420px","selector":"sm-p-6","style":"padding: 6px;"},{"media":"420px","selector":"sm-p-8","style":"padding: 8px;"},{"media":"420px","selector":"sm-p-10","style":"padding: 10px;"},{"media":"420px","selector":"sm-p-12","style":"padding: 12px;"},{"media":"420px","selector":"sm-p-14","style":"padding: 14px;"},{"media":"420px","selector":"sm-p-16","style":"padding: 16px;"},{"media":"420px","selector":"sm-p-18","style":"padding: 18px;"},{"media":"420px","selector":"sm-p-20","style":"padding: 20px;"},{"media":"420px","selector":"sm-p-22","style":"padding: 22px;"},{"media":"420px","selector":"sm-p-24","style":"padding: 24px;"},{"media":"420px","selector":"sm-p-26","style":"padding: 26px;"},{"media":"420px","selector":"sm-p-28","style":"padding: 28px;"},{"media":"420px","selector":"sm-p-30","style":"padding: 30px;"},{"media":"420px","selector":"sm-p-32","style":"padding: 32px;"},{"media":"420px","selector":"sm-p-34","style":"padding: 34px;"},{"media":"420px","selector":"sm-p-36","style":"padding: 36px;"},{"media":"420px","selector":"sm-p-38","style":"padding: 38px;"},{"media":"420px","selector":"sm-p-40","style":"padding: 40px;"},{"media":"420px","selector":"sm-pl-0","style":"padding-left: 0;"},{"media":"420px","selector":"sm-pl-2","style":"padding-left: 2px;"},{"media":"420px","selector":"sm-pl-4","style":"padding-left: 4px;"},{"media":"420px","selector":"sm-pl-6","style":"padding-left: 6px;"},{"media":"420px","selector":"sm-pl-8","style":"padding-left: 8px;"},{"media":"420px","selector":"sm-pl-10","style":"padding-left: 10px;"},{"media":"420px","selector":"sm-pl-12","style":"padding-left: 12px;"},{"media":"420px","selector":"sm-pl-14","style":"padding-left: 14px;"},{"media":"420px","selector":"sm-pl-16","style":"padding-left: 16px;"},{"media":"420px","selector":"sm-pl-18","style":"padding-left: 18px;"},{"media":"420px","selector":"sm-pl-20","style":"padding-left: 20px;"},{"media":"420px","selector":"sm-pl-22","style":"padding-left: 22px;"},{"media":"420px","selector":"sm-pl-24","style":"padding-left: 24px;"},{"media":"420px","selector":"sm-pl-26","style":"padding-left: 26px;"},{"media":"420px","selector":"sm-pl-28","style":"padding-left: 28px;"},{"media":"420px","selector":"sm-pl-30","style":"padding-left: 30px;"},{"media":"420px","selector":"sm-pl-32","style":"padding-left: 32px;"},{"media":"420px","selector":"sm-pl-34","style":"padding-left: 34px;"},{"media":"420px","selector":"sm-pl-36","style":"padding-left: 36px;"},{"media":"420px","selector":"sm-pl-38","style":"padding-left: 38px;"},{"media":"420px","selector":"sm-pl-40","style":"padding-left: 40px;"},{"media":"420px","selector":"sm-pr-0","style":"padding-right: 0;"},{"media":"420px","selector":"sm-pr-2","style":"padding-right: 2px;"},{"media":"420px","selector":"sm-pr-4","style":"padding-right: 4px;"},{"media":"420px","selector":"sm-pr-6","style":"padding-right: 6px;"},{"media":"420px","selector":"sm-pr-8","style":"padding-right: 8px;"},{"media":"420px","selector":"sm-pr-10","style":"padding-right: 10px;"},{"media":"420px","selector":"sm-pr-12","style":"padding-right: 12px;"},{"media":"420px","selector":"sm-pr-14","style":"padding-right: 14px;"},{"media":"420px","selector":"sm-pr-16","style":"padding-right: 16px;"},{"media":"420px","selector":"sm-pr-18","style":"padding-right: 18px;"},{"media":"420px","selector":"sm-pr-20","style":"padding-right: 20px;"},{"media":"420px","selector":"sm-pr-22","style":"padding-right: 22px;"},{"media":"420px","selector":"sm-pr-24","style":"padding-right: 24px;"},{"media":"420px","selector":"sm-pr-26","style":"padding-right: 26px;"},{"media":"420px","selector":"sm-pr-28","style":"padding-right: 28px;"},{"media":"420px","selector":"sm-pr-30","style":"padding-right: 30px;"},{"media":"420px","selector":"sm-pr-32","style":"padding-right: 32px;"},{"media":"420px","selector":"sm-pr-34","style":"padding-right: 34px;"},{"media":"420px","selector":"sm-pr-36","style":"padding-right: 36px;"},{"media":"420px","selector":"sm-pr-38","style":"padding-right: 38px;"},{"media":"420px","selector":"sm-pr-40","style":"padding-right: 40px;"},{"media":"420px","selector":"sm-pt-0","style":"padding-top: 0;"},{"media":"420px","selector":"sm-pt-2","style":"padding-top: 2px;"},{"media":"420px","selector":"sm-pt-4","style":"padding-top: 4px;"},{"media":"420px","selector":"sm-pt-6","style":"padding-top: 6px;"},{"media":"420px","selector":"sm-pt-8","style":"padding-top: 8px;"},{"media":"420px","selector":"sm-pt-10","style":"padding-top: 10px;"},{"media":"420px","selector":"sm-pt-12","style":"padding-top: 12px;"},{"media":"420px","selector":"sm-pt-14","style":"padding-top: 14px;"},{"media":"420px","selector":"sm-pt-16","style":"padding-top: 16px;"},{"media":"420px","selector":"sm-pt-18","style":"padding-top: 18px;"},{"media":"420px","selector":"sm-pt-20","style":"padding-top: 20px;"},{"media":"420px","selector":"sm-pt-22","style":"padding-top: 22px;"},{"media":"420px","selector":"sm-pt-24","style":"padding-top: 24px;"},{"media":"420px","selector":"sm-pt-26","style":"padding-top: 26px;"},{"media":"420px","selector":"sm-pt-28","style":"padding-top: 28px;"},{"media":"420px","selector":"sm-pt-30","style":"padding-top: 30px;"},{"media":"420px","selector":"sm-pt-32","style":"padding-top: 32px;"},{"media":"420px","selector":"sm-pt-34","style":"padding-top: 34px;"},{"media":"420px","selector":"sm-pt-36","style":"padding-top: 36px;"},{"media":"420px","selector":"sm-pt-38","style":"padding-top: 38px;"},{"media":"420px","selector":"sm-pt-40","style":"padding-top: 40px;"},{"media":"420px","selector":"sm-pb-0","style":"padding-bottom: 0;"},{"media":"420px","selector":"sm-pb-2","style":"padding-bottom: 2px;"},{"media":"420px","selector":"sm-pb-4","style":"padding-bottom: 4px;"},{"media":"420px","selector":"sm-pb-6","style":"padding-bottom: 6px;"},{"media":"420px","selector":"sm-pb-8","style":"padding-bottom: 8px;"},{"media":"420px","selector":"sm-pb-10","style":"padding-bottom: 10px;"},{"media":"420px","selector":"sm-pb-12","style":"padding-bottom: 12px;"},{"media":"420px","selector":"sm-pb-14","style":"padding-bottom: 14px;"},{"media":"420px","selector":"sm-pb-16","style":"padding-bottom: 16px;"},{"media":"420px","selector":"sm-pb-18","style":"padding-bottom: 18px;"},{"media":"420px","selector":"sm-pb-20","style":"padding-bottom: 20px;"},{"media":"420px","selector":"sm-pb-22","style":"padding-bottom: 22px;"},{"media":"420px","selector":"sm-pb-24","style":"padding-bottom: 24px;"},{"media":"420px","selector":"sm-pb-26","style":"padding-bottom: 26px;"},{"media":"420px","selector":"sm-pb-28","style":"padding-bottom: 28px;"},{"media":"420px","selector":"sm-pb-30","style":"padding-bottom: 30px;"},{"media":"420px","selector":"sm-pb-32","style":"padding-bottom: 32px;"},{"media":"420px","selector":"sm-pb-34","style":"padding-bottom: 34px;"},{"media":"420px","selector":"sm-pb-36","style":"padding-bottom: 36px;"},{"media":"420px","selector":"sm-pb-38","style":"padding-bottom: 38px;"},{"media":"420px","selector":"sm-pb-40","style":"padding-bottom: 40px;"},{"media":"420px","selector":"sm-m-0","style":"margin: 0;"},{"media":"420px","selector":"sm-m-2","style":"margin: 2px;"},{"media":"420px","selector":"sm-m-4","style":"margin: 4px;"},{"media":"420px","selector":"sm-m-6","style":"margin: 6px;"},{"media":"420px","selector":"sm-m-8","style":"margin: 8px;"},{"media":"420px","selector":"sm-m-10","style":"margin: 10px;"},{"media":"420px","selector":"sm-m-12","style":"margin: 12px;"},{"media":"420px","selector":"sm-m-14","style":"margin: 14px;"},{"media":"420px","selector":"sm-m-16","style":"margin: 16px;"},{"media":"420px","selector":"sm-m-18","style":"margin: 18px;"},{"media":"420px","selector":"sm-m-20","style":"margin: 20px;"},{"media":"420px","selector":"sm-m-22","style":"margin: 22px;"},{"media":"420px","selector":"sm-m-24","style":"margin: 24px;"},{"media":"420px","selector":"sm-m-26","style":"margin: 26px;"},{"media":"420px","selector":"sm-m-28","style":"margin: 28px;"},{"media":"420px","selector":"sm-m-30","style":"margin: 30px;"},{"media":"420px","selector":"sm-m-32","style":"margin: 32px;"},{"media":"420px","selector":"sm-m-34","style":"margin: 34px;"},{"media":"420px","selector":"sm-m-36","style":"margin: 36px;"},{"media":"420px","selector":"sm-m-38","style":"margin: 38px;"},{"media":"420px","selector":"sm-m-40","style":"margin: 40px;"},{"media":"420px","selector":"sm-ml-0","style":"margin-left: 0;"},{"media":"420px","selector":"sm-ml-2","style":"margin-left: 2px;"},{"media":"420px","selector":"sm-ml-4","style":"margin-left: 4px;"},{"media":"420px","selector":"sm-ml-6","style":"margin-left: 6px;"},{"media":"420px","selector":"sm-ml-8","style":"margin-left: 8px;"},{"media":"420px","selector":"sm-ml-10","style":"margin-left: 10px;"},{"media":"420px","selector":"sm-ml-12","style":"margin-left: 12px;"},{"media":"420px","selector":"sm-ml-14","style":"margin-left: 14px;"},{"media":"420px","selector":"sm-ml-16","style":"margin-left: 16px;"},{"media":"420px","selector":"sm-ml-18","style":"margin-left: 18px;"},{"media":"420px","selector":"sm-ml-20","style":"margin-left: 20px;"},{"media":"420px","selector":"sm-ml-22","style":"margin-left: 22px;"},{"media":"420px","selector":"sm-ml-24","style":"margin-left: 24px;"},{"media":"420px","selector":"sm-ml-26","style":"margin-left: 26px;"},{"media":"420px","selector":"sm-ml-28","style":"margin-left: 28px;"},{"media":"420px","selector":"sm-ml-30","style":"margin-left: 30px;"},{"media":"420px","selector":"sm-ml-32","style":"margin-left: 32px;"},{"media":"420px","selector":"sm-ml-34","style":"margin-left: 34px;"},{"media":"420px","selector":"sm-ml-36","style":"margin-left: 36px;"},{"media":"420px","selector":"sm-ml-38","style":"margin-left: 38px;"},{"media":"420px","selector":"sm-ml-40","style":"margin-left: 40px;"},{"media":"420px","selector":"sm-mr-0","style":"margin-right: 0;"},{"media":"420px","selector":"sm-mr-2","style":"margin-right: 2px;"},{"media":"420px","selector":"sm-mr-4","style":"margin-right: 4px;"},{"media":"420px","selector":"sm-mr-6","style":"margin-right: 6px;"},{"media":"420px","selector":"sm-mr-8","style":"margin-right: 8px;"},{"media":"420px","selector":"sm-mr-10","style":"margin-right: 10px;"},{"media":"420px","selector":"sm-mr-12","style":"margin-right: 12px;"},{"media":"420px","selector":"sm-mr-14","style":"margin-right: 14px;"},{"media":"420px","selector":"sm-mr-16","style":"margin-right: 16px;"},{"media":"420px","selector":"sm-mr-18","style":"margin-right: 18px;"},{"media":"420px","selector":"sm-mr-20","style":"margin-right: 20px;"},{"media":"420px","selector":"sm-mr-22","style":"margin-right: 22px;"},{"media":"420px","selector":"sm-mr-24","style":"margin-right: 24px;"},{"media":"420px","selector":"sm-mr-26","style":"margin-right: 26px;"},{"media":"420px","selector":"sm-mr-28","style":"margin-right: 28px;"},{"media":"420px","selector":"sm-mr-30","style":"margin-right: 30px;"},{"media":"420px","selector":"sm-mr-32","style":"margin-right: 32px;"},{"media":"420px","selector":"sm-mr-34","style":"margin-right: 34px;"},{"media":"420px","selector":"sm-mr-36","style":"margin-right: 36px;"},{"media":"420px","selector":"sm-mr-38","style":"margin-right: 38px;"},{"media":"420px","selector":"sm-mr-40","style":"margin-right: 40px;"},{"media":"420px","selector":"sm-mt-0","style":"margin-top: 0;"},{"media":"420px","selector":"sm-mt-2","style":"margin-top: 2px;"},{"media":"420px","selector":"sm-mt-4","style":"margin-top: 4px;"},{"media":"420px","selector":"sm-mt-6","style":"margin-top: 6px;"},{"media":"420px","selector":"sm-mt-8","style":"margin-top: 8px;"},{"media":"420px","selector":"sm-mt-10","style":"margin-top: 10px;"},{"media":"420px","selector":"sm-mt-12","style":"margin-top: 12px;"},{"media":"420px","selector":"sm-mt-14","style":"margin-top: 14px;"},{"media":"420px","selector":"sm-mt-16","style":"margin-top: 16px;"},{"media":"420px","selector":"sm-mt-18","style":"margin-top: 18px;"},{"media":"420px","selector":"sm-mt-20","style":"margin-top: 20px;"},{"media":"420px","selector":"sm-mt-22","style":"margin-top: 22px;"},{"media":"420px","selector":"sm-mt-24","style":"margin-top: 24px;"},{"media":"420px","selector":"sm-mt-26","style":"margin-top: 26px;"},{"media":"420px","selector":"sm-mt-28","style":"margin-top: 28px;"},{"media":"420px","selector":"sm-mt-30","style":"margin-top: 30px;"},{"media":"420px","selector":"sm-mt-32","style":"margin-top: 32px;"},{"media":"420px","selector":"sm-mt-34","style":"margin-top: 34px;"},{"media":"420px","selector":"sm-mt-36","style":"margin-top: 36px;"},{"media":"420px","selector":"sm-mt-38","style":"margin-top: 38px;"},{"media":"420px","selector":"sm-mt-40","style":"margin-top: 40px;"},{"media":"420px","selector":"sm-mb-0","style":"margin-bottom: 0;"},{"media":"420px","selector":"sm-mb-2","style":"margin-bottom: 2px;"},{"media":"420px","selector":"sm-mb-4","style":"margin-bottom: 4px;"},{"media":"420px","selector":"sm-mb-6","style":"margin-bottom: 6px;"},{"media":"420px","selector":"sm-mb-8","style":"margin-bottom: 8px;"},{"media":"420px","selector":"sm-mb-10","style":"margin-bottom: 10px;"},{"media":"420px","selector":"sm-mb-12","style":"margin-bottom: 12px;"},{"media":"420px","selector":"sm-mb-14","style":"margin-bottom: 14px;"},{"media":"420px","selector":"sm-mb-16","style":"margin-bottom: 16px;"},{"media":"420px","selector":"sm-mb-18","style":"margin-bottom: 18px;"},{"media":"420px","selector":"sm-mb-20","style":"margin-bottom: 20px;"},{"media":"420px","selector":"sm-mb-22","style":"margin-bottom: 22px;"},{"media":"420px","selector":"sm-mb-24","style":"margin-bottom: 24px;"},{"media":"420px","selector":"sm-mb-26","style":"margin-bottom: 26px;"},{"media":"420px","selector":"sm-mb-28","style":"margin-bottom: 28px;"},{"media":"420px","selector":"sm-mb-30","style":"margin-bottom: 30px;"},{"media":"420px","selector":"sm-mb-32","style":"margin-bottom: 32px;"},{"media":"420px","selector":"sm-mb-34","style":"margin-bottom: 34px;"},{"media":"420px","selector":"sm-mb-36","style":"margin-bottom: 36px;"},{"media":"420px","selector":"sm-mb-38","style":"margin-bottom: 38px;"},{"media":"420px","selector":"sm-mb-40","style":"margin-bottom: 40px;"},{"media":"360px","selector":"xs-none","style":"display: none;"},{"media":"360px","selector":"xs-block","style":"display: block;"},{"media":"360px","selector":"xs-flex","style":"display: flex;"},{"media":"360px","selector":"xs-inline","style":"display: inline;"},{"media":"360px","selector":"xs-inline-block","style":"display: inline-block;"},{"media":"360px","selector":"xs-icy","style":"opacity: 0.85;"},{"media":"360px","selector":"xs-glassy","style":"opacity: 0.5;"},{"media":"360px","selector":"xs-ghostly","style":"opacity: 0.25;"},{"media":"360px","selector":"xs-transparent","style":"opacity: 0;"},{"media":"360px","selector":"xs-hidden","style":"visibility: hidden;"},{"media":"360px","selector":"xs-flex-row","style":"flex-direction: row;"},{"media":"360px","selector":"xs-flex-col","style":"flex-direction: column;"},{"media":"360px","selector":"xs-flex-grow","style":"flex-grow: 1;"},{"media":"360px","selector":"xs-flex-wrap","style":"flex-wrap: wrap;"},{"media":"360px","selector":"xs-flex-center","style":"align-items: center; justify-content: center;"},{"media":"360px","selector":"xs-flex-x-center","style":"align-items: center;"},{"media":"360px","selector":"xs-flex-y-center","style":"justify-content: center;"},{"media":"360px","selector":"xs-h-10","style":"height: 10px;"},{"media":"360px","selector":"xs-h-12","style":"height: 12px;"},{"media":"360px","selector":"xs-h-15","style":"height: 15px;"},{"media":"360px","selector":"xs-h-16","style":"height: 16px;"},{"media":"360px","selector":"xs-h-20","style":"height: 20px;"},{"media":"360px","selector":"xs-h-24","style":"height: 24px;"},{"media":"360px","selector":"xs-h-25","style":"height: 25px;"},{"media":"360px","selector":"xs-h-30","style":"height: 30px;"},{"media":"360px","selector":"xs-h-32","style":"height: 32px;"},{"media":"360px","selector":"xs-h-35","style":"height: 35px;"},{"media":"360px","selector":"xs-h-36","style":"height: 36px;"},{"media":"360px","selector":"xs-h-40","style":"height: 40px;"},{"media":"360px","selector":"xs-h-45","style":"height: 45px;"},{"media":"360px","selector":"xs-h-48","style":"height: 48px;"},{"media":"360px","selector":"xs-h-50","style":"height: 50px;"},{"media":"360px","selector":"xs-h-55","style":"height: 55px;"},{"media":"360px","selector":"xs-h-60","style":"height: 60px;"},{"media":"360px","selector":"xs-h-64","style":"height: 64px;"},{"media":"360px","selector":"xs-h-65","style":"height: 65px;"},{"media":"360px","selector":"xs-h-70","style":"height: 70px;"},{"media":"360px","selector":"xs-h-75","style":"height: 75px;"},{"media":"360px","selector":"xs-h-80","style":"height: 80px;"},{"media":"360px","selector":"xs-h-85","style":"height: 85px;"},{"media":"360px","selector":"xs-h-90","style":"height: 90px;"},{"media":"360px","selector":"xs-h-95","style":"height: 95px;"},{"media":"360px","selector":"xs-h-96","style":"height: 96px;"},{"media":"360px","selector":"xs-h-100","style":"height: 100px;"},{"media":"360px","selector":"xs-h-110","style":"height: 110px;"},{"media":"360px","selector":"xs-h-120","style":"height: 120px;"},{"media":"360px","selector":"xs-h-130","style":"height: 130px;"},{"media":"360px","selector":"xs-h-140","style":"height: 140px;"},{"media":"360px","selector":"xs-h-150","style":"height: 150px;"},{"media":"360px","selector":"xs-h-160","style":"height: 160px;"},{"media":"360px","selector":"xs-h-170","style":"height: 170px;"},{"media":"360px","selector":"xs-h-180","style":"height: 180px;"},{"media":"360px","selector":"xs-h-190","style":"height: 190px;"},{"media":"360px","selector":"xs-h-200","style":"height: 200px;"},{"media":"360px","selector":"xs-h-220","style":"height: 220px;"},{"media":"360px","selector":"xs-h-240","style":"height: 240px;"},{"media":"360px","selector":"xs-h-260","style":"height: 260px;"},{"media":"360px","selector":"xs-h-280","style":"height: 280px;"},{"media":"360px","selector":"xs-h-300","style":"height: 300px;"},{"media":"360px","selector":"xs-h-320","style":"height: 320px;"},{"media":"360px","selector":"xs-h-340","style":"height: 340px;"},{"media":"360px","selector":"xs-h-360","style":"height: 360px;"},{"media":"360px","selector":"xs-h-full","style":"height: 100%;"},{"media":"360px","selector":"xs-w-10","style":"width: 10px;"},{"media":"360px","selector":"xs-w-12","style":"width: 12px;"},{"media":"360px","selector":"xs-w-15","style":"width: 15px;"},{"media":"360px","selector":"xs-w-16","style":"width: 16px;"},{"media":"360px","selector":"xs-w-20","style":"width: 20px;"},{"media":"360px","selector":"xs-w-24","style":"width: 24px;"},{"media":"360px","selector":"xs-w-25","style":"width: 25px;"},{"media":"360px","selector":"xs-w-30","style":"width: 30px;"},{"media":"360px","selector":"xs-w-32","style":"width: 32px;"},{"media":"360px","selector":"xs-w-35","style":"width: 35px;"},{"media":"360px","selector":"xs-w-36","style":"width: 36px;"},{"media":"360px","selector":"xs-w-40","style":"width: 40px;"},{"media":"360px","selector":"xs-w-45","style":"width: 45px;"},{"media":"360px","selector":"xs-w-48","style":"width: 48px;"},{"media":"360px","selector":"xs-w-50","style":"width: 50px;"},{"media":"360px","selector":"xs-w-55","style":"width: 55px;"},{"media":"360px","selector":"xs-w-60","style":"width: 60px;"},{"media":"360px","selector":"xs-w-64","style":"width: 64px;"},{"media":"360px","selector":"xs-w-65","style":"width: 65px;"},{"media":"360px","selector":"xs-w-70","style":"width: 70px;"},{"media":"360px","selector":"xs-w-75","style":"width: 75px;"},{"media":"360px","selector":"xs-w-80","style":"width: 80px;"},{"media":"360px","selector":"xs-w-85","style":"width: 85px;"},{"media":"360px","selector":"xs-w-90","style":"width: 90px;"},{"media":"360px","selector":"xs-w-95","style":"width: 95px;"},{"media":"360px","selector":"xs-w-96","style":"width: 96px;"},{"media":"360px","selector":"xs-w-100","style":"width: 100px;"},{"media":"360px","selector":"xs-w-110","style":"width: 110px;"},{"media":"360px","selector":"xs-w-120","style":"width: 120px;"},{"media":"360px","selector":"xs-w-130","style":"width: 130px;"},{"media":"360px","selector":"xs-w-140","style":"width: 140px;"},{"media":"360px","selector":"xs-w-150","style":"width: 150px;"},{"media":"360px","selector":"xs-w-160","style":"width: 160px;"},{"media":"360px","selector":"xs-w-170","style":"width: 170px;"},{"media":"360px","selector":"xs-w-180","style":"width: 180px;"},{"media":"360px","selector":"xs-w-190","style":"width: 190px;"},{"media":"360px","selector":"xs-w-200","style":"width: 200px;"},{"media":"360px","selector":"xs-w-220","style":"width: 220px;"},{"media":"360px","selector":"xs-w-240","style":"width: 240px;"},{"media":"360px","selector":"xs-w-260","style":"width: 260px;"},{"media":"360px","selector":"xs-w-280","style":"width: 280px;"},{"media":"360px","selector":"xs-w-300","style":"width: 300px;"},{"media":"360px","selector":"xs-w-320","style":"width: 320px;"},{"media":"360px","selector":"xs-w-340","style":"width: 340px;"},{"media":"360px","selector":"xs-w-360","style":"width: 360px;"},{"media":"360px","selector":"xs-w-full","style":"width: 100%;"},{"media":"360px","selector":"xs-mw-xs","style":"max-width: 360px;"},{"media":"360px","selector":"xs-mw-xs","style":"max-width: 420px;"},{"media":"360px","selector":"xs-mw-md","style":"max-width: 767px;"},{"media":"360px","selector":"xs-mw-lg","style":"max-width: 992px;"},{"media":"360px","selector":"xs-mw-xl","style":"max-width: 1024px;"},{"media":"360px","selector":"xs-mw-full","style":"max-width: 100%;"},{"media":"360px","selector":"xs-tx-2xs","style":"font-size: 8px;"},{"media":"360px","selector":"xs-tx-xs","style":"font-size: 10px;"},{"media":"360px","selector":"xs-tx-sm","style":"font-size: 12px;"},{"media":"360px","selector":"xs-tx-md","style":"font-size: 14px;"},{"media":"360px","selector":"xs-tx-lg","style":"font-size: 16px;"},{"media":"360px","selector":"xs-tx-xl","style":"font-size: 18px;"},{"media":"360px","selector":"xs-tx-2xl","style":"font-size: 20px;"},{"media":"360px","selector":"xs-tx-3xl","style":"font-size: 22px;"},{"media":"360px","selector":"xs-tx-4xl","style":"font-size: 24px;"},{"media":"360px","selector":"xs-tx-5xl","style":"font-size: 26px;"},{"media":"360px","selector":"xs-tx-6xl","style":"font-size: 28px;"},{"media":"360px","selector":"xs-tx-7xl","style":"font-size: 30px;"},{"media":"360px","selector":"xs-tx-center","style":"text-align: center;"},{"media":"360px","selector":"xs-tx-left","style":"text-align: left;"},{"media":"360px","selector":"xs-tx-right","style":"text-align: right;"},{"media":"360px","selector":"xs-tx-bold","style":"font-weight: bold;"},{"media":"360px","selector":"xs-tx-normal","style":"font-weight: normal;"},{"media":"360px","selector":"xs-tx-italic","style":"font-style: italic;"},{"media":"360px","selector":"xs-tx-uppercase","style":"text-transform: uppercase;"},{"media":"360px","selector":"xs-tx-underline","style":"text-decoration: underline;"},{"media":"360px","selector":"xs-tx-nowrap","style":"white-space: nowrap;"},{"media":"360px","selector":"xs-bd-solid","style":"border-style: solid;"},{"media":"360px","selector":"xs-bd-dash","style":"border-style: dashed;"},{"media":"360px","selector":"xs-bd-dotted","style":"border-style: dotted;"},{"media":"360px","selector":"xs-bd","style":"border: 1px solid var(--black);"},{"media":"360px","selector":"xs-bdt","style":"border-top: 1px solid var(--black);"},{"media":"360px","selector":"xs-bdb","style":"border-bottom: 1px solid var(--black);"},{"media":"360px","selector":"xs-bdl","style":"border-left: 1px solid var(--black);"},{"media":"360px","selector":"xs-bdr","style":"border-right: 1px solid var(--black);"},{"media":"360px","selector":"xs-bd-xs","style":"border-width: 1px;"},{"media":"360px","selector":"xs-bd-sm","style":"border-width: 2px;"},{"media":"360px","selector":"xs-bd-md","style":"border-width: 3px;"},{"media":"360px","selector":"xs-bd-lg","style":"border-width: 4px;"},{"media":"360px","selector":"xs-bd-xl","style":"border-width: 5px;"},{"media":"360px","selector":"xs-bdt-xs","style":"border-top-width: 1px;"},{"media":"360px","selector":"xs-bdt-sm","style":"border-top-width: 2px;"},{"media":"360px","selector":"xs-bdt-md","style":"border-top-width: 3px;"},{"media":"360px","selector":"xs-bdt-lg","style":"border-top-width: 4px;"},{"media":"360px","selector":"xs-bdt-xl","style":"border-top-width: 5px;"},{"media":"360px","selector":"xs-bdb-xs","style":"border-bottom-width: 1px;"},{"media":"360px","selector":"xs-bdb-sm","style":"border-bottom-width: 2px;"},{"media":"360px","selector":"xs-bdb-md","style":"border-bottom-width: 3px;"},{"media":"360px","selector":"xs-bdb-lg","style":"border-bottom-width: 4px;"},{"media":"360px","selector":"xs-bdb-xl","style":"border-bottom-width: 5px;"},{"media":"360px","selector":"xs-bdl-xs","style":"border-left-width: 1px;"},{"media":"360px","selector":"xs-bdl-sm","style":"border-left-width: 2px;"},{"media":"360px","selector":"xs-bdl-md","style":"border-left-width: 3px;"},{"media":"360px","selector":"xs-bdl-lg","style":"border-left-width: 4px;"},{"media":"360px","selector":"xs-bdl-xl","style":"border-left-width: 5px;"},{"media":"360px","selector":"xs-bdr-xs","style":"border-right-width: 1px;"},{"media":"360px","selector":"xs-bdr-sm","style":"border-right-width: 2px;"},{"media":"360px","selector":"xs-bdr-md","style":"border-right-width: 3px;"},{"media":"360px","selector":"xs-bdr-lg","style":"border-right-width: 4px;"},{"media":"360px","selector":"xs-bdr-xl","style":"border-right-width: 5px;"},{"media":"360px","selector":"xs-bd-rad-xs","style":"border-radius: 2px;"},{"media":"360px","selector":"xs-bd-rad-sm,","style":"border-radius: 4px;"},{"media":"360px","selector":"bd-curved","style":"border-radius: 4px;"},{"media":"360px","selector":"xs-bd-rad-md","style":"border-radius: 6px;"},{"media":"360px","selector":"xs-bd-rad-lg","style":"border-radius: 8px;"},{"media":"360px","selector":"xs-bd-rad-xl,","style":"border-radius: 12px;"},{"media":"360px","selector":"bd-rounded","style":"border-radius: 12px;"},{"media":"360px","selector":"xs-bd-rad-full,","style":"border-radius: 10000px;"},{"media":"360px","selector":"bd-pill","style":"border-radius: 10000px;"},{"media":"360px","selector":"xs-bdl-rad-xs","style":"border-radius: 2px 0 0 2px;"},{"media":"360px","selector":"xs-bdl-rad-sm,","style":"border-radius: 4px 0 0 4px;"},{"media":"360px","selector":"bdl-curved","style":"border-radius: 4px 0 0 4px;"},{"media":"360px","selector":"xs-bdl-rad-md","style":"border-radius: 6px 0 0 6px;"},{"media":"360px","selector":"xs-bdl-rad-lg","style":"border-radius: 8px 0 0 8px;"},{"media":"360px","selector":"xs-bdl-rad-xl,","style":"border-radius: 12px 0 0 12px;"},{"media":"360px","selector":"bdl-rounded","style":"border-radius: 12px 0 0 12px;"},{"media":"360px","selector":"xs-bdl-rad-full,","style":"border-radius: 10000px 0 0 10000px;"},{"media":"360px","selector":"bdl-pill","style":"border-radius: 10000px 0 0 10000px;"},{"media":"360px","selector":"xs-bdr-rad-xs","style":"border-radius: 0 2px 2px 0;"},{"media":"360px","selector":"xs-bdr-rad-sm,","style":"border-radius: 0 4px 4px 0;"},{"media":"360px","selector":"bdr-curved","style":"border-radius: 0 4px 4px 0;"},{"media":"360px","selector":"xs-bdr-rad-md","style":"border-radius: 0 6px 6px 0;"},{"media":"360px","selector":"xs-bdr-rad-lg","style":"border-radius: 0 8px 8px 0;"},{"media":"360px","selector":"xs-bdr-rad-xl,","style":"border-radius: 0 12px 12px 0;"},{"media":"360px","selector":"bdr-rounded","style":"border-radius: 0 12px 12px 0;"},{"media":"360px","selector":"xs-bdr-rad-full,","style":"border-radius: 0 10000px 10000px 0;"},{"media":"360px","selector":"bdr-pill","style":"border-radius: 0 10000px 10000px 0;"},{"media":"360px","selector":"xs-bdt-rad-xs","style":"border-radius: 2px 2px 0 0;"},{"media":"360px","selector":"xs-bdt-rad-sm,","style":"border-radius: 4px 4px 0 0;"},{"media":"360px","selector":"bdt-curved","style":"border-radius: 4px 4px 0 0;"},{"media":"360px","selector":"xs-bdt-rad-md","style":"border-radius: 6px 6px 0 0;"},{"media":"360px","selector":"xs-bdt-rad-lg","style":"border-radius: 8px 8px 0 0;"},{"media":"360px","selector":"xs-bdt-rad-xl,","style":"border-radius: 12px 12px 0 0;"},{"media":"360px","selector":"bdt-rounded","style":"border-radius: 12px 12px 0 0;"},{"media":"360px","selector":"xs-bdt-rad-full,","style":"border-radius: 10000px 10000px 0 0;"},{"media":"360px","selector":"bdt-pill","style":"border-radius: 10000px 10000px 0 0;"},{"media":"360px","selector":"xs-bdb-rad-xs","style":"border-radius: 2px 2px 0 0;"},{"media":"360px","selector":"xs-bdb-rad-sm,","style":"border-radius: 0 0 4px 4px;"},{"media":"360px","selector":"bdb-curved","style":"border-radius: 0 0 4px 4px;"},{"media":"360px","selector":"xs-bdb-rad-md","style":"border-radius: 0 0 6px 6px;"},{"media":"360px","selector":"xs-bdb-rad-lg","style":"border-radius: 0 0 8px 8px;"},{"media":"360px","selector":"xs-bdb-rad-xl,","style":"border-radius: 0 0 12px 12px;"},{"media":"360px","selector":"bdb-rounded","style":"border-radius: 0 0 12px 12px;"},{"media":"360px","selector":"xs-bdb-rad-full,","style":"border-radius: 0 0 10000px 10000px;"},{"media":"360px","selector":"bdb-pill","style":"border-radius: 0 0 10000px 10000px;"},{"media":"360px","selector":"xs-p-0","style":"padding: 0;"},{"media":"360px","selector":"xs-p-2","style":"padding: 2px;"},{"media":"360px","selector":"xs-p-4","style":"padding: 4px;"},{"media":"360px","selector":"xs-p-6","style":"padding: 6px;"},{"media":"360px","selector":"xs-p-8","style":"padding: 8px;"},{"media":"360px","selector":"xs-p-10","style":"padding: 10px;"},{"media":"360px","selector":"xs-p-12","style":"padding: 12px;"},{"media":"360px","selector":"xs-p-14","style":"padding: 14px;"},{"media":"360px","selector":"xs-p-16","style":"padding: 16px;"},{"media":"360px","selector":"xs-p-18","style":"padding: 18px;"},{"media":"360px","selector":"xs-p-20","style":"padding: 20px;"},{"media":"360px","selector":"xs-p-22","style":"padding: 22px;"},{"media":"360px","selector":"xs-p-24","style":"padding: 24px;"},{"media":"360px","selector":"xs-p-26","style":"padding: 26px;"},{"media":"360px","selector":"xs-p-28","style":"padding: 28px;"},{"media":"360px","selector":"xs-p-30","style":"padding: 30px;"},{"media":"360px","selector":"xs-p-32","style":"padding: 32px;"},{"media":"360px","selector":"xs-p-34","style":"padding: 34px;"},{"media":"360px","selector":"xs-p-36","style":"padding: 36px;"},{"media":"360px","selector":"xs-p-38","style":"padding: 38px;"},{"media":"360px","selector":"xs-p-40","style":"padding: 40px;"},{"media":"360px","selector":"xs-pl-0","style":"padding-left: 0;"},{"media":"360px","selector":"xs-pl-2","style":"padding-left: 2px;"},{"media":"360px","selector":"xs-pl-4","style":"padding-left: 4px;"},{"media":"360px","selector":"xs-pl-6","style":"padding-left: 6px;"},{"media":"360px","selector":"xs-pl-8","style":"padding-left: 8px;"},{"media":"360px","selector":"xs-pl-10","style":"padding-left: 10px;"},{"media":"360px","selector":"xs-pl-12","style":"padding-left: 12px;"},{"media":"360px","selector":"xs-pl-14","style":"padding-left: 14px;"},{"media":"360px","selector":"xs-pl-16","style":"padding-left: 16px;"},{"media":"360px","selector":"xs-pl-18","style":"padding-left: 18px;"},{"media":"360px","selector":"xs-pl-20","style":"padding-left: 20px;"},{"media":"360px","selector":"xs-pl-22","style":"padding-left: 22px;"},{"media":"360px","selector":"xs-pl-24","style":"padding-left: 24px;"},{"media":"360px","selector":"xs-pl-26","style":"padding-left: 26px;"},{"media":"360px","selector":"xs-pl-28","style":"padding-left: 28px;"},{"media":"360px","selector":"xs-pl-30","style":"padding-left: 30px;"},{"media":"360px","selector":"xs-pl-32","style":"padding-left: 32px;"},{"media":"360px","selector":"xs-pl-34","style":"padding-left: 34px;"},{"media":"360px","selector":"xs-pl-36","style":"padding-left: 36px;"},{"media":"360px","selector":"xs-pl-38","style":"padding-left: 38px;"},{"media":"360px","selector":"xs-pl-40","style":"padding-left: 40px;"},{"media":"360px","selector":"xs-pr-0","style":"padding-right: 0;"},{"media":"360px","selector":"xs-pr-2","style":"padding-right: 2px;"},{"media":"360px","selector":"xs-pr-4","style":"padding-right: 4px;"},{"media":"360px","selector":"xs-pr-6","style":"padding-right: 6px;"},{"media":"360px","selector":"xs-pr-8","style":"padding-right: 8px;"},{"media":"360px","selector":"xs-pr-10","style":"padding-right: 10px;"},{"media":"360px","selector":"xs-pr-12","style":"padding-right: 12px;"},{"media":"360px","selector":"xs-pr-14","style":"padding-right: 14px;"},{"media":"360px","selector":"xs-pr-16","style":"padding-right: 16px;"},{"media":"360px","selector":"xs-pr-18","style":"padding-right: 18px;"},{"media":"360px","selector":"xs-pr-20","style":"padding-right: 20px;"},{"media":"360px","selector":"xs-pr-22","style":"padding-right: 22px;"},{"media":"360px","selector":"xs-pr-24","style":"padding-right: 24px;"},{"media":"360px","selector":"xs-pr-26","style":"padding-right: 26px;"},{"media":"360px","selector":"xs-pr-28","style":"padding-right: 28px;"},{"media":"360px","selector":"xs-pr-30","style":"padding-right: 30px;"},{"media":"360px","selector":"xs-pr-32","style":"padding-right: 32px;"},{"media":"360px","selector":"xs-pr-34","style":"padding-right: 34px;"},{"media":"360px","selector":"xs-pr-36","style":"padding-right: 36px;"},{"media":"360px","selector":"xs-pr-38","style":"padding-right: 38px;"},{"media":"360px","selector":"xs-pr-40","style":"padding-right: 40px;"},{"media":"360px","selector":"xs-pt-0","style":"padding-top: 0;"},{"media":"360px","selector":"xs-pt-2","style":"padding-top: 2px;"},{"media":"360px","selector":"xs-pt-4","style":"padding-top: 4px;"},{"media":"360px","selector":"xs-pt-6","style":"padding-top: 6px;"},{"media":"360px","selector":"xs-pt-8","style":"padding-top: 8px;"},{"media":"360px","selector":"xs-pt-10","style":"padding-top: 10px;"},{"media":"360px","selector":"xs-pt-12","style":"padding-top: 12px;"},{"media":"360px","selector":"xs-pt-14","style":"padding-top: 14px;"},{"media":"360px","selector":"xs-pt-16","style":"padding-top: 16px;"},{"media":"360px","selector":"xs-pt-18","style":"padding-top: 18px;"},{"media":"360px","selector":"xs-pt-20","style":"padding-top: 20px;"},{"media":"360px","selector":"xs-pt-22","style":"padding-top: 22px;"},{"media":"360px","selector":"xs-pt-24","style":"padding-top: 24px;"},{"media":"360px","selector":"xs-pt-26","style":"padding-top: 26px;"},{"media":"360px","selector":"xs-pt-28","style":"padding-top: 28px;"},{"media":"360px","selector":"xs-pt-30","style":"padding-top: 30px;"},{"media":"360px","selector":"xs-pt-32","style":"padding-top: 32px;"},{"media":"360px","selector":"xs-pt-34","style":"padding-top: 34px;"},{"media":"360px","selector":"xs-pt-36","style":"padding-top: 36px;"},{"media":"360px","selector":"xs-pt-38","style":"padding-top: 38px;"},{"media":"360px","selector":"xs-pt-40","style":"padding-top: 40px;"},{"media":"360px","selector":"xs-pb-0","style":"padding-bottom: 0;"},{"media":"360px","selector":"xs-pb-2","style":"padding-bottom: 2px;"},{"media":"360px","selector":"xs-pb-4","style":"padding-bottom: 4px;"},{"media":"360px","selector":"xs-pb-6","style":"padding-bottom: 6px;"},{"media":"360px","selector":"xs-pb-8","style":"padding-bottom: 8px;"},{"media":"360px","selector":"xs-pb-10","style":"padding-bottom: 10px;"},{"media":"360px","selector":"xs-pb-12","style":"padding-bottom: 12px;"},{"media":"360px","selector":"xs-pb-14","style":"padding-bottom: 14px;"},{"media":"360px","selector":"xs-pb-16","style":"padding-bottom: 16px;"},{"media":"360px","selector":"xs-pb-18","style":"padding-bottom: 18px;"},{"media":"360px","selector":"xs-pb-20","style":"padding-bottom: 20px;"},{"media":"360px","selector":"xs-pb-22","style":"padding-bottom: 22px;"},{"media":"360px","selector":"xs-pb-24","style":"padding-bottom: 24px;"},{"media":"360px","selector":"xs-pb-26","style":"padding-bottom: 26px;"},{"media":"360px","selector":"xs-pb-28","style":"padding-bottom: 28px;"},{"media":"360px","selector":"xs-pb-30","style":"padding-bottom: 30px;"},{"media":"360px","selector":"xs-pb-32","style":"padding-bottom: 32px;"},{"media":"360px","selector":"xs-pb-34","style":"padding-bottom: 34px;"},{"media":"360px","selector":"xs-pb-36","style":"padding-bottom: 36px;"},{"media":"360px","selector":"xs-pb-38","style":"padding-bottom: 38px;"},{"media":"360px","selector":"xs-pb-40","style":"padding-bottom: 40px;"},{"media":"360px","selector":"xs-m-0","style":"margin: 0;"},{"media":"360px","selector":"xs-m-2","style":"margin: 2px;"},{"media":"360px","selector":"xs-m-4","style":"margin: 4px;"},{"media":"360px","selector":"xs-m-6","style":"margin: 6px;"},{"media":"360px","selector":"xs-m-8","style":"margin: 8px;"},{"media":"360px","selector":"xs-m-10","style":"margin: 10px;"},{"media":"360px","selector":"xs-m-12","style":"margin: 12px;"},{"media":"360px","selector":"xs-m-14","style":"margin: 14px;"},{"media":"360px","selector":"xs-m-16","style":"margin: 16px;"},{"media":"360px","selector":"xs-m-18","style":"margin: 18px;"},{"media":"360px","selector":"xs-m-20","style":"margin: 20px;"},{"media":"360px","selector":"xs-m-22","style":"margin: 22px;"},{"media":"360px","selector":"xs-m-24","style":"margin: 24px;"},{"media":"360px","selector":"xs-m-26","style":"margin: 26px;"},{"media":"360px","selector":"xs-m-28","style":"margin: 28px;"},{"media":"360px","selector":"xs-m-30","style":"margin: 30px;"},{"media":"360px","selector":"xs-m-32","style":"margin: 32px;"},{"media":"360px","selector":"xs-m-34","style":"margin: 34px;"},{"media":"360px","selector":"xs-m-36","style":"margin: 36px;"},{"media":"360px","selector":"xs-m-38","style":"margin: 38px;"},{"media":"360px","selector":"xs-m-40","style":"margin: 40px;"},{"media":"360px","selector":"xs-ml-0","style":"margin-left: 0;"},{"media":"360px","selector":"xs-ml-2","style":"margin-left: 2px;"},{"media":"360px","selector":"xs-ml-4","style":"margin-left: 4px;"},{"media":"360px","selector":"xs-ml-6","style":"margin-left: 6px;"},{"media":"360px","selector":"xs-ml-8","style":"margin-left: 8px;"},{"media":"360px","selector":"xs-ml-10","style":"margin-left: 10px;"},{"media":"360px","selector":"xs-ml-12","style":"margin-left: 12px;"},{"media":"360px","selector":"xs-ml-14","style":"margin-left: 14px;"},{"media":"360px","selector":"xs-ml-16","style":"margin-left: 16px;"},{"media":"360px","selector":"xs-ml-18","style":"margin-left: 18px;"},{"media":"360px","selector":"xs-ml-20","style":"margin-left: 20px;"},{"media":"360px","selector":"xs-ml-22","style":"margin-left: 22px;"},{"media":"360px","selector":"xs-ml-24","style":"margin-left: 24px;"},{"media":"360px","selector":"xs-ml-26","style":"margin-left: 26px;"},{"media":"360px","selector":"xs-ml-28","style":"margin-left: 28px;"},{"media":"360px","selector":"xs-ml-30","style":"margin-left: 30px;"},{"media":"360px","selector":"xs-ml-32","style":"margin-left: 32px;"},{"media":"360px","selector":"xs-ml-34","style":"margin-left: 34px;"},{"media":"360px","selector":"xs-ml-36","style":"margin-left: 36px;"},{"media":"360px","selector":"xs-ml-38","style":"margin-left: 38px;"},{"media":"360px","selector":"xs-ml-40","style":"margin-left: 40px;"},{"media":"360px","selector":"xs-mr-0","style":"margin-right: 0;"},{"media":"360px","selector":"xs-mr-2","style":"margin-right: 2px;"},{"media":"360px","selector":"xs-mr-4","style":"margin-right: 4px;"},{"media":"360px","selector":"xs-mr-6","style":"margin-right: 6px;"},{"media":"360px","selector":"xs-mr-8","style":"margin-right: 8px;"},{"media":"360px","selector":"xs-mr-10","style":"margin-right: 10px;"},{"media":"360px","selector":"xs-mr-12","style":"margin-right: 12px;"},{"media":"360px","selector":"xs-mr-14","style":"margin-right: 14px;"},{"media":"360px","selector":"xs-mr-16","style":"margin-right: 16px;"},{"media":"360px","selector":"xs-mr-18","style":"margin-right: 18px;"},{"media":"360px","selector":"xs-mr-20","style":"margin-right: 20px;"},{"media":"360px","selector":"xs-mr-22","style":"margin-right: 22px;"},{"media":"360px","selector":"xs-mr-24","style":"margin-right: 24px;"},{"media":"360px","selector":"xs-mr-26","style":"margin-right: 26px;"},{"media":"360px","selector":"xs-mr-28","style":"margin-right: 28px;"},{"media":"360px","selector":"xs-mr-30","style":"margin-right: 30px;"},{"media":"360px","selector":"xs-mr-32","style":"margin-right: 32px;"},{"media":"360px","selector":"xs-mr-34","style":"margin-right: 34px;"},{"media":"360px","selector":"xs-mr-36","style":"margin-right: 36px;"},{"media":"360px","selector":"xs-mr-38","style":"margin-right: 38px;"},{"media":"360px","selector":"xs-mr-40","style":"margin-right: 40px;"},{"media":"360px","selector":"xs-mt-0","style":"margin-top: 0;"},{"media":"360px","selector":"xs-mt-2","style":"margin-top: 2px;"},{"media":"360px","selector":"xs-mt-4","style":"margin-top: 4px;"},{"media":"360px","selector":"xs-mt-6","style":"margin-top: 6px;"},{"media":"360px","selector":"xs-mt-8","style":"margin-top: 8px;"},{"media":"360px","selector":"xs-mt-10","style":"margin-top: 10px;"},{"media":"360px","selector":"xs-mt-12","style":"margin-top: 12px;"},{"media":"360px","selector":"xs-mt-14","style":"margin-top: 14px;"},{"media":"360px","selector":"xs-mt-16","style":"margin-top: 16px;"},{"media":"360px","selector":"xs-mt-18","style":"margin-top: 18px;"},{"media":"360px","selector":"xs-mt-20","style":"margin-top: 20px;"},{"media":"360px","selector":"xs-mt-22","style":"margin-top: 22px;"},{"media":"360px","selector":"xs-mt-24","style":"margin-top: 24px;"},{"media":"360px","selector":"xs-mt-26","style":"margin-top: 26px;"},{"media":"360px","selector":"xs-mt-28","style":"margin-top: 28px;"},{"media":"360px","selector":"xs-mt-30","style":"margin-top: 30px;"},{"media":"360px","selector":"xs-mt-32","style":"margin-top: 32px;"},{"media":"360px","selector":"xs-mt-34","style":"margin-top: 34px;"},{"media":"360px","selector":"xs-mt-36","style":"margin-top: 36px;"},{"media":"360px","selector":"xs-mt-38","style":"margin-top: 38px;"},{"media":"360px","selector":"xs-mt-40","style":"margin-top: 40px;"},{"media":"360px","selector":"xs-mb-0","style":"margin-bottom: 0;"},{"media":"360px","selector":"xs-mb-2","style":"margin-bottom: 2px;"},{"media":"360px","selector":"xs-mb-4","style":"margin-bottom: 4px;"},{"media":"360px","selector":"xs-mb-6","style":"margin-bottom: 6px;"},{"media":"360px","selector":"xs-mb-8","style":"margin-bottom: 8px;"},{"media":"360px","selector":"xs-mb-10","style":"margin-bottom: 10px;"},{"media":"360px","selector":"xs-mb-12","style":"margin-bottom: 12px;"},{"media":"360px","selector":"xs-mb-14","style":"margin-bottom: 14px;"},{"media":"360px","selector":"xs-mb-16","style":"margin-bottom: 16px;"},{"media":"360px","selector":"xs-mb-18","style":"margin-bottom: 18px;"},{"media":"360px","selector":"xs-mb-20","style":"margin-bottom: 20px;"},{"media":"360px","selector":"xs-mb-22","style":"margin-bottom: 22px;"},{"media":"360px","selector":"xs-mb-24","style":"margin-bottom: 24px;"},{"media":"360px","selector":"xs-mb-26","style":"margin-bottom: 26px;"},{"media":"360px","selector":"xs-mb-28","style":"margin-bottom: 28px;"},{"media":"360px","selector":"xs-mb-30","style":"margin-bottom: 30px;"},{"media":"360px","selector":"xs-mb-32","style":"margin-bottom: 32px;"},{"media":"360px","selector":"xs-mb-34","style":"margin-bottom: 34px;"},{"media":"360px","selector":"xs-mb-36","style":"margin-bottom: 36px;"},{"media":"360px","selector":"xs-mb-38","style":"margin-bottom: 38px;"},{"media":"360px","selector":"xs-mb-40","style":"margin-bottom: 40px;"}]
\ No newline at end of file
diff --git a/packages/temple-ui-src/src/form/button.css b/packages/temple-ui-src/src/form/button.css
deleted file mode 100644
index 08d2edb..0000000
--- a/packages/temple-ui-src/src/form/button.css
+++ /dev/null
@@ -1,30 +0,0 @@
-.tui-btn {
-  text-align: center;
-}
-.tui-btn-xs {
-  padding: 2px 4px;
-}
-.tui-btn-sm {
-  padding: 4px 8px;
-}
-.tui-btn-md {
-  padding: 6px 12px;
-}
-.tui-btn-lg {
-  padding: 8px 16px;
-}
-.tui-btn-xl {
-  padding: 10px 20px;
-}
-.tui-btn-2xl {
-  padding: 12px 24px;
-}
-.tui-btn-3xl {
-  padding: 14px 28px;
-}
-.tui-btn-4xl {
-  padding: 16px 32px;
-}
-.tui-btn-5xl {
-  padding: 18px 36px;
-}
\ No newline at end of file
diff --git a/packages/temple-ui-src/src/form/button.tml b/packages/temple-ui-src/src/form/button.tml
index 47d5d9b..dd221ab 100644
--- a/packages/temple-ui-src/src/form/button.tml
+++ b/packages/temple-ui-src/src/form/button.tml
@@ -1,149 +1,5 @@
-
 
-
-  
-    {children()}
-  
-
-
-  
-
\ No newline at end of file
+{[ button ]}
\ No newline at end of file
diff --git a/packages/temple-ui-src/src/form/control.css b/packages/temple-ui-src/src/form/control.css
deleted file mode 100644
index c3a6b42..0000000
--- a/packages/temple-ui-src/src/form/control.css
+++ /dev/null
@@ -1,7 +0,0 @@
-.tui-control-label {
-  display: block;
-}
-
-.tui-control-error {
-  color: var(--error);
-}
\ No newline at end of file
diff --git a/packages/temple-ui-src/src/form/control.tml b/packages/temple-ui-src/src/form/control.tml
index e040105..4486aaa 100644
--- a/packages/temple-ui-src/src/form/control.tml
+++ b/packages/temple-ui-src/src/form/control.tml
@@ -1,36 +1,13 @@
-
 
-
        
-  
-    
-  
-  
        {children}
        
-   0}>
-    
        {error}
        
-          
-
        
\ No newline at end of file
+
+  
+
+
        {children}
        
+ 0}>
+  
        {error}
        
+        
\ No newline at end of file
diff --git a/packages/temple-ui-src/src/helpers.ts b/packages/temple-ui-src/src/helpers.ts
new file mode 100644
index 0000000..fb80bf4
--- /dev/null
+++ b/packages/temple-ui-src/src/helpers.ts
@@ -0,0 +1,204 @@
+import type { Value, Range, Regex, Stylesheet } from './types';
+
+import fs from 'fs';
+import path from 'path';
+
+export const extname = '.css';
+export const vfs = new Map(); 
+export const media = {
+  xs: 360,
+  sm: 420,
+  md: 767,
+  lg: 992,
+  xl: 1024,
+  xl2: 1280,
+  xl3: 1536,
+  xl4: 1920
+};
+
+export function value(
+  responsive: boolean, 
+  selector: string, 
+  style: string
+): Value {
+  return { 
+    type: 'static', 
+    responsive, 
+    selector, 
+    style 
+  };
+};
+
+export function range(
+  responsive: boolean, 
+  selector: string, 
+  style: string, 
+  min: number, 
+  max: number,
+  step = 1
+): Range {
+  return {
+    type: 'range',
+    responsive,
+    selector,
+    style,
+    range: [ min, max ],
+    step
+  };
+};
+
+export function regex(
+  responsive: boolean, 
+  selector: string, 
+  style: string
+): Regex {
+  return { 
+    type: 'regexp', 
+    responsive, 
+    selector, 
+    style 
+  };
+};
+
+export function getStyle(group: string, directive: string) {
+  //ex. node_modules/@ossph/temple-ui/styles/block/alert.css
+  const file = path.join(__dirname, group, directive + extname);
+  //if the file is not registered
+  if (!vfs.has(file)) {
+    //register the file either way
+    vfs.set(file, fs.existsSync(file) 
+      ? fs.readFileSync(file, 'utf-8')
+      : ''
+    );
+  }
+  //return the cached content
+  return vfs.get(file) as string;
+};
+
+export function addStaticStyles(
+  definition: Value, 
+  quotes: string[], 
+  stylesheet: Stylesheet = {}
+) {
+  //extract the responsive, selector, 
+  //and style from the definition
+  const { responsive, selector, style } = definition;
+  addStyle(selector, style, quotes, 'all', stylesheet);
+  if (responsive) {
+    addMediaStyles(selector, style, quotes, stylesheet);
+  }
+  return stylesheet;
+}
+
+export function addRegExpStyles(
+  definition: Regex, 
+  quotes: string[], 
+  stylesheet: Stylesheet = {}
+) {
+  //extract the responsive, selector, 
+  //and style from the definition
+  const { responsive, selector, style } = definition;
+  const query = new RegExp(selector);
+  addStyle(query, style, quotes, 'all', stylesheet);
+  if (responsive) {
+    for (const [ key, size ] of Object.entries(media)) {
+      addStyle(
+        new RegExp(`^${key}\\-${selector}$`), 
+        style, 
+        quotes, 
+        `${size}px`, 
+        stylesheet
+      );
+    }
+  }
+  return stylesheet;
+}
+
+export function addRangeStyles(
+  definition: Range, 
+  quotes: string[], 
+  stylesheet: Stylesheet = {}
+) {
+  //extract the responsive, selector, style,
+  //range, and step from the definition
+  const { responsive, selector, style, range, step } = definition;
+  const decimals = step.toString().split('.')[1]?.length || 0;
+  const multiplier = Math.pow(10, decimals);
+  //loop through the range
+  for (let i = range[0]; i <= range[1]; i += step) {
+    const number = String(Math.floor(i * multiplier));
+    const value = String(Math.floor(i * multiplier) / multiplier);
+    const select = selector.replaceAll('$', number);
+    const styles = style.replaceAll('$', value);
+    addStyle(select, styles, quotes, 'all', stylesheet);
+    if (responsive) {
+      addMediaStyles(select, styles, quotes, stylesheet);
+    }
+  }
+  return stylesheet;
+}
+
+export function addMediaStyles(
+  selector: string, 
+  style: string,
+  quotes: string[], 
+  stylesheet: Stylesheet = {}
+) {
+  for (const [ key, size ] of Object.entries(media)) {
+    addStyle(
+      `${key}-${selector}`, 
+      style, 
+      quotes, 
+      `${size}px`, 
+      stylesheet
+    );
+  }
+  return stylesheet;
+}
+
+export function addStyle(
+  selector: string|RegExp, 
+  style: string,
+  quotes: string[], 
+  media = 'all',
+  stylesheet: Stylesheet = {}
+) {
+  if (typeof selector === 'string' && quotes.includes(selector)) {
+    //if the media is not in the stylesheet
+    if (!stylesheet[media]) {
+      //add the media to the stylesheet
+      stylesheet[media] = [];
+    }
+    //add the styles to the media
+    stylesheet[media].push(`.${selector} { ${style} }`);
+  } else if (selector instanceof RegExp) {
+    for (const quote of quotes) {
+      const matches = quote.match(selector);
+      if (matches) {
+        //extract the selector and arguments
+        const [ selector, ...args ] = Array.from(matches);
+        //replace the arguments in the style
+        const styles = style.replace(/\$([0-9]+)/g, match => {
+          const index = Number(match.substring(1));
+          return args[index - 1];
+        });
+        //if the media is not in the stylesheet
+        if (!stylesheet[media]) {
+          //add the media to the stylesheet
+          stylesheet[media] = [];
+        }
+        //add the styles to the media
+        stylesheet[media].push(`.${selector} { ${styles} }`);
+        //don't break because selectors can have multiple quotes
+        //ex. p-10 p-20 p-30... If we break, we will only get p-10
+      }
+    }
+  }
+
+  return stylesheet;
+}
+
+export function getMatches(content: string) {
+  const matches = content.match(/[a-z]+\-{0,2}([a-z0-9]+\-{0,2})*/g);
+  return matches ? Array.from(new Set(matches)) : [];
+}
\ No newline at end of file
diff --git a/packages/temple-ui-src/src/index.ts b/packages/temple-ui-src/src/index.ts
index cc4011f..f12e71b 100644
--- a/packages/temple-ui-src/src/index.ts
+++ b/packages/temple-ui-src/src/index.ts
@@ -1,33 +1,22 @@
-import type { TempleCompiler, DocumentBuilder } from '@ossph/temple/compiler';
+import type { 
+  TempleCompiler, 
+  DocumentBuilder 
+} from '@ossph/temple/compiler';
 
 import fs from 'fs';
 import path from 'path';
 
-import uis from './data/components.json';
-import utilities from './data/utilities.json';
-
-const extname = '.css';
-const vfs = new Map(); 
-
-export function getStyle(group: string, directive: string) {
-  //ex. node_modules/@ossph/temple-ui/styles/block/alert.css
-  const file = path.join(__dirname, group, directive + extname);
-  //if the file is not registered
-  if (!vfs.has(file)) {
-    //register the file either way
-    vfs.set(file, fs.existsSync(file) 
-      ? fs.readFileSync(file, 'utf-8')
-      : ''
-    );
-  }
-  //return the cached contents
-  return vfs.get(file) as string;
-};
-
-export function tui(options: { brand?: string } = {}) {
-  const brand = typeof options.brand === 'string' ? options.brand : 'tui';
-  const prefix = brand.length ? `${brand}-` : '';
+import utilities from './utilities';
+import uis from './assets/components.json';
+import {
+  getMatches,
+  getStyle,
+  addStaticStyles,
+  addRangeStyles,
+  addRegExpStyles
+} from './helpers';
 
+export function tui() {
   return function withTui(compiler: TempleCompiler) {
     //whenever a component is updated, refresh the document stylesheet
     compiler.emitter.on('dev-updated-component', async e => {
@@ -53,7 +42,7 @@ export function tui(options: { brand?: string } = {}) {
       if (sourceCode.includes('@tui reset;')) {
         //determine reset file path 
         //ie. [root]/styles/common/reset.css
-        const reset = path.join(__dirname, 'common', 'reset.css');
+        const reset = path.join(__dirname, 'assets', 'reset.css');
         //emit pre insert reset styles event
         const pre = await compiler.emitter.waitFor(
           'tui-insert-reset', 
@@ -64,10 +53,7 @@ export function tui(options: { brand?: string } = {}) {
           fs.existsSync(reset) ? fs.readFileSync(reset, 'utf-8') : ''
         );
         //replace @tui theme; with the contents of the theme file
-        sourceCode = sourceCode.replace(
-          '@tui reset;', 
-          contents.trim().replaceAll('.tui-', `.${prefix}`)
-        );
+        sourceCode = sourceCode.replace('@tui reset;', contents.trim());
         //emit post inserted reset styles event
         const post = await compiler.emitter.waitFor(
           'tui-inserted-reset', 
@@ -80,7 +66,7 @@ export function tui(options: { brand?: string } = {}) {
       if (sourceCode.includes('@tui theme;')) {
         //determine theme file path 
         //ie. [root]/styles/common/theme.css
-        const theme = path.join(__dirname, 'common', 'theme.css');
+        const theme = path.join(__dirname, 'assets', 'theme.css');
         //emit pre insert theme styles event
         const pre = await compiler.emitter.waitFor(
           'tui-insert-theme', 
@@ -91,10 +77,7 @@ export function tui(options: { brand?: string } = {}) {
           fs.existsSync(theme) ? fs.readFileSync(theme, 'utf-8') : ''
         );
         //replace @tui theme; with the contents of the theme file
-        sourceCode = sourceCode.replace(
-          '@tui theme;', 
-          contents.trim().replaceAll('.tui-', `.${prefix}`)
-        );
+        sourceCode = sourceCode.replace('@tui theme;', contents.trim());
         //emit post inserted theme styles event
         const post = await compiler.emitter.waitFor(
           'tui-inserted-theme', 
@@ -103,39 +86,95 @@ export function tui(options: { brand?: string } = {}) {
         sourceCode = post.data as string || sourceCode;
       }
 
+      //if the source code includes @tui block;
+      if (sourceCode.includes('@tui block;')) {
+        const blocks = Object.values(document.registry).map(
+          component => component.brand 
+            ? `${component.brand}-${component.tagname}` 
+            : component.tagname
+        ).flat().map(tagname => `${tagname} { display: block; }`);
+        //replace the utilities with the insertion
+        sourceCode = sourceCode.replace(
+          '@tui block;', 
+          blocks.join('\n')
+        );
+       //if the source code includes @tui inline-block;
+      } else if (sourceCode.includes('@tui inline-block;')) {
+        const blocks = Object.values(document.registry).map(
+          component => component.brand 
+            ? `${component.brand}-${component.tagname}` 
+            : component.tagname
+        ).flat().map(tagname => `${tagname} { display: inline-block; }`);
+        //replace the utilities with the insertion
+        sourceCode = sourceCode.replace(
+          '@tui inline-block;', 
+          blocks.join('\n')
+        );
+      }
+
+      //if the source code includes @tui fouc-opacity;
+      if (sourceCode.includes('@tui fouc-opacity;')) {
+        const blocks = Object.values(document.components).map(
+          component => component.brand 
+            ? `${component.brand}-${component.tagname}` 
+            : component.tagname
+        ).flat().map(tagname => `${tagname}:not(:defined) { opacity: 0; }`);
+        //replace the utilities with the insertion
+        sourceCode = sourceCode.replace(
+          '@tui fouc-opacity;', 
+          blocks.join('\n')
+        );
+      //if the source code includes @tui fouc-visibility;
+      } else if (sourceCode.includes('@tui fouc-visibility;')) {
+        const blocks = Object.values(document.components).map(
+          component => component.brand 
+            ? `${component.brand}-${component.tagname}` 
+            : component.tagname
+        ).flat().map(tagname => `${tagname}:not(:defined) { visibility: hidden; }`);
+        //replace the utilities with the insertion
+        sourceCode = sourceCode.replace(
+          '@tui fouc-visibility;', 
+          blocks.join('\n')
+        );
+      //if the source code includes @tui fouc-none;
+      } else if (sourceCode.includes('@tui fouc-none;')) {
+        const blocks = Object.values(document.components).map(
+          component => component.brand 
+            ? `${component.brand}-${component.tagname}` 
+            : component.tagname
+        ).flat().map(tagname => `${tagname}:not(:defined) { display: none; }`);
+        //replace the utilities with the insertion
+        sourceCode = sourceCode.replace(
+          '@tui fouc-none;', 
+          blocks.join('\n')
+        );
+      //if the source code includes @tui fouc-opacity-all;
+      }
+
       //if the source code includes @tui utilities;
       if (sourceCode.includes('@tui utilities;')) {
         const stylesheet: Record = {};
-        //find all the component files
-        const files = Object.values(document.registry).map(
-          component => component.absolute
-        );
-        //add the document to the files
-        files.push(document.absolute);
-        //loop through the files
-        for (const file of files) {
-          //read the file contents
-          const contents = fs.readFileSync(file, 'utf-8');
-          //loop through definitions in the utilities
-          for (const definition of utilities) {
-            //extract the media, selector, and style from the definition
-            const { media, selector, style } = definition;
-            //determine the query
-            const query = `${prefix}${selector}`;
-            //if the contents include the query
-            if (contents.includes(query)) {
-              //create the styles
-              const styles = `.${query} { ${style} }`;
-              //if the media is not in the stylesheet
-              if (!stylesheet[media]) {
-                //add the media to the stylesheet
-                stylesheet[media] = [];
-              }
-              //add the styles to the media
-              stylesheet[media].push(styles);
-            }
+        //remove duplicates values from matches
+        const matches = Array.from(new Set([
+          //find all the component matches
+          ...Object.values(document.registry).map(
+            component => getMatches(component.contents)
+          ).flat(),
+          //add the document to the matches
+          ...getMatches(document.contents)
+        ]));
+
+        //loop through definitions in the utilities
+        for (const definition of utilities) {
+          if (definition.type === 'static') {
+            addStaticStyles(definition, matches, stylesheet);
+          } else if (definition.type === 'range') {
+            addRangeStyles(definition, matches, stylesheet);
+          } else if (definition.type === 'regexp') {
+            addRegExpStyles(definition, matches, stylesheet);
           }
         }
+
         const insertions: string[] = [];
         //loop through the stylesheet
         for (const media in stylesheet) {
@@ -179,10 +218,8 @@ export function tui(options: { brand?: string } = {}) {
           //replace @tui block-alert; with the actual styles
           const styles =  pre.data as string 
             || getStyle(group, String(directive));
-          sourceCode = sourceCode.replace(
-            style, 
-            styles.replaceAll('.tui-', `.${prefix}`)
-          );
+          //add the styles to the source code
+          sourceCode = sourceCode.replace(style, styles);
           continue;
         }
         //@tui block-alert; is not in the styles...
@@ -203,7 +240,7 @@ export function tui(options: { brand?: string } = {}) {
           const styles =  pre.data as string 
             || getStyle(group, String(directive));
           //add the styles to the source code
-          sourceCode += styles.replaceAll('.tui-', `.${prefix}`);
+          sourceCode += styles;
         }
       }
 
@@ -211,4 +248,4 @@ export function tui(options: { brand?: string } = {}) {
       e.set(sourceCode);
     });
   };
-}
\ No newline at end of file
+};
\ No newline at end of file
diff --git a/packages/temple-ui-src/src/panel/foot.tml b/packages/temple-ui-src/src/panel/foot.tml
new file mode 100644
index 0000000..a20f227
--- /dev/null
+++ b/packages/temple-ui-src/src/panel/foot.tml
@@ -0,0 +1,25 @@
+
+
        {children()}
        
\ No newline at end of file
diff --git a/packages/temple-ui-src/src/panel/head.tml b/packages/temple-ui-src/src/panel/head.tml
new file mode 100644
index 0000000..8953080
--- /dev/null
+++ b/packages/temple-ui-src/src/panel/head.tml
@@ -0,0 +1,25 @@
+
+
        {children()}
        
\ No newline at end of file
diff --git a/packages/temple-ui-src/src/panel/layout.tml b/packages/temple-ui-src/src/panel/layout.tml
new file mode 100644
index 0000000..847da5f
--- /dev/null
+++ b/packages/temple-ui-src/src/panel/layout.tml
@@ -0,0 +1,54 @@
+
+{panels}
\ No newline at end of file
diff --git a/packages/temple-ui-src/src/panel/left.tml b/packages/temple-ui-src/src/panel/left.tml
new file mode 100644
index 0000000..cc21275
--- /dev/null
+++ b/packages/temple-ui-src/src/panel/left.tml
@@ -0,0 +1,18 @@
+
+
\ No newline at end of file
diff --git a/packages/temple-ui-src/src/panel/main.tml b/packages/temple-ui-src/src/panel/main.tml
new file mode 100644
index 0000000..f56e356
--- /dev/null
+++ b/packages/temple-ui-src/src/panel/main.tml
@@ -0,0 +1,50 @@
+
+
        {children()}
        
\ No newline at end of file
diff --git a/packages/temple-ui-src/src/panel/right.tml b/packages/temple-ui-src/src/panel/right.tml
new file mode 100644
index 0000000..acf74be
--- /dev/null
+++ b/packages/temple-ui-src/src/panel/right.tml
@@ -0,0 +1,30 @@
+
+
\ No newline at end of file
diff --git a/packages/temple-ui-src/src/types.ts b/packages/temple-ui-src/src/types.ts
new file mode 100644
index 0000000..415a330
--- /dev/null
+++ b/packages/temple-ui-src/src/types.ts
@@ -0,0 +1,24 @@
+export type Stylesheet = Record;
+
+export type Value = {
+  type: 'static',
+  responsive: boolean,
+  selector: string,
+  style: string
+};
+
+export type Range = {
+  type: 'range',
+  responsive: boolean,
+  selector: string,
+  style: string,
+  range: [ number, number ],
+  step: number
+};
+
+export type Regex = {
+  type: 'regexp',
+  responsive: boolean,
+  selector: string,
+  style: string
+};
\ No newline at end of file
diff --git a/packages/temple-ui-src/src/utilities.ts b/packages/temple-ui-src/src/utilities.ts
new file mode 100644
index 0000000..3805892
--- /dev/null
+++ b/packages/temple-ui-src/src/utilities.ts
@@ -0,0 +1,447 @@
+import type { Value, Range, Regex } from './types';
+import { value, range, regex } from './helpers';
+
+const utilities: (Value|Range|Regex)[] = [
+  // Fonts
+  value(false, 'arial', 'font-family: Arial, sans-serif;'),
+  value(false, 'courier', "font-family: 'Courier New', Courier, monospace;"),
+  value(false, 'georgia', 'font-family: Georgia, serif;'),
+  value(false, 'verdana', 'font-family: Verdana, sans-serif;'),
+  
+  // Display
+  value(true, 'none', 'display: none;'),
+  value(true, 'block', 'display: block;'),
+  value(true, 'flex', 'display: flex;'),
+  value(true, 'inline', 'display: inline;'),
+  value(true, 'inline-block', 'display: inline-block;'),
+  value(true, 'transparent', 'opacity: 0;'),
+  value(true, 'hidden', 'visibility: hidden;'),
+  range(true, 'o-$', 'opacity: $;', 0, 1, 0.01),
+
+  // Position
+  value(true, 'relative', 'position: relative;'),
+  value(true, 'absolute', 'position: absolute;'),
+  value(true, 'fixed', 'position: fixed;'),
+  value(true, 'sticky', 'position: sticky;'),
+  value(true, 'static', 'position: static;'),
+
+  regex(true, 'bottom\\-(\\-{0,1}\\d+)', 'bottom: $1px;'),
+  regex(true, 'left\\-(\\-{0,1}\\d+)', 'left: $1px;'),
+  regex(true, 'right\\-(\\-{0,1}\\d+)', 'right: $1px;'),
+  regex(true, 'top\\-(\\-{0,1}\\d+)', 'top: $1px;'),
+
+  regex(true, 'z\\-(\\d+)', 'z-index: $1;'),
+
+  // Float
+  value(true, 'float-left', 'float: left;'),
+  value(true, 'float-right', 'float: right;'),
+  value(true, 'float-none', 'float: none;'),
+
+  // Flex
+  value(true, 'flex-row', 'flex-direction: row;'),
+  value(true, 'flex-col', 'flex-direction: column;'),
+  value(true, 'flex-grow', 'flex-grow: 1;'),
+  value(true, 'flex-shrink', 'flex-shrink: 1;'),
+  value(true, 'flex-center', 'align-items: center; justify-content: center;'),
+  value(true, 'flex-center-x', 'justify-content: center;'),
+  value(true, 'flex-center-y', 'align-items: center;'),
+  value(true, 'flex-wrap', 'flex-wrap: wrap;'),
+  value(true, 'flex-nowrap', 'flex-wrap: nowrap;'),
+
+  value(true, 'justify-center', 'justify-content: center;'),
+  value(true, 'justify-left', 'justify-content: flex-start;'),
+  value(true, 'justify-right', 'justify-content: flex-end;'),
+  value(true, 'justify-between', 'justify-content: space-between;'),
+  value(true, 'justify-around', 'justify-content: space-around;'),
+  value(true, 'justify-evenly', 'justify-content: space-evenly;'),
+
+  value(true, 'align-center', 'align-items: center;'),
+  value(true, 'align-left', 'align-items: flex-start;'),
+  value(true, 'align-right', 'align-items: flex-end;'),
+  value(true, 'align-baseline', 'align-items: baseline;'),
+  
+  value(true, 'basis-full', 'flex-basis: 100%;'),
+  value(true, 'basis-half', 'flex-basis: 50%;'),
+  value(true, 'basis-third', 'flex-basis: 33.33%;'),
+  value(true, 'basis-fourth', 'flex-basis: 25%;'),
+  value(true, 'basis-fifth', 'flex-basis: 20%;'),
+  regex(true, 'basis\\-(\\d+)', 'flex-basis: $1px;'),
+  regex(true, 'basis\\-p\\-(\\d+)', 'flex-basis: $1%;'),
+
+  regex(true, 'gap\\-(\\d+)', 'gap: $1px;'),
+
+  // Overflow
+  value(true, 'scroll', 'overflow: scroll;'),
+  value(true, 'scroll-auto', 'overflow: auto;'),
+  value(true, 'scroll-hidden', 'overflow: hidden;'),
+
+  value(true, 'scroll-x', 'overflow-x: scroll;'),
+  value(true, 'scroll-x-auto', 'overflow-x: auto;'),
+  value(true, 'scroll-x-hidden', 'overflow-x: hidden;'),
+
+  value(true, 'scroll-y', 'overflow-y: scroll;'),
+  value(true, 'scroll-y-auto', 'overflow-y: auto;'),
+  value(true, 'scroll-y-hidden', 'overflow-y: hidden;'),
+  
+  // Size
+  value(true, 'h-auto', 'height: auto;'),
+  value(true, 'h-full', 'height: 100%;'),
+  regex(true, 'h\\-(\\d+)', 'height: $1px;'),
+  regex(true, 'h\\-calc\\-full-(\\d+)', 'height: calc(100% - $1px);'),
+  regex(true, 'h\\-calc\\-half-(\\d+)', 'height: calc(50% - $1px);'),
+  regex(true, 'h\\-calc\\-third-(\\d+)', 'height: calc(33.33% - $1px);'),
+  regex(true, 'h\\-calc\\-fourth-(\\d+)', 'height: calc(25% - $1px);'),
+  regex(true, 'h\\-calc\\-fifth-(\\d+)', 'height: calc(20% - $1px);'),
+  regex(true, 'h\\-calc\\-(\\d+)-(\\d+)', 'height: calc($1% - $2px);'),
+
+  value(true, 'vh', 'height: 100vh;'),
+  value(true, 'vw', 'width: 100vw;'),
+
+  value(true, 'w-auto', 'width: auto;'),
+  value(true, 'w-full', 'width: 100%;'),
+  value(true, 'w-half', 'width: 50%;'),
+  value(true, 'w-third', 'width: 33.33%;'),
+  value(true, 'w-fourth', 'width: 25%;'),
+  value(true, 'w-fifth', 'width: 20%;'),
+  regex(true, 'w\\-(\\d+)', 'width: $1px;'),
+  regex(true, 'wp\\-(\\d+)', 'width: $1%;'),
+  regex(true, 'w\\-calc\\-full-(\\d+)', 'width: calc(100% - $1px);'),
+  regex(true, 'w\\-calc\\-half-(\\d+)', 'width: calc(50% - $1px);'),
+  regex(true, 'w\\-calc\\-third-(\\d+)', 'width: calc(33.33% - $1px);'),
+  regex(true, 'w\\-calc\\-fourth-(\\d+)', 'width: calc(25% - $1px);'),
+  regex(true, 'w\\-calc\\-fifth-(\\d+)', 'width: calc(20% - $1px);'),
+  regex(true, 'w\\-calc\\-(\\d+)-(\\d+)', 'width: calc($1% - $2px);'),
+  
+  value(true, 'wm-auto', 'max-width: auto;'),
+  value(true, 'wm-xs', 'max-width: 360px;'),
+  value(true, 'wm-sm', 'max-width: 420px;'),
+  value(true, 'wm-md', 'max-width: 767px;'),
+  value(true, 'wm-lg', 'max-width: 992px;'),
+  value(true, 'wm-xl', 'max-width: 1024px;'),
+  value(true, 'wm-full', 'max-width: 100%;'),
+  regex(true, 'wm\\-(\\d+)', 'max-width: $1px;'),
+  
+  // Background
+  value(false, 'bg-primary', 'background-color: var(--primary) !important;'),
+  value(false, 'bg-secondary', 'background-color: var(--secondary) !important;'),
+  value(false, 'bg-black', 'background-color: var(--black) !important;'),
+  value(false, 'bg-white', 'background-color: var(--white) !important;'),
+  value(false, 'bg-info', 'background-color: var(--info) !important;'),
+  value(false, 'bg-error', 'background-color: var(--error) !important;'),
+  value(false, 'bg-warning', 'background-color: var(--warning) !important;'),
+  value(false, 'bg-success', 'background-color: var(--success) !important;'),
+  value(false, 'bg-muted', 'background-color: var(--muted) !important;'),
+  regex(true, 'bg\\-t\\-(\\d+)', 'background-color: var(--bg-$1) !important;'),
+  regex(true, 'bg\\-h\\-([0-9a-f]{3,6})', 'background-color: #$1;'),
+
+  value(false, 'bg-cover', 'background-size: cover;'),
+  value(false, 'bg-contain', 'background-size: contain;'),
+  value(false, 'bg-repeat', 'background-repeat: repeat;'),
+  value(false, 'bg-repeat-x', 'background-repeat: repeat-x;'),
+  value(false, 'bg-repeat-y', 'background-repeat: repeat-y;'),
+  value(false, 'bg-norepeat', 'background-repeat: no-repeat;'),
+  value(false, 'bg-fixed', 'background-attachment: fixed;'),
+
+  value(false, 'bg-bottom', 'background-position: bottom;'),
+  value(false, 'bg-center', 'background-position: center;'),
+  value(false, 'bg-left', 'background-position: left;'),
+  value(false, 'bg-right', 'background-position: right;'),
+  value(false, 'bg-top', 'background-position: top;'),
+
+  // Text
+  regex(true, 'tx\\-(\\d+)', 'font-size: $1px;'),
+  value(true, 'tx-2xs', 'font-size: 8px;'),
+  value(true, 'tx-xs', 'font-size: 10px;'),
+  value(true, 'tx-sm', 'font-size: 12px;'),
+  value(true, 'tx-md', 'font-size: 14px;'),
+  value(true, 'tx-lg', 'font-size: 16px;'),
+  value(true, 'tx-xl', 'font-size: 18px;'),
+  value(true, 'tx-2xl', 'font-size: 20px;'),
+  value(true, 'tx-3xl', 'font-size: 22px;'),
+  value(true, 'tx-4xl', 'font-size: 24px;'),
+  value(true, 'tx-5xl', 'font-size: 26px;'),
+  value(true, 'tx-6xl', 'font-size: 28px;'),
+  value(true, 'tx-7xl', 'font-size: 30px;'),
+
+  value(true, 'tx-center', 'text-align: center;'),
+  value(true, 'tx-left', 'text-align: left;'),
+  value(true, 'tx-right', 'text-align: right;'),
+  value(true, 'tx-bold', 'font-weight: bold;'),
+  value(true, 'tx-normal', 'font-weight: normal;'),
+  value(true, 'tx-italic', 'font-style: italic;'),
+  value(true, 'tx-underline', 'text-decoration: underline;'),
+  value(true, 'tx-lowercase', 'text-transform: lowercase;'),
+  value(true, 'tx-uppercase', 'text-transform: uppercase;'),
+  value(true, 'tx-word-wrap', 'word-wrap: break-word;'),
+  value(true, 'tx-nowrap', 'white-space: nowrap;'),
+  value(true, 'tx-prewrap', 'white-space: pre-wrap;'),
+  value(true, 'tx-nodecor', 'text-decoration: none;'),
+
+  value(true, 'tx-top', 'vertical-align: top;'),
+  value(true, 'tx-middle', 'vertical-align: middle;'),
+  value(true, 'tx-bottom', 'vertical-align: bottom;'),
+  
+  regex(true, 'tx\\-lh\\-(\\d+)', 'line-height: $1px;'),
+
+  value(false, 'tx-primary', 'color: var(--primary) !important;'),
+  value(false, 'tx-secondary', 'color: var(--secondary) !important;'),
+  value(false, 'tx-black', 'color: var(--black) !important;'),
+  value(false, 'tx-white', 'color: var(--white) !important;'),
+  value(false, 'tx-info', 'color: var(--info) !important;'),
+  value(false, 'tx-error', 'color: var(--error) !important;'),
+  value(false, 'tx-warning', 'color: var(--warning) !important;'),
+  value(false, 'tx-success', 'color: var(--success) !important;'),
+  value(false, 'tx-muted', 'color: var(--muted) !important;'),
+  regex(true, 'tx\\-t\\-(\\d+)', 'color: var(--tx-$1) !important;'),
+  regex(true, 'tx\\-h\\-([0-9a-f]{3,6})', 'color: #$1;'),
+
+  // Border
+  value(false, 'bd', 'border: 1px solid var(--black);'),
+  value(false, 'bdb', 'border-bottom: 1px solid var(--black);'),
+  value(false, 'bdl', 'border-left: 1px solid var(--black);'),
+  value(false, 'bdr', 'border-right: 1px solid var(--black);'),
+  value(false, 'bdt', 'border-top: 1px solid var(--black);'),
+  value(false, 'bdx', [
+    'border-left: 1px solid var(--black);', 
+    'border-right: 1px solid var(--black);'
+  ].join(' ')),
+  value(false, 'bdy', [
+    'border-bottom: 1px solid var(--black);', 
+    'border-top: 1px solid var(--black);'
+  ].join(' ')),
+
+  value(false, 'bd-solid', 'border-style: solid;'),
+  value(false, 'bd-dashed', 'border-style: dashed;'),
+  value(false, 'bd-dotted', 'border-style: dotted;'),
+  value(false, 'bd-collapse', 'border-collapse: collapse;'),
+
+  value(false, 'bd-primary', 'border-color: var(--primary) !important;'),
+  value(false, 'bd-secondary', 'border-color: var(--secondary) !important;'),
+  value(false, 'bd-black', 'border-color: var(--black) !important;'),
+  value(false, 'bd-white', 'border-color: var(--white) !important;'),
+  value(false, 'bd-info', 'border-color: var(--info) !important;'),
+  value(false, 'bd-error', 'border-color: var(--error) !important;'),
+  value(false, 'bd-warning', 'border-color: var(--warning) !important;'),
+  value(false, 'bd-success', 'border-color: var(--success) !important;'),
+  value(false, 'bd-muted', 'border-color: var(--muted) !important;'),
+  regex(true, 'bd\\-t\\-(\\d+)', 'border-color: var(--bd-$1) !important;'),
+  regex(true, 'bd\\-h\\-([0-9a-f]{3,6})', 'border-color: #$1;'),
+
+  value(false, 'bd-xs', 'border-width: 1px;'),
+  value(false, 'bd-sm', 'border-width: 2px;'),
+  value(false, 'bd-md', 'border-width: 3px;'),
+  value(false, 'bd-lg', 'border-width: 4px;'),
+  value(false, 'bd-xl', 'border-width: 5px;'),
+
+  value(false, 'bdx-xs', [
+    'border-left-width: 1px;', 
+    'border-right-width: 1px;'
+  ].join(' ')),
+  value(false, 'bdx-sm', [
+    'border-left-width: 2px;', 
+    'border-right-width: 2px;'
+  ].join(' ')),
+  value(false, 'bdx-md', [
+    'border-left-width: 3px;', 
+    'border-right-width: 3px;'
+  ].join(' ')),
+  value(false, 'bdx-lg', [
+    'border-left-width: 4px;', 
+    'border-right-width: 4px;'
+  ].join(' ')),
+  value(false, 'bdx-xl', [
+    'border-left-width: 5px;', 
+    'border-right-width: 5px;'
+  ].join(' ')),
+
+  value(false, 'bdy-xs', [
+    'border-top-width: 1px;', 
+    'border-bottom-width: 1px;'
+  ].join(' ')),
+  value(false, 'bdy-sm', [
+    'border-top-width: 2px;', 
+    'border-bottom-width: 2px;'
+  ].join(' ')),
+  value(false, 'bdy-md', [
+    'border-top-width: 3px;', 
+    'border-bottom-width: 3px;'
+  ].join(' ')),
+  value(false, 'bdy-lg', [
+    'border-top-width: 4px;', 
+    'border-bottom-width: 4px;'
+  ].join(' ')),
+  value(false, 'bdy-xl', [
+    'border-top-width: 5px;', 
+    'border-bottom-width: 5px;'
+  ].join(' ')),
+
+  value(false, 'bdt-xs', 'border-top-width: 1px;'),
+  value(false, 'bdt-sm', 'border-top-width: 2px;'),
+  value(false, 'bdt-md', 'border-top-width: 3px;'),
+  value(false, 'bdt-lg', 'border-top-width: 4px;'),
+  value(false, 'bdt-xl', 'border-top-width: 5px;'),
+
+  value(false, 'bdb-xs', 'border-bottom-width: 1px;'),
+  value(false, 'bdb-sm', 'border-bottom-width: 2px;'),
+  value(false, 'bdb-md', 'border-bottom-width: 3px;'),
+  value(false, 'bdb-lg', 'border-bottom-width: 4px;'),
+  value(false, 'bdb-xl', 'border-bottom-width: 5px;'),
+
+  value(false, 'bdl-xs', 'border-left-width: 1px;'),
+  value(false, 'bdl-sm', 'border-left-width: 2px;'),
+  value(false, 'bdl-md', 'border-left-width: 3px;'),
+  value(false, 'bdl-lg', 'border-left-width: 4px;'),
+  value(false, 'bdl-xl', 'border-left-width: 5px;'),
+
+  value(false, 'bdr-xs', 'border-right-width: 1px;'),
+  value(false, 'bdr-sm', 'border-right-width: 2px;'),
+  value(false, 'bdr-md', 'border-right-width: 3px;'),
+  value(false, 'bdr-lg', 'border-right-width: 4px;'),
+  value(false, 'bdr-xl', 'border-right-width: 5px;'),
+
+  range(true, 'bd-$', 'border-width: $px;', 0, 20),
+  range(true, 'bdb-$', 'border-bottom-width: $px;', 0, 20),
+  range(true, 'bdl-$', 'border-left-width: $px;', 0, 20),
+  range(true, 'bdr-$', 'border-right-width: $px;', 0, 20),
+  range(true, 'bdt-$', 'border-top-width: $px;', 0, 20),
+  range(true, 'bdx-$', [
+    'border-left-width: $px;', 
+    'border-right-width: $px;'
+  ].join(' '), 0, 20),
+
+  range(true, 'bdy-$', [
+    'border-top-width: $px;', 
+    'border-bottom-width: $px;'
+  ].join(' '), 0, 20),
+
+  value(true, 'curved', 'border-radius: 4px;'),
+  value(true, 'curved-l', 'border-radius: 4px 0 0 4px;'),
+  value(true, 'curved-r', 'border-radius: 0 4px 4px 0;'),
+  value(true, 'curved-t', 'border-radius: 4px 4px 0 0;'),
+  value(true, 'curved-b', 'border-radius: 0 0 4px 4px;'),
+  value(true, 'rounded', 'border-radius: 12px;'),
+  value(true, 'rounded-l', 'border-radius: 12px 0 0 12px;'),
+  value(true, 'rounded-r', 'border-radius: 0 12px 12px 0;'),
+  value(true, 'rounded-t', 'border-radius: 12px 12px 0 0;'),
+  value(true, 'rounded-b', 'border-radius: 0 0 12px 12px;'),
+  value(true, 'pill', 'border-radius: 10000px;'),
+  value(true, 'pill-l', 'border-radius: 10000px 0 0 10000px;'),
+  value(true, 'pill-r', 'border-radius: 0 10000px 10000px 0;'),
+  value(true, 'pill-t', 'border-radius: 10000px 10000px 0 0;'),
+  value(true, 'pill-b', 'border-radius: 0 0 10000px 10000px;'),
+
+  value(true, 'curve-xs', 'border-radius: 2px;'),
+  value(true, 'curve-sm', 'border-radius: 4px;'),
+  value(true, 'curve-md', 'border-radius: 6px;'),
+  value(true, 'curve-lg', 'border-radius: 8px;'),
+  value(true, 'curve-xl', 'border-radius: 12px;'),
+  value(true, 'curve-full', 'border-radius: 10000px;'),
+
+  value(true, 'curve-l-xs', 'border-radius: 2px 0 0 2px;'),
+  value(true, 'curve-l-sm', 'border-radius: 4px 0 0 4px;'),
+  value(true, 'curve-l-md', 'border-radius: 6px 0 0 6px;'),
+  value(true, 'curve-l-lg', 'border-radius: 8px 0 0 8px;'),
+  value(true, 'curve-l-xl', 'border-radius: 12px 0 0 12px;'),
+  value(true, 'curve-l-full', 'border-radius: 10000px 0 0 10000px;'),
+
+  value(true, 'curve-r-xs', 'border-radius: 0 2px 2px 0;'),
+  value(true, 'curve-r-sm', 'border-radius: 0 4px 4px 0;'),
+  value(true, 'curve-r-md', 'border-radius: 0 6px 6px 0;'),
+  value(true, 'curve-r-lg', 'border-radius: 0 8px 8px 0;'),
+  value(true, 'curve-r-xl', 'border-radius: 0 12px 12px 0;'),
+  value(true, 'curve-r-full', 'border-radius: 0 10000px 10000px 0;'),
+
+  value(true, 'curve-t-xs', 'border-radius: 2px 2px 0 0;'),
+  value(true, 'curve-t-sm', 'border-radius: 4px 4px 0 0;'),
+  value(true, 'curve-t-md', 'border-radius: 6px 6px 0 0;'),
+  value(true, 'curve-t-lg', 'border-radius: 8px 8px 0 0;'),
+  value(true, 'curve-t-xl', 'border-radius: 12px 12px 0 0;'),
+  value(true, 'curve-t-full', 'border-radius: 10000px 10000px 0 0;'),
+
+  value(true, 'curve-b-xs', 'border-radius: 0 0 2px 2px;'),
+  value(true, 'curve-b-sm', 'border-radius: 0 0 4px 4px;'),
+  value(true, 'curve-b-md', 'border-radius: 0 0 6px 6px;'),
+  value(true, 'curve-b-lg', 'border-radius: 0 0 8px 8px;'),
+  value(true, 'curve-b-xl', 'border-radius: 0 0 12px 12px;'),
+  value(true, 'curve-b-full', 'border-radius: 0 0 10000px 10000px;'),
+
+  regex(true, 'curve\\-(\\d+)', 'border-radius: $1px $1px $1px $1px;'),
+  regex(true, 'curve\\-b\\-(\\d+)', 'border-radius: 0 0 $1px $1px;'),
+  regex(true, 'curve\\-l\\-(\\d+)', 'border-radius: $1px 0 0 $1px;'),
+  regex(true, 'curve\\-r\\-(\\d+)', 'border-radius: 0 $1px $1px 0;'),
+  regex(true, 'curve\\-t\\-(\\d+)', 'border-radius: $1px $1px 0 0;'),
+
+  // Margin
+  value(true, 'm-auto', 'margin: auto;'),
+  value(true, 'mx-auto', [
+    'margin-left: auto;', 
+    'margin-right: auto;'
+  ].join(' ')),
+  regex(true, 'm\\-(\\-{0,1}\\d+)', 'margin: $1px;'),
+  regex(true, 'mb\\-(\\-{0,1}\\d+)', 'margin-bottom: $1px;'),
+  regex(true, 'ml\\-(\\-{0,1}\\d+)', 'margin-left: $1px;'),
+  regex(true, 'mr\\-(\\-{0,1}\\d+)', 'margin-right: $1px;'),
+  regex(true, 'mt\\-(\\-{0,1}\\d+)', 'margin-top: $1px;'),
+  regex(true, 'mx\\-(\\-{0,1}\\d+)', [
+    'margin-left: $1px;', 
+    'margin-right: $1px;'
+  ].join(' ')),
+  regex(true, 'my\\-(\\-{0,1}\\d+)', [
+    'margin-top: $1px;', 
+    'margin-bottom: $1px;'
+  ].join(' ')),
+
+  // Padding
+  regex(true, 'p\\-(\\d+)', 'padding: $1px;'),
+  regex(true, 'pb\\-(\\d+)', 'padding-bottom: $1px;'),
+  regex(true, 'pl\\-(\\d+)', 'padding-left: $1px;'),
+  regex(true, 'pr\\-(\\d+)', 'padding-right: $1px;'),
+  regex(true, 'pt\\-(\\d+)', 'padding-top: $1px;'),
+  regex(true, 'px\\-(\\d+)', [
+    'padding-left: $1px;', 
+    'padding-right: $1px;'
+  ].join(' ')),
+  regex(true, 'py\\-(\\d+)', [
+    'padding-top: $1px;', 
+    'padding-bottom: $1px;'
+  ].join(' ')),
+
+  // List
+  value(true, 'list-none', 'list-style: none;'),
+  value(true, 'list-disc', 'list-style: disc;'),
+  value(true, 'list-decimal', 'list-style: decimal;'),
+
+  // Select
+  value(true, 'select-none', 'user-select: none;'),
+  value(true, 'select-text', 'user-select: text;'),
+  value(true, 'select-all', 'user-select: all;'),
+  value(true, 'select-auto', 'user-select: auto;'),
+
+  //Cursor
+  value(true, 'cursor-pointer', 'cursor: pointer;'),
+  value(true, 'cursor-default', 'cursor: default;'),
+  value(true, 'cursor-move', 'cursor: move;'),
+  value(true, 'cursor-not-allowed', 'cursor: not-allowed;'),
+  value(true, 'cursor-help', 'cursor: help;'),
+  value(true, 'cursor-text', 'cursor: text;'),
+  value(true, 'cursor-auto', 'cursor: auto;'),
+  value(true, 'cursor-wait', 'cursor: wait;'),
+  value(true, 'cursor-crosshair', 'cursor: crosshair;'),
+
+  //Animation
+  regex(true, 'transition\\-(\\d+)', 'transition: $1ms;'),
+
+  // Box Shadow
+  regex(
+    true, 
+    'shadow\\-(\\d+)\\-(\\d+)\\-(\\d+)\\-(\\d+)\\-([0-9a-fA-F]{6})', 
+    'box-shadow: $1px $2px $3px $4px #$5;'
+  ),
+  regex(
+    true, 
+    'shadow\\-(\\d+)\\-(\\d+)\\-(\\d+)\\-(\\d+)\\-(\\d+)\\-(\\d+)\\-(\\d+)', 
+    'box-shadow: $1px $2px $3px rgb($4, $5, $6, 0.$7);'
+  )
+];
+
+export default utilities;
\ No newline at end of file
diff --git a/packages/temple-web/src/build.ts b/packages/temple-web/src/build.ts
index 707e586..e96c370 100644
--- a/packages/temple-web/src/build.ts
+++ b/packages/temple-web/src/build.ts
@@ -3,16 +3,18 @@ import type { TempleEvent, DocumentBuilder } from '@ossph/temple/compiler';
 import path from 'path';
 import { globSync as glob } from 'fast-glob';
 import temple, { cache } from '@ossph/temple/compiler';
+import { tui } from '@ossph/temple-ui';
 
 const docs = path.resolve(__dirname, '../../../docs');
 //create temple compiler
 const compiler = temple({ 
   brand: '',
   cwd: __dirname,
-  minify: false
-//enable cache
-})
-
+  minify: true
+});
+//use temple ui
+compiler.use(tui());
+//use cache
 compiler.use(cache({ 
   environment: 'production',
   buildPath: path.join(docs, 'build') 
diff --git a/packages/temple-web/src/components/api/docs.tml b/packages/temple-web/src/components/api/docs.tml
new file mode 100644
index 0000000..48fc6a5
--- /dev/null
+++ b/packages/temple-web/src/components/api/docs.tml
@@ -0,0 +1,8 @@
+
+
        {children()}
        
\ No newline at end of file
diff --git a/packages/temple-web/src/components/api/types.json b/packages/temple-web/src/components/api/types.json
new file mode 100644
index 0000000..7afd873
--- /dev/null
+++ b/packages/temple-web/src/components/api/types.json
@@ -0,0 +1,2240 @@
+{
+  "Asset": {
+    "type": {
+      "kind": "property",
+      "list": false,
+      "type":[ "text/html", "text/javascript", "text/css", "text/plain" ],
+      "description": "The MIME type of the build file asset"
+    }, 
+    "content": {
+      "kind": "property",
+      "list": false,
+      "type": "string",
+      "description": "The source code of the build file asset."
+    }
+  },
+  "Path": { 
+    "path": {
+      "kind": "property",
+      "list": false,
+      "type": "string",
+      "description": "The file path",
+      "example": "'/path/to/file'"
+    }, 
+    "type": {
+      "kind": "property",
+      "list": false,
+      "type": "string",
+      "description": "The type of path.",
+      "example": "'file'"
+    }
+  },
+  "Config": {
+    "brand": {
+      "kind": "property",
+      "list": false,
+      "type": "string",
+      "description": "The brand prefixed before the component tag name.",
+      "example": "'temple'"
+    },
+    "cwd": {
+      "kind": "property",
+      "list": false,
+      "type": "string",
+      "description": "The project's current working directory (cwd).",
+      "example": "'/path/to/project'"
+    },
+    "fs": {
+      "kind": "property",
+      "list": false,
+      "type": "FileSystem",
+      "description": "The file system being used to read/write files.",
+      "example": "import fs from 'fs';\n\nfs"
+    },
+    "emitter": {
+      "kind": "property",
+      "list": false,
+      "type": "EventEmitter",
+      "description": "The NodeJS EventEmitter instance being used.",
+      "example": "import EventEmitter from 'events';\n\nnew EventEmitter();"
+    },
+    "name?": {
+      "kind": "property",
+      "list": false,
+      "type": "string",
+      "description": "Custom name of component."
+    },
+    "type?": {
+      "kind": "property",
+      "list": false,
+      "type": ["document", "component", "template"],
+      "description": "Type of component"
+    },
+    "minify?": {
+      "kind": "property",
+      "list": false,
+      "type": "boolean",
+      "description": "Whether to minify the generated JavaScript code."
+    },
+    "tsconfig?": {
+      "kind": "property",
+      "list": false,
+      "type": "string",
+      "description": "The location of the used tsconfig.json.",
+      "example": "'/path/to/tsconfig.json'"
+    },
+    "component_extname?": {
+      "kind": "property",
+      "list": false,
+      "type": "string",
+      "description": "The component file extension.",
+      "example": "'.tml'"
+    },
+    "document_extname?": {
+      "kind": "property",
+      "list": false,
+      "type": "string",
+      "description": "The document file extension.",
+      "example": "'.dtml'"
+    }
+  },
+  "Import": {
+    "typeOnly": {
+      "kind": "property",
+      "list": false,
+      "type": "boolean",
+      "description": "Should import as type only.",
+      "example": "import type { Foo } from 'bar';"
+    },
+    "names?": {
+      "kind": "property",
+      "list": true,
+      "type": "string",
+      "description": "All the names imported",
+      "example": "import { Foo, Bar } from 'foobar';"
+    },
+    "default": {
+      "kind": "property",
+      "list": false,
+      "type": "string",
+      "description": "The default import name",
+      "example": "import foo from 'bar';"
+    },
+    "source":{
+      "kind": "property",
+      "list": false,
+      "type": "string",
+      "description": "The file path where names are imported from.",
+      "example": "import * from 'foobar';"
+    }
+  },
+  "Build": {
+    "source": {
+      "kind": "property",
+      "list": false,
+      "type": "string",
+      "description": "Returns the generated JavaScript source code.",
+      "example": "compiler.import('./docs/api.dtml').source; //server js code"
+    },
+    "TempleDocument": {
+      "kind": "property",
+      "list": false,
+      "type": "ServerDocumentClass",
+      "description": "Returns a server document class that can be instantiated.",
+      "example": "new (compiler.import('./docs/api.dtml').TempleDocument);"
+    },
+    "document": {
+      "kind": "property",
+      "list": false,
+      "type": "ServerDocument",
+      "description": "Returns the default instantiated document used to render the final HTML markup.",
+      "example": "compiler.import('./docs/api.dtml').document.render(); //..."
+    }
+  },
+  "CacheOptions": {
+    "buildPath": {
+      "kind": "property",
+      "list": false,
+      "type": "string",
+      "description": "The absolute path the build directory",
+      "example": "'/path/to/build'"
+    },
+    "manifestFile?": {
+      "kind": "property",
+      "list": false,
+      "type": "string",
+      "description": "The name of the manifest file.",
+      "example": "'manifest.json'"
+    },
+    "environment?": {
+      "kind": "property",
+      "list": false,
+      "type": "string",
+      "description": "The environment mode that will determine the cache strategy.",
+      "example": "'production' | 'development'"
+    }
+  },
+  "Component": {
+    "ast": {
+      "kind": "property",
+      "list": false,
+      "type": "AST",
+      "description": "Returns an abstract syntax tree (AST) interpretation of the component.",
+      "example": "component.ast.markup;"
+    },
+    "brand": {
+      "kind": "property",
+      "list": false,
+      "type": "string",
+      "description": "Returns the brand prefixed before the component tag name.",
+      "example": "component.brand; //--> 'temple'"
+    },
+    "classname": {
+      "kind": "property",
+      "list": false,
+      "type": "string",
+      "description": "Returns the suggested class name of the component.",
+      "example": "component.classname; //--> 'Button_abc123'"
+    },
+    "components":{
+      "kind": "property",
+      "list": true,
+      "type": "Component",
+      "description": "Returns a list of child components imported by this component.",
+      "example": "component.components[0].brand; //--> 'temple'"
+    },
+    "contents": {
+      "kind": "property",
+      "list": false,
+      "type": "string",
+      "description": "Returns the raw temple source code.",
+      "example": "component.contents;"
+    },
+    "cwd": {
+      "kind": "property",
+      "list": false,
+      "type": "string",
+      "description": "Returns the project's current working directory (cwd).",
+      "example": "component.cwd; //--> '/path/to/project'"
+    },
+    "dependencies": {
+      "kind": "property",
+      "list": true,
+      "type": "{ path: string, type: string }",
+      "description": "Returns all the files this component imports sorted by type.",
+      "example": "component.dependencies; //--> [{ type: 'file', path: './random/file' }, ...]"
+    },
+    "dirname": {
+      "kind": "property",
+      "list": false,
+      "type": "string",
+      "description": "Returns the directory name where this component file exists.",
+      "example": "component.dirname;"
+    },
+    "fs": {
+      "kind": "property",
+      "list": false,
+      "type": "FileSystem",
+      "description": "Returns the file system being used to read/write files.",
+      "example": "component.fs;"
+    },
+    "id":{
+      "kind": "property",
+      "list": false,
+      "type": "string",
+      "description": "Returns a unique component ID used for build files.",
+      "example": "component.id;"
+    },
+    "imports": {
+      "kind": "property",
+      "list": true,
+      "type": "Import",
+      "description": "Returns the files imported by this component. This does not include any component files.",
+      "example": "component.imports;"
+    },
+    "markup": {
+      "kind": "property",
+      "list": true,
+      "type": "Token",
+      "description": "Returns the markup abstract syntax tree.",
+      "example": "component.markup;"
+    },
+    "loader": {
+      "kind": "property",
+      "list": false,
+      "type": "FileLoader",
+      "description": "Returns the file loader used to resolve paths of imported files.",
+      "example": "component.loader.absolute('./path/to/some/file');"
+    },
+    "parent": {
+      "kind": "property",
+      "list": false,
+      "type": "Component|null",
+      "description": "Returns the parent component, if any.",
+      "example": "component.parent;"
+    },
+    "registry": {
+      "kind": "property",
+      "list": false,
+      "type": "Record",
+      "description": "Returns all child components and sub-child components.",
+      "example": "component.registry;"
+    },
+    "relative": {
+      "kind": "property",
+      "list": false,
+      "type": "string",
+      "description": "Returns the source file path relative to the current working directory (cwd).",
+      "example": "component.contents;"
+    },
+    "source": {
+      "kind": "property",
+      "list": false,
+      "type": "string",
+      "description": "Returns the source file path. This may or may not be the absolute path.",
+      "example": "component.source;"
+    },
+    "scripts": {
+      "kind": "property",
+      "list": true,
+      "type": "string",
+      "description": "Returns all the collective JavaScript in the temple source file.",
+      "example": "component.scripts;"
+    },
+    "styles": {
+      "kind": "property",
+      "list": true,
+      "type": "string",
+      "description": "Returns all the collective CSS styles in the temple source file.",
+      "example": "component.styles;"
+    },
+    "tagname": {
+      "kind": "property",
+      "list": false,
+      "type": "string",
+      "description": "Returns the suggested HTML tag name.",
+      "example": "component.tagname;"
+    },
+    "type": {
+      "kind": "property",
+      "list": false,
+      "type": ["document", "component", "template"],
+      "description": "Returns type of component. Will transpile depending on the type.",
+      "example": "component.type;"
+    }
+  },
+  "EventEmitter": {
+    "render": {
+      "kind": "event",
+      "params": { 
+        "builder": {
+          "kind": "property",
+          "list": false,
+          "type": "DocumentBuilder"
+        }, 
+        "build": {
+          "kind": "property",
+          "list": false,
+          "type": "Build"
+        }, 
+        "props": {
+          "kind": "property",
+          "list": false,
+          "type": "Hash"
+        } 
+      },
+      "data": {
+        "kind": "property",
+        "list": false,
+        "type": "string"
+      },
+      "description": "Triggers before the document is rendered.",
+      "example": "compiler.emitter.on('render', e => {\n  const { builder, build, props } = e.params;\n  //...\n  e.data = 'new html...';\n});"
+    },
+    "rendered": {
+      "kind": "event",
+      "params": { 
+        "builder": {
+          "kind": "property",
+          "list": false,
+          "type": "DocumentBuilder"
+        }, 
+        "build": {
+          "kind": "property",
+          "list": false,
+          "type": "Build"
+        }, 
+        "props": {
+          "kind": "property",
+          "list": false,
+          "type": "Hash"
+        } , 
+        "html": {
+          "kind": "property",
+          "list": false,
+          "type": "string"
+        } 
+      },
+      "data": {
+        "kind": "property",
+        "list": false,
+        "type": "string"
+      },
+      "description": "Triggers after the document is rendered.",
+      "example": "compiler.emitter.on('rendered', e => {\n  const { builder, build, props, html } = e.params;\n  //...\n  e.data = 'new html...';\n});"
+    },
+    "build": {
+      "kind": "event",
+      "params": { 
+        "builder": {
+          "kind": "property",
+          "list": false,
+          "type": "DocumentBuilder"
+        }
+      },
+      "data": {
+        "kind": "property",
+        "list": false,
+        "type": "string"
+      },
+      "description": "Triggers before the document is built.",
+      "example": "compiler.emitter.on('build', e => {\n  const { builder } = e.params;\n  //...\n  e.data = 'new temple source...';\n});"
+    },
+    "built": {
+      "kind": "event",
+      "params": { 
+        "builder": {
+          "kind": "property",
+          "list": false,
+          "type": "DocumentBuilder"
+        }, 
+        "build": {
+          "kind": "property",
+          "list": false,
+          "type": "Build"
+        }
+      },
+      "data": {
+        "kind": "property",
+        "list": false,
+        "type": "Build"
+      },
+      "description": "Triggers after the document is built.",
+      "example": "compiler.emitter.on('built', e => {\n  const { builder, build } = e.params;\n  //...\n  e.data = { ...build };\n});"
+    },
+    "build-client": {
+      "kind": "event",
+      "params": { 
+        "builder": {
+          "kind": "property",
+          "list": false,
+          "type": "DocumentBuilder"
+        }
+      },
+      "data": {
+        "kind": "property",
+        "list": false,
+        "type": "string"
+      },
+      "description": "Triggers before the client js is rendered.",
+      "example": "compiler.emitter.on('build-client', e => {\n  const { builder } = e.params;\n  //...\n  e.data = 'new temple source...';\n});"
+    },
+    "built-client": {
+      "kind": "event",
+      "params": { 
+        "builder": {
+          "kind": "property",
+          "list": false,
+          "type": "DocumentBuilder"
+        }, 
+        "build": {
+          "kind": "property",
+          "list": false,
+          "type": "Build"
+        }
+      },
+      "data": {
+        "kind": "property",
+        "list": false,
+        "type": "string"
+      },
+      "description": "Triggers after the client js is rendered.",
+      "example": "compiler.emitter.on('built-client', e => {\n  const { builder, build } = e.params;\n  //...\n  e.data = 'new client js...';\n});"
+    },
+    "build-markup": {
+      "kind": "event",
+      "params": { 
+        "builder": {
+          "kind": "property",
+          "list": false,
+          "type": "DocumentBuilder"
+        }
+      },
+      "data": {
+        "kind": "property",
+        "list": false,
+        "type": "string"
+      },
+      "description": "Triggers before markup is rendered.",
+      "example": "compiler.emitter.on('build-markup', e => {\n  const { builder } = e.params;\n  //...\n  e.data = 'new temple source...';\n});"
+    },
+    "built-markup": {
+      "kind": "event",
+      "params": { 
+        "builder": {
+          "kind": "property",
+          "list": false,
+          "type": "DocumentBuilder"
+        }, 
+        "build": {
+          "kind": "property",
+          "list": false,
+          "type": "Build"
+        }
+      },
+      "data": {
+        "kind": "property",
+        "list": false,
+        "type": "string"
+      },
+      "description": "Triggers after markup is rendered.",
+      "example": "compiler.emitter.on('built-markup', e => {\n  const { builder, build } = e.params;\n  //...\n  e.data = 'new markup...';\n});"
+    },
+    "build-server": {
+      "kind": "event",
+      "params": { 
+        "builder": {
+          "kind": "property",
+          "list": false,
+          "type": "DocumentBuilder"
+        }
+      },
+      "data": {
+        "kind": "property",
+        "list": false,
+        "type": "string"
+      },
+      "description": "Triggers before the server js is rendered.",
+      "example": "compiler.emitter.on('build-server', e => {\n  const { builder } = e.params;\n  //...\n  e.data = 'new temple source...';\n});"
+    },
+    "built-server": {
+      "kind": "event",
+      "params": { 
+        "builder": {
+          "kind": "property",
+          "list": false,
+          "type": "DocumentBuilder"
+        }, 
+        "build": {
+          "kind": "property",
+          "list": false,
+          "type": "Build"
+        }
+      },
+      "data": {
+        "kind": "property",
+        "list": false,
+        "type": "string"
+      },
+      "description": "Triggers after the server js is rendered.",
+      "example": "compiler.emitter.on('built-server', e => {\n  const { builder, build } = e.params;\n  //...\n  e.data = 'new server js...';\n});"
+    },
+    "build-styles": {
+      "kind": "event",
+      "params": { 
+        "builder": {
+          "kind": "property",
+          "list": false,
+          "type": "DocumentBuilder"
+        } 
+      },
+      "data": {
+        "kind": "property",
+        "list": false,
+        "type": "string"
+      },
+      "description": "Triggers before the css styles are rendered.",
+      "example": "compiler.emitter.on('build-styles', e => {\n  const { builder } = e.params;\n  //...\n  e.data = 'new temple source...';\n});"
+    },
+    "built-styles": {
+      "kind": "event",
+      "params": { 
+        "builder": {
+          "kind": "property",
+          "list": false,
+          "type": "DocumentBuilder"
+        }, 
+        "build": {
+          "kind": "property",
+          "list": false,
+          "type": "Build"
+        }
+      },
+      "data": {
+        "kind": "property",
+        "list": false,
+        "type": "string"
+      },
+      "description": "Triggers after the css styles is rendered.",
+      "example": "compiler.emitter.on('built-styles', e => {\n  const { builder, build } = e.params;\n  //...\n  e.data = 'new css...';\n});"
+    },
+    "manifest-load": {
+      "kind": "event",
+      "params": { 
+        "manifest": {
+          "kind": "property",
+          "list": false,
+          "type": "DocumentManifest"
+        }, 
+        "map": {
+          "kind": "property",
+          "list": false,
+          "type": "Map"
+        }
+      },
+      "data": {
+        "kind": "property",
+        "list": false,
+        "type": "Map"
+      },
+      "description": "Triggers before the manifest is loaded.",
+      "example": "compiler.emitter.on('manifest-load', e => {\n  const { manifest, map } = e.params;\n  //...\n  e.data = new Map();\n});"
+    },
+    "manifest-resolve": {
+      "kind": "event",
+      "params": { 
+        "manifest": {
+          "kind": "property",
+          "list": false,
+          "type": "DocumentManifest"
+        }, 
+        "id": {
+          "kind": "property",
+          "list": false,
+          "type": "string"
+        }
+      },
+      "description": "Triggers before a build ID is resolved.",
+      "example": "compiler.emitter.on('manifest-resolve', e => {\n  const { manifest, id } = e.params;\n  //...\n});"
+    },
+    "manifest-resolved": {
+      "kind": "event",
+      "params": { 
+        "manifest": {
+          "kind": "property",
+          "list": false,
+          "type": "DocumentManifest"
+        }, 
+        "id": {
+          "kind": "property",
+          "list": false,
+          "type": "string"
+        },
+        "path": {
+          "kind": "property",
+          "list": false,
+          "type": "string"
+        }
+      },
+      "data": {
+        "kind": "property",
+        "list": false,
+        "type": "Map"
+      },
+      "description": "Triggers after a build ID/entry is set.",
+      "example": "compiler.emitter.on('manifest-resolved', e => {\n  const { manifest, id, path } = e.params;\n  //...\n});"
+    },
+    "manifest-unresolved": {
+      "kind": "event",
+      "params": { 
+        "manifest": {
+          "kind": "property",
+          "list": false,
+          "type": "DocumentManifest"
+        }, 
+        "id": {
+          "kind": "property",
+          "list": false,
+          "type": "string"
+        },
+        "path": {
+          "kind": "property",
+          "list": false,
+          "type": "string|undefined"
+        }
+      },
+      "data": {
+        "kind": "property",
+        "list": false,
+        "type": "Map"
+      },
+      "description": "Triggers after a build ID is deleted.",
+      "example": "compiler.emitter.on('manifest-unresolved', e => {\n  const { manifest, id, path } = e.params;\n  //...\n});"
+    }
+  },
+  "DocumentManifest": {
+    "emitter": {
+      "kind": "property",
+      "list": false,
+      "type": "EventEmitter",
+      "description": "The NodeJS EventEmitter instance being used.",
+      "example": "compiler.manifest.emitter.on('render', e => {\n  console.log(e.params);\n});"
+    },
+    "registry": {
+      "kind": "property",
+      "list": false,
+      "type": "Map",
+      "description": "The manifest registry used to map build IDs to document entry files.",
+      "example": "compiler.manifest.registry.entries();"
+    },
+    "builder": {
+      "kind": "function",
+      "async": false,
+      "args": [
+        {
+          "kind": "property",
+          "list": false,
+          "name": "id",
+          "type": "string"
+        }
+      ],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "DocumentBuilder"
+      },
+      "description": "Returns a document builder given the build id.",
+      "example": "compiler.manifest.builder('abc123');"
+    },
+    "delete": {
+      "kind": "function",
+      "async": false,
+      "args": [
+        {
+          "kind": "property",
+          "list": false,
+          "name": "id",
+          "type": "string"
+        }
+      ],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "DocumentManifest"
+      },
+      "description": "Removes an entry file from the manifest given the build id.",
+      "example": "compiler.manifest.delete('abc123');"
+    },
+    "entries": {
+      "kind": "function",
+      "async": false,
+      "args": [],
+      "returns": {
+        "kind": "property",
+        "list": true,
+        "type": "[ string, string ]"
+      },
+      "description": "Returns an array of build IDs and entry file paths.",
+      "example": "compiler.manifest.entries();"
+    },
+    "get": {
+      "kind": "function",
+      "async": false,
+      "args": [
+        {
+          "kind": "property",
+          "name": "id",
+          "type": "string"
+        }
+      ],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "string"
+      },
+      "description": "Returns the entry file path given the build id.",
+      "example": "compiler.manifest.get('abc123');"
+    },
+    "has": {
+      "kind": "function",
+      "async": false,
+      "args": [
+        {
+          "kind": "property",
+          "name": "id",
+          "type": "string"
+        }
+      ],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "boolean"
+      },
+      "description": "Returns true if the build id exists in the manifest.",
+      "example": "compiler.manifest.has('abc123');"
+    },
+    "load": {
+      "kind": "function",
+      "async": false,
+      "args": [
+        {
+          "kind": "property",
+          "name": "manifest",
+          "type": "Record"
+        }
+      ],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "DocumentManifest"
+      },
+      "description": "Loads an entire manifest object to the registry.",
+      "example": "compiler.manifest.load({ abc123: '/path/to/entry.dtml' });"
+    },
+    "keys": {
+      "kind": "function",
+      "async": false,
+      "args": [],
+      "returns": {
+        "kind": "property",
+        "list": true,
+        "type": "string"
+      },
+      "description": "Returns an array of build IDs.",
+      "example": "compiler.manifest.keys();"
+    },
+    "set": {
+      "kind": "function",
+      "async": false,
+      "args": [
+        {
+          "kind": "property",
+          "name": "id",
+          "type": "string"
+        },
+        {
+          "kind": "property",
+          "name": "path",
+          "type": "string"
+        }
+      ],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "DocumentManifest"
+      },
+      "description": "Sets an entry file path to the manifest given the build id.",
+      "example": "compiler.manifest.set('abc123', '/path/to/entry.dtml');"
+    },
+    "toJson": {
+      "kind": "function",
+      "async": false,
+      "args": [],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "string"
+      },
+      "description": "Returns the manifest as a JSON string.",
+      "example": "compiler.manifest.toJson();"
+    },
+    "values": {
+      "kind": "function",
+      "async": false,
+      "args": [],
+      "returns": {
+        "kind": "property",
+        "list": true,
+        "type": "string"
+      },
+      "description": "Returns an array of entry file paths.",
+      "example": "compiler.manifest.values();"
+    }
+  },
+  "DocumentTranspiler": {
+    "directive": {
+      "kind": "function",
+      "async": false,
+      "args": [
+        {
+          "kind": "property",
+          "name": "directive",
+          "type": "DirectiveInterface"
+        }
+      ],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "DocumentTranspiler"
+      },
+      "description": "Adds a directive that transpiles custom markup tags like if/elif/else, each, try/catch.",
+      "example": "compiler.fromSource('./docs/api.dtml').transpiler.directive(CustomDirective);"
+    },
+    "transpile": {
+      "kind": "function",
+      "args": [],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "SourceFile"
+      }
+    },
+    "description": "Converts a temple file to server-side JavaScript.",
+    "example": "compiler.fromSource('./docs/api.dtml').transpiler.transpile();"
+  },
+  "DocumentBuilder": {
+    "document": {
+      "kind": "property",
+      "list": false,
+      "type": "Component",
+      "description": "Returns a document component with various meta information, used for transpilation.",
+      "example": "compiler.fromSource('./docs/api.dtml').document.classname; //--> 'Index_abc123'"
+    },
+    "emitter": {
+      "kind": "property",
+      "list": false,
+      "type": "EventEmitter",
+      "description": "The NodeJS EventEmitter instance being used.",
+      "example": "compiler.fromSource('./docs/api.dtml').emitter.on('render', e => {\n  console.log(e.params);\n});"
+    },
+    "extnames": {
+      "kind": "property",
+      "list": true,
+      "type": "string",
+      "description": "Returns the file extensions that are recognized to parse as Temple components.",
+      "example": "compiler.fromSource('./docs/api.dtml').extnames; //--> [ 'tml', 'dtml' ]"
+    },
+    "transpiler": {
+      "kind": "property",
+      "list": false,
+      "type": "DocumentTranspiler",
+      "description": "Returns a transpiler used to convert a temple file to server-side JavaScript.",
+      "example": "compiler.fromSource('./docs/api.dtml').transpiler.transpile();"
+    },
+    "tsconfig":  {
+      "kind": "property",
+      "list": false,
+      "type": "string",
+      "description": "Returns the location of the used tsconfig.json.",
+      "example": "compiler.fromSource('./docs/api.dtml').tsconfig; //--> /path/to/tsconfig.json"
+    },
+    "build": {
+      "kind": "function",
+      "async": true,
+      "args": [],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "Build"
+      },
+      "description": "Generates the server-side component and brings it into the runtime.",
+      "example": "compiler.fromSource('./docs/api.dtml').build();"
+    },
+    "client": {
+      "kind": "function",
+      "async": true,
+      "args": [],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "string"
+      },
+      "description": "Generates the browser-side JavaScript.",
+      "example": "compiler.fromSource('./docs/api.dtml').client(); //client js code"
+    },
+    "component": {
+      "kind": "function",
+      "async": true,
+      "args": [],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "string"
+      },
+      "description": "Generates the source file as an independent component.",
+      "example": "compiler.fromSource('./docs/my-button.tml').component(); //component js code"
+    },
+    "markup": {
+      "kind": "function",
+      "async": true,
+      "args": [],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "string"
+      },
+      "description": "Generates the html markup.",
+      "example": "compiler.fromSource('./docs/api.dtml').markup(); //..."
+    },
+    "server": {
+      "kind": "function",
+      "async": true,
+      "args": [],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "string"
+      },
+      "description": "Generates the server-side JavaScript.",
+      "example": "compiler.fromSource('./docs/api.dtml').markup(); //server js code"
+    },
+    "styles": {
+      "kind": "function",
+      "async": true,
+      "args": [],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "string"
+      },
+      "description": "Generates the css styles.",
+      "example": "compiler.fromSource('./docs/api.dtml').styles(); //css code"
+    }
+  },
+  "ServerDocumentClass": {
+    "component": {
+      "kind": "property",
+      "list": false,
+      "type": "[ string, string ]",
+      "description": "Returns the component tag name and class name.",
+      "example": "compiler.import('./docs/api.dtml').TempleDocument.component; //--> [ 'tui-button', 'TuiButton_abc123' ]"
+    },
+    "new": {
+      "kind": "function",
+      "args": [],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "ServerDocument"
+      },
+      "description": "Instantiates the server document class on the server-side used to render the final HTML.",
+      "example": "new (compiler.import('./docs/api.dtml').TempleDocument);"
+    }
+  },
+  "ServerDocument": {
+    "id": {
+      "kind": "function",
+      "args": [],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "string"
+      },
+      "description": "Returns a unique document ID used to map the build cache.",
+      "example": "compiler.import('./docs/api.dtml').document.id(); //--> 'abc123'"
+    },
+    "styles": {
+      "kind": "function",
+      "args": [],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "string"
+      },
+      "description": "Returns the css styles for this document.",
+      "example": "compiler.import('./docs/api.dtml').document.styles(); //css styles"
+    },
+    "template": {
+      "template": "function",
+      "args": [],
+      "returns": {
+        "kind": "property",
+        "list": true,
+        "type": "Element"
+      },
+      "description": "Returns an array of Element children and sub-children.",
+      "example": "compiler.import('./docs/api.dtml').document.template();"
+    },
+    "render": {
+      "kind": "function",
+      "args": [
+        {
+          "kind": "property",
+          "name": "props",
+          "type": "Record"
+        }
+      ],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "string"
+      },
+      "description": "Returns the final document HTML markup.",
+      "example": "compiler.import('./docs/api.dtml').document.render();"
+    }
+  },
+  "TempleOptions": {
+    "brand?": {
+      "kind": "property",
+      "list": false,
+      "type": "string",
+      "description": "The brand prefixed before the component tag name.",
+      "example": "const compiler = temple({ brand: 'temple' });"
+    },
+    "cwd?": {
+      "kind": "property",
+      "list": false,
+      "type": "string",
+      "description": "The project's current working directory (cwd).",
+      "example": "const compiler = temple({ cwd: '/path/to/project' });'"
+    },
+    "fs?": {
+      "kind": "property",
+      "list": false,
+      "type": "FileSystem",
+      "description": "The file system being used to read/write files.",
+      "example": "import fs from 'fs';\n\nconst compiler = temple({ fs });'"
+    },
+    "emitter?": {
+      "kind": "property",
+      "list": false,
+      "type": "EventEmitter",
+      "description": "The NodeJS EventEmitter instance being used.",
+      "example": "import emitter from 'events';\n\nconst compiler = temple({ emitter });'"
+    },
+    "minify?": {
+      "kind": "property",
+      "list": false,
+      "type": "boolean",
+      "description": "Whether to minify the generated JavaScript code.",
+      "example": "const compiler = temple({ minify: true });'"
+    },
+    "tsconfig?": {
+      "kind": "property",
+      "list": false,
+      "type": "string",
+      "description": "The location of the used tsconfig.json.",
+      "example": "const compiler = temple({ tsconfig: '/path/to/tsconfig.json' });'"
+    },
+    "component_extname?": {
+      "kind": "property",
+      "list": false,
+      "type": "string",
+      "description": "The component file extension.",
+      "example": "const compiler = temple({ component_extname: '.tml' });'"
+    },
+    "document_extname?": {
+      "kind": "property",
+      "list": false,
+      "type": "string",
+      "description": "The document file extension.",
+      "example": "const compiler = temple({ document_extname: '.dtml' });'"
+    }
+  },
+  "TempleCompiler": {
+    "config": {
+      "kind": "property",
+      "list": false,
+      "type": "Config",
+      "description": "The Temple configuration",
+      "example": "compiler.config.brand; //--> 'temple'"
+    },
+    "fs": {
+      "kind": "property",
+      "list": false,
+      "type": "FileSystem",
+      "description": "The file system being used.",
+      "example": "compiler.fs.readFileSync('some/file', 'utf8');"
+    },
+    "emitter": {
+      "kind": "property",
+      "list": false,
+      "type": "EventEmitter",
+      "description": "The NodeJS EventEmitter instance being used.",
+      "example": "compiler.emitter.on('render', e => {\n  console.log(e.params);\n});"
+    },
+    "manifest": {
+      "kind": "property",
+      "list": false,
+      "type": "DocumentManifest",
+      "description": "The manifest registry used to map build IDs to document entry files.",
+      "example": "compiler.manifest.entries();"
+    },
+    "component": {
+      "kind": "function",
+      "args": [],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "Component"
+      }
+    },
+    "fromId": {
+      "kind": "function",
+      "args": [
+        {
+          "kind": "property",
+          "list": false,
+          "name": "id",
+          "type": "string"
+        }
+      ],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "DocumentBuilder"
+      },
+      "description": "Returns a new DocumentBuilder instance given a build ID.",
+      "example": "compiler.fromId('abc123').build();"
+    },
+    "fromCache": {
+      "kind": "function",
+      "args": [
+        {
+          "kind": "property",
+          "list": false,
+          "name": "cacheFile",
+          "type": "string"
+        }
+      ],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "Build"
+      },
+      "description": "Returns build information from a compiled template.",
+      "example": "compiler.fromCache('/path/to/build/abc123.js').document.render();"
+    },
+    "fromSource": {
+      "kind": "function",
+      "args": [
+        {
+          "kind": "property",
+          "list": false,
+          "name": "sourceFile",
+          "type": "string"
+        }
+      ],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "DocumentBuilder"
+      },
+      "description": "Returns a new DocumentBuilder instance given a template source file.",
+      "example": "compiler.fromSource('./docs/api.dtml').build();"
+    },
+    "use": {
+      "kind": "function",
+      "args": [
+        {
+          "kind": "property",
+          "list": false,
+          "name": "options",
+          "type": "Function"
+        }
+      ],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "TempleCompiler"
+      },
+      "description": "Enables a default build cache strategy.",
+      "example": "compiler.use(plugin)"
+    },
+    "asset": {
+      "kind": "function",
+      "async": true,
+      "args": [
+        {
+          "kind": "property",
+          "list": false,
+          "name": "assetFile",
+          "type": "string"
+        }
+      ],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "Asset"
+      },
+      "description": "Returns a compiled build asset, given an asset file name.",
+      "example": "compiler.asset('abc123.css'); //--> { type: 'text/css', content: '...' }"
+    },
+    "client": {
+      "kind": "function",
+      "async": true,
+      "args": [
+        {
+          "kind": "property",
+          "list": false,
+          "name": "sourceFile",
+          "type": "string"
+        }
+      ],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "string"
+      },
+      "description": "Returns a compiled client script, given the the template source file.",
+      "example": "compiler.client('./docs/api.dtml'); //client script"
+    },
+    "import": {
+      "kind": "function",
+      "async": true,
+      "args": [
+        {
+          "kind": "property",
+          "list": false,
+          "name": "sourceFile",
+          "type": "string"
+        }
+      ],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "Build"
+      },
+      "description": "Returns build information, given the the template source file.",
+      "example": "compiler.import('/path/to/build/abc123.js').document.render();"
+    },
+    "markup": {
+      "kind": "function",
+      "async": true,
+      "args": [
+        {
+          "kind": "property",
+          "list": false,
+          "name": "sourceFile",
+          "type": "string"
+        }
+      ],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "string"
+      },
+      "description": "Returns a compiled markup, given the the template source file.",
+      "example": "compiler.markup('./docs/api.dtml'); //--> ..."
+    },
+    "render":  {
+      "kind": "function",
+      "async": true,
+      "args": [
+        {
+          "kind": "property",
+          "list": false,
+          "name": "sourceFile",
+          "type": "string"
+        },
+        {
+          "kind": "property",
+          "list": false,
+          "name": "props",
+          "type": "Hash"
+        }
+      ],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "string"
+      },
+      "description": "Returns the final HTML markup, given the the template source file.",
+      "example": "compiler.render('./docs/api.dtml', {\n  title: 'API Documentation'\n});"
+    },
+    "server": {
+      "kind": "function",
+      "async": true,
+      "args": [
+        {
+          "kind": "property",
+          "list": false,
+          "name": "sourceFile",
+          "type": "string"
+        }
+      ],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "string"
+      },
+      "description": "Returns compiled server code, given the the template source file.",
+      "example": "compiler.server('./docs/api.dtml'); // server script"
+    },
+    "styles": {
+      "kind": "function",
+      "async": true,
+      "args": [
+        {
+          "kind": "property",
+          "list": false,
+          "name": "sourceFile",
+          "type": "string"
+        }
+      ],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "string"
+      },
+      "description": "Returns compiled css styles, given the the template source file.",
+      "example": "compiler.styles('./docs/api.dtml'); //css styles"
+    }
+  },
+  "TempleComponent": {
+    "attr": {
+      "kind": "property",
+      "list": false,
+      "type": "Hash",
+      "description": "Returns only the valid HTML tag attributes (string and true).",
+      "example": "this.attr; //--> { disabled: true, type: 'button' }"
+    },
+    "props": {
+      "kind": "property",
+      "list": false,
+      "type": "Hash",
+      "description": "Returns all the attributes assigned to the component.",
+      "example": "this.props; //--> { disabled: true, count: 4, click: handleClick }"
+    },
+    "metadata": {
+      "kind": "property",
+      "list": false,
+      "type": "[ string, string ]",
+      "description": "Returns the tag and class name of the component.",
+      "example": "this.metadata; //--> [ 'fancy-button', 'FancyButton_abc123' ]"
+    },
+    "styles": {
+      "kind": "function",
+      "args": [],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "string"
+      },
+      "description": "Returns the css styles used in the component.",
+      "example": "this.styles(); //css styles"
+    },
+    "template": {
+      "kind": "function",
+      "args": [],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "Node[]"
+      },
+      "description": "Returns a function that returns an array of elements, text nodes and web components",
+      "example": "this.template(); //--> () => [ Element, Text, Element, ... ]"
+    },
+    "render": {
+      "kind": "function",
+      "args": [],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "string"
+      },
+      "description": "Renders the children and returns the final HTML markup.",
+      "example": "this.render(); //--> '
        ...
        '"
+    }
+  },
+  "TempleRegistry": {
+    "elements": {
+      "kind": "property",
+      "list": false,
+      "type": "Map",
+      "description": "Returns a map of elements used in the DOM.",
+      "example": "TempleAPI.TempleRegistry.elements.get(component);"
+    },
+    "createComponent": {
+      "kind": "function",
+      "args": [
+        {
+          "kind": "property",
+          "list": false,
+          "name": "tagname",
+          "type": "string"
+        },
+        {
+          "kind": "property",
+          "list": false,
+          "name": "component",
+          "type": "TempleComponent"
+        },
+        {
+          "kind": "property",
+          "list": false,
+          "name": "props",
+          "type": "Hash"
+        },
+        {
+          "kind": "property",
+          "list": false,
+          "name": "children>",
+          "type": "Node[]"
+        }
+      ],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "TempleElement"
+      },
+      "description": "Creates a TempleElement from a web component class.",
+      "example": "TempleAPI.TempleRegistry.createComponent('fancy-button', TempleComponent, { title: 'Hello' }, children);"
+    },
+    "createElement": {
+      "kind": "function",
+      "args": [
+        {
+          "kind": "property",
+          "list": false,
+          "name": "tagname",
+          "type": "string"
+        },
+        {
+          "kind": "property",
+          "list": false,
+          "name": "props",
+          "type": "Hash"
+        },
+        {
+          "kind": "property",
+          "list": false,
+          "name": "children>",
+          "type": "Node[]"
+        }
+      ],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "TempleElement"
+      },
+      "description": "Creates a TempleElement from a string tag name.",
+      "example": "TempleAPI.TempleRegistry.createElement('a', { href: '/' }, children);"
+    },
+    "createText": {
+      "kind": "function",
+      "args": [
+        {
+          "kind": "property",
+          "list": false,
+          "name": "text",
+          "type": "string"
+        }
+      ],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "TextNode"
+      },
+      "description": "Creates a TextNode from a raw string.",
+      "example": "TempleAPI.TempleRegistry.createText('foo');"
+    },
+    "get": {
+      "kind": "function",
+      "args": [
+        {
+          "kind": "property",
+          "list": false,
+          "name": "element",
+          "type": "Element"
+        }
+      ],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "TempleElement"
+      },
+      "description": "Returns a TempleElement given a DOM element.",
+      "example": "TempleAPI.TempleRegistry.get(element)"
+    },
+    "has": {
+      "kind": "function",
+      "args": [
+        {
+          "kind": "property",
+          "list": false,
+          "name": "element",
+          "type": "Element"
+        }
+      ],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "boolean"
+      },
+      "description": "Returns true if the given element exists in the registry",
+      "example": "TempleAPI.TempleRegistry.has(element)"
+    },
+    "map": {
+      "kind": "function",
+      "args": [
+        {
+          "kind": "property",
+          "list": false,
+          "name": "callback",
+          "type": "Function"
+        }
+      ],
+      "returns": {
+        "kind": "property",
+        "list": true,
+        "type": "T"
+      },
+      "description": "Like array map for registry returns an array of whatever the callback returns.",
+      "example": "TempleAPI.TempleRegistry.map((temple, element) => [temple, element]);"
+    },
+    "register": {
+      "kind": "function",
+      "args": [
+        {
+          "kind": "property",
+          "list": false,
+          "name": "element",
+          "type": "TempleElement"
+        },
+        {
+          "kind": "property",
+          "list": false,
+          "name": "props",
+          "type": "Hash"
+        }
+      ],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "TempleElement"
+      },
+      "description": "Registers a TempleElement to the registry.",
+      "example": "TempleAPI.TempleRegistry.register(element, { foo: 'bar' });"
+    }
+  },
+  "TempleElement": {
+    "attributes": {
+      "kind": "property",
+      "list": false,
+      "type": "Hash",
+      "description": "Returns all the attributes assigned to the element.",
+      "example": "element.attributes; //--> { href: '/', title: 'Home' }"
+    },
+    "element": {
+      "kind": "property",
+      "list": false,
+      "type": "Element",
+      "description": "Returns the DOM element.",
+      "example": "element.element; //--> "
+    },
+    "hasAttribute": {
+      "kind": "function",
+      "args": [
+        {
+          "kind": "property",
+          "list": false,
+          "name": "name",
+          "type": "string"
+        }
+      ],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "boolean"
+      },
+      "description": "Returns true if the element has the given attribute.",
+      "example": "element.hasAttribute('href');"
+    },
+    "getAttribute": {
+      "kind": "function",
+      "args": [
+        {
+          "kind": "property",
+          "list": false,
+          "name": "name",
+          "type": "string"
+        }
+      ],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "unknown"
+      },
+      "description": "Returns the value of the given attribute.",
+      "example": "element.getAttribute('href');"
+    },
+    "removeAttribute": {
+      "kind": "function",
+      "args": [
+        {
+          "kind": "property",
+          "list": false,
+          "name": "name",
+          "type": "string"
+        }
+      ],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "TempleElement"
+      },
+      "description": "Removes the given attribute from the element.",
+      "example": "element.removeAttribute('href');"
+    },
+    "setAttribute": {
+      "kind": "function",
+      "args": [
+        {
+          "kind": "property",
+          "list": false,
+          "name": "name",
+          "type": "string"
+        },
+        {
+          "kind": "property",
+          "list": false,
+          "name": "value",
+          "type": "string"
+        }
+      ],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "TempleElement"
+      },
+      "description": "Sets the given attribute to the element.",
+      "example": "element.setAttribute('href', '/');"
+    },
+    "setAttributes": {
+      "kind": "function",
+      "args": [
+        {
+          "kind": "property",
+          "list": false,
+          "name": "attributes",
+          "type": "Hash"
+        }
+      ],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "TempleElement"
+      },
+      "description": "Sets multiple attributes to the element.",
+      "example": "element.setAttributes({ href: '/', title: 'Home' });"
+    }
+  },
+  "TempleEmitter": {
+    "emit": {
+      "kind": "function",
+      "args": [
+        {
+          "kind": "property",
+          "list": false,
+          "name": "event",
+          "type": "string"
+        },
+        {
+          "kind": "property",
+          "list": false,
+          "name": "target",
+          "type": "T"
+        }
+      ],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "TempleEmitter"
+      },
+      "description": "Emits an event with optional parameters.",
+      "example": "emitter.emit('click', { x: 10, y: 20 });"
+    },
+    "unbind": {
+      "kind": "function",
+      "args": [
+        {
+          "kind": "property",
+          "list": false,
+          "name": "event",
+          "type": "string"
+        },
+        {
+          "kind": "property",
+          "list": false,
+          "name": "listener",
+          "type": "Function"
+        }
+      ],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "TempleEmitter"
+      },
+      "description": "Removes an event listener.",
+      "example": "emitter.unbind('click', handleClick);"
+    },
+    "on": {
+      "kind": "function",
+      "args": [
+        {
+          "kind": "property",
+          "list": false,
+          "name": "event",
+          "type": "string"
+        },
+        {
+          "kind": "property",
+          "list": false,
+          "name": "listener",
+          "type": "Function"
+        }
+      ],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "TempleEmitter"
+      },
+      "description": "Adds an event listener.",
+      "example": "emitter.on('click', handleClick);"
+    },
+    "once": {
+      "kind": "function",
+      "args": [
+        {
+          "kind": "property",
+          "list": false,
+          "name": "event",
+          "type": "string"
+        },
+        {
+          "kind": "property",
+          "list": false,
+          "name": "listener",
+          "type": "Function"
+        }
+      ],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "TempleEmitter"
+      },
+      "description": "Adds an event listener that only fires once.",
+      "example": "emitter.once('click', handleClick);"
+    }
+  },
+  "TempleAPI": {
+    "BUILD_ID": {
+      "kind": "property",
+      "list": false,
+      "type": "string",
+      "description": "The unique build ID used to map the build cache.",
+      "example": "TempleAPI.BUILD_ID; //--> 'abc123'"
+    },
+    "TempleComponent": {
+      "kind": "property",
+      "list": false,
+      "type": "TempleComponent",
+      "description": "The Temple component class used to create custom elements.",
+      "example": "new TempleAPI.TempleComponent();"
+    },
+    "TempleElement": {
+      "kind": "property",
+      "list": false,
+      "type": "TempleElement",
+      "description": "The Temple element class used to create custom elements.",
+      "example": "new TempleAPI.TempleElement(\n  document.createElement('a'),\n  { href: '/' }\n); ]"
+    },
+    "TempleEmitter": {
+      "kind": "property",
+      "list": false,
+      "type": "TempleEmitter",
+      "description": "The Temple emitter class used to create custom events.",
+      "example": "new TempleAPI.TempleEmitter();"
+    },
+    "TempleException": {
+      "kind": "property",
+      "list": false,
+      "type": "TempleException",
+      "description": "The Temple exception class used to create custom errors.",
+      "example": "throw TempleAPI.TempleException.for('error message');"
+    },
+    "TempleRegistry": {
+      "kind": "property",
+      "list": false,
+      "type": "TempleRegistry",
+      "description": "The Temple registry class used to store custom elements.",
+      "example": "new TempleAPI.TempleRegistry.createElement('a', { href: '/' });"
+    },
+    "children": {
+      "kind": "function",
+      "args": [
+        {
+          "kind": "property",
+          "list": false,
+          "name": "component",
+          "type": "TempleComponent"
+        }
+      ],
+      "returns": {
+        "kind": "property",
+        "list": true,
+        "type": "Node"
+      },
+      "description": "Returns an array of child nodes.",
+      "example": "TempleAPI.children(component); //--> [ Element, Text, Element, ... ]"
+    },
+    "components": {
+      "kind": "property",
+      "list": false,
+      "type": "Record",
+      "description": "Returns an object of Temple components classes used in the DOM.",
+      "example": "new TempleAPI.components['fancy-button']; //--> TempleComponent"
+    },
+    "data": {
+      "kind": "property",
+      "list": false,
+      "type": "TempleDataMap",
+      "description": "The Temple data map used to bring server side data to the client.",
+      "example": "TempleAPI.data.get('props');"
+    },
+    "emitter": {
+      "kind": "property",
+      "list": false,
+      "type": "TempleEmitter",
+      "description": "The Temple emitter class used to create custom events.",
+      "example": "TempleAPI.emitter.on('click', () => {});"
+    },
+    "props": {
+      "kind": "function",
+      "args": [
+        {
+          "kind": "property",
+          "list": false,
+          "name": "component",
+          "type": "TempleComponent"
+        }
+      ],
+      "returns": {
+        "kind": "property",
+        "list": true,
+        "type": "Hash"
+      },
+      "description": "Returns an object of component attributes",
+      "example": "TempleAPI.props(component); //--> { foo: 'bar', count: 4 }"
+    },
+    "signal": {
+      "kind": "function",
+      "args": [
+        {
+          "kind": "property",
+          "list": false,
+          "name": "component",
+          "type": "TempleComponent"
+        }
+      ],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "Signal"
+      },
+      "description": "Returns a signal object used to re-render components whenever its value changes",
+      "example": "const count = TempleAPI.signal(1, component)"
+    }
+  },
+  "Render Methods": {
+    "asset": {
+      "kind": "function",
+      "async": true,
+      "args": [
+        {
+          "kind": "property",
+          "list": false,
+          "name": "assetFile",
+          "type": "string"
+        }
+      ],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "Asset"
+      },
+      "description": "Returns a compiled build asset, given an asset file name.",
+      "example": "await compiler.asset('abc123.css'); //--> { type: 'text/css', content: '...' }"
+    },
+    "client": {
+      "kind": "function",
+      "async": true,
+      "args": [
+        {
+          "kind": "property",
+          "list": false,
+          "name": "sourceFile",
+          "type": "string"
+        }
+      ],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "string"
+      },
+      "description": "Returns a compiled client script, given the the template source file.",
+      "example": "await compiler.client('./docs/api.dtml'); //client script"
+    },
+    "markup": {
+      "kind": "function",
+      "async": true,
+      "args": [
+        {
+          "kind": "property",
+          "list": false,
+          "name": "sourceFile",
+          "type": "string"
+        }
+      ],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "string"
+      },
+      "description": "Returns a compiled markup, given the the template source file.",
+      "example": "await compiler.markup('./docs/api.dtml'); //--> ..."
+    },
+    "render":  {
+      "kind": "function",
+      "async": true,
+      "args": [
+        {
+          "kind": "property",
+          "list": false,
+          "name": "sourceFile",
+          "type": "string"
+        },
+        {
+          "kind": "property",
+          "list": false,
+          "name": "props",
+          "type": "Hash"
+        }
+      ],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "string"
+      },
+      "description": "Returns the final HTML markup, given the the template source file.",
+      "example": "await compiler.render('./docs/api.dtml', {\n  title: 'API Documentation'\n});"
+    },
+    "server": {
+      "kind": "function",
+      "async": true,
+      "args": [
+        {
+          "kind": "property",
+          "list": false,
+          "name": "sourceFile",
+          "type": "string"
+        }
+      ],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "string"
+      },
+      "description": "Returns compiled server code, given the the template source file.",
+      "example": "await compiler.server('./docs/api.dtml'); // server script"
+    },
+    "styles": {
+      "kind": "function",
+      "async": true,
+      "args": [
+        {
+          "kind": "property",
+          "list": false,
+          "name": "sourceFile",
+          "type": "string"
+        }
+      ],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "string"
+      },
+      "description": "Returns compiled css styles, given the the template source file.",
+      "example": "await compiler.styles('./docs/api.dtml'); //css styles"
+    }
+  },
+  "DeveloperOptions": {
+    "cwd?": {
+      "kind": "property",
+      "list": false,
+      "type": "string",
+      "description": "The current working directory",
+      "example": "const { refresh, router } = dev({ cwd: process.cwd() })"
+    },
+    "emitter?": {
+      "kind": "property",
+      "list": false,
+      "type": "EventEmitter",
+      "description": "The NodeJS EventEmitter instance being used.",
+      "example": "import emitter from 'events';\n\nconst { refresh, router } = dev({ emitter });'"
+    },
+    "include?": {
+      "kind": "property",
+      "list": true,
+      "type": "string",
+      "description": "An array of extension names to watch for",
+      "example": "const { refresh, router } = dev({ include: [ '.js', '.ts', '.tml', '.dtml' ] });'"
+    },
+    "ignore?": {
+      "kind": "property",
+      "list": true,
+      "type": "(string|RegExp)",
+      "description": "An array of extension names to ignore",
+      "example": "const { refresh, router } = dev({ ignore: [ '*.test.*' ] });'"
+    },
+    "route?": {
+      "kind": "property",
+      "list": false,
+      "type": "string",
+      "description": "The route path to use for the client watcher",
+      "example": "const { refresh, router } = dev({ route: '/__temple_dev__' })"
+    },
+    "tsconfig?": {
+      "kind": "property",
+      "list": false,
+      "type": "string",
+      "description": "The path to the tsconfig.json file",
+      "example": "const { refresh, router } = dev({ tsconfig: '/path/to/tsconfig.json' })"
+    },
+    "extname?": {
+      "kind": "property",
+      "list": false,
+      "type": "string",
+      "description": "the component file extension",
+      "example": "const { refresh, router } = dev({ extname: '.tml' })"
+    }
+  },
+  "RefreshServer": {
+    "cwd": {
+      "kind": "property",
+      "list": false,
+      "type": "string",
+      "description": "The current working directory",
+      "example": "refresh.cwd"
+    },
+    "emitter": {
+      "kind": "property",
+      "list": false,
+      "type": "EventEmitter",
+      "description": "The NodeJS EventEmitter instance being used.",
+      "example": "refresh.emitter.on('render', e => {\n  console.log(e.params);\n});"
+    },
+    "sync": {
+      "kind": "function",
+      "args": [
+        {
+          "kind": "property",
+          "name": "builder",
+          "list": false,
+          "type": "DocumentBuilder"
+        }
+      ],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "void"
+      },
+      "description": "Registers a document builder to a client watcher list",
+      "example": "refresh.emitter.on('render', e => {\n  console.log(e.params);\n});"
+    },
+    "close": {
+      "kind": "function",
+      "args": [],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "RefreshServer"
+      },
+      "description": "Closes the server and stops the watchers.",
+      "example": "refresh.close();"
+    },
+    "refresh": {
+      "kind": "function",
+      "args": [
+        {
+          "kind": "property",
+          "list": false,
+          "name": "filePath",
+          "type": "string"
+        }
+      ],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "Promise"
+      },
+      "description": "Whenever a file is changed this will be called to instruct each client watcher how to update their document.",
+      "example": "await refresh.refresh('/some/file.tml');"
+    },
+    "wait": {
+      "kind": "function",
+      "args": [
+        {
+          "kind": "property",
+          "list": false,
+          "name": "req",
+          "type": "Request"
+        },
+        {
+          "kind": "property",
+          "list": false,
+          "name": "res",
+          "type": "Response"
+        }
+      ],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "RefreshServer"
+      },
+      "description": "Opens a connection to the server via SSE and waits for changes.",
+      "example": "refresh.wait(req, res);"
+    },
+    "watch": {
+      "kind": "function",
+      "args": [],
+      "returns": {
+        "kind": "property",
+        "list": false,
+        "type": "RefreshServer"
+      },
+      "description": "Starts the server that watches for file changes.",
+      "example": "refresh.watch();"
+    }
+  },
+  "Developer Tools": {
+    "refresh": {
+      "kind": "property",
+      "list": false,
+      "type": "RefreshServer",
+      "description": "The refresh server instance used to update clients.",
+      "example": "const { refresh } = dev();\nrefresh.sync(builder);"
+    },
+    "router": {
+      "kind": "property",
+      "list": false,
+      "type": "Function",
+      "description": "HTTP middleware to handle developer tool routes like '/dev.js' and '/__temple_dev__'.",
+      "example": "const { router } = dev();\napp.use(router);"
+    }
+  },
+  "Express Developer Tools": {
+    "refresh": {
+      "kind": "property",
+      "list": false,
+      "type": "RefreshServer",
+      "description": "The refresh server instance used to update clients.",
+      "example": "const { refresh } = dev();\nrefresh.sync(builder);"
+    },
+    "router": {
+      "kind": "property",
+      "list": false,
+      "type": "Function",
+      "description": "Express middleware to handle developer tool routes like '/dev.js' and '/__temple_dev__'.",
+      "example": "const { router } = dev();\napp.use(router);"
+    },
+    "view": {
+      "kind": "property",
+      "list": false,
+      "type": "Function",
+      "description": "Middleware used to setup an express view engine.",
+      "example": "const { view } = dev();\napp.engine('dtml', view(compiler));"
+    }
+  }
+}
\ No newline at end of file
diff --git a/packages/temple-web/src/components/api/ui.tml b/packages/temple-web/src/components/api/ui.tml
new file mode 100644
index 0000000..c65da14
--- /dev/null
+++ b/packages/temple-web/src/components/api/ui.tml
@@ -0,0 +1,115 @@
+
+
+
        
+   1}>
+    
+      
+    
+  
+  API: {active.value}
+
        
+
        
+  
        
+    
+      
+        
+        
+          
+        
+        
+      
+      
+        
+          
+            
+              
+              
+                
+              
+                
+              
+            
+              
+              
+                
+              
+                
+              
+            
+              
+            
+            
+          
+        
+      
+    
        PropertyReturnsDescription
        
+                {key}
+              
+                  
+                    {prop.type}
+                  {prop.list ? '[]' :''}
+                
+                  {prop.type}{prop.list ? '[]' :''}
+                
+                {key}(
+                  
+                     0}>, 
+                    {arg.name}: 
+                    
+                      
+                        {arg.type}
+                      {arg.list ? '[]' :''}
+                    
+                      {arg.type}{arg.list ? '[]' :''}
+                    
+                  
+                )
+              
+                  
+                    {prop.returns.type}
+                  {prop.returns.list ? '[]' :''}
+                
+                  {prop.returns.type}{prop.returns.list ? '[]' :''}
+                
+                {`on('${key}', (event: Event) => void)`}
+              
+              
+                
        {prop.description}
        
+                
+                  
        Example
        
+                  {prop.example} 
+                        
+                      
+            
        
+  
        
+
        
\ No newline at end of file
diff --git a/packages/temple-web/src/components/html/aside.tml b/packages/temple-web/src/components/html/aside.tml
new file mode 100644
index 0000000..1ffb02b
--- /dev/null
+++ b/packages/temple-web/src/components/html/aside.tml
@@ -0,0 +1,130 @@
+
        
+  
+    Temple Logo
+  
+  
        
+    Temple
+  
        
+  
+
        
+
\ No newline at end of file
diff --git a/packages/temple-web/src/components/html/head.tml b/packages/temple-web/src/components/html/head.tml
new file mode 100644
index 0000000..94be77b
--- /dev/null
+++ b/packages/temple-web/src/components/html/head.tml
@@ -0,0 +1,26 @@
+
+  
+  
+  {title}
+  
+  
+  
+  
+  
+  
+  
+  
+  
+  
+  
+  
+  
+  
+  
+  
+  
+  
+  
+    
+  
+
\ No newline at end of file
diff --git a/packages/temple-web/src/components/html/header.tml b/packages/temple-web/src/components/html/header.tml
new file mode 100644
index 0000000..0a7ee62
--- /dev/null
+++ b/packages/temple-web/src/components/html/header.tml
@@ -0,0 +1,44 @@
+
+  
+    
+    
        
+  
+    
+      Temple Logo
+    
+    
        
+      Temple
+    
        
+          
+  
+        
\ No newline at end of file
diff --git a/packages/temple-web/src/components/i18n/index.ts b/packages/temple-web/src/components/i18n/index.ts
new file mode 100644
index 0000000..3d8c59d
--- /dev/null
+++ b/packages/temple-web/src/components/i18n/index.ts
@@ -0,0 +1,13 @@
+export type scalar = string | number | boolean | null | undefined;
+export const _ = function(phrase: string, ...variables: scalar[]) {
+  let translation = translate(phrase);
+  for (let i = 0; i < variables.length; i++) {
+    translation = translation.replace('%s', String(variables[i]));
+  }
+  return translation;
+};
+
+export const translate = function(phrase: string) {
+  //TODO: map phrase to translation phrase
+  return phrase;
+};
\ No newline at end of file
diff --git a/packages/temple-web/src/components/i18n/translate.tml b/packages/temple-web/src/components/i18n/translate.tml
new file mode 100644
index 0000000..1894f37
--- /dev/null
+++ b/packages/temple-web/src/components/i18n/translate.tml
@@ -0,0 +1,40 @@
+
+
+  
        {translations}
        
+
+  
      1. {translations}
        2. 
+
+  
        {translations}
        
+
+  {translations}
+        
\ No newline at end of file
diff --git a/packages/temple-web/src/components/ide/app.tml b/packages/temple-web/src/components/ide/app.tml
new file mode 100644
index 0000000..c7800b3
--- /dev/null
+++ b/packages/temple-web/src/components/ide/app.tml
@@ -0,0 +1,16 @@
+
+
        
+  
        
+    
+    
+    
+    
+      {title}
+    
+  
        
+  
        {children()}
        
+
        
\ No newline at end of file
diff --git a/packages/temple-web/src/components/ide/app/head.tml b/packages/temple-web/src/components/ide/app/head.tml
new file mode 100644
index 0000000..071304f
--- /dev/null
+++ b/packages/temple-web/src/components/ide/app/head.tml
@@ -0,0 +1,11 @@
+
+
        
+  {children()}
+
        
\ No newline at end of file
diff --git a/packages/temple-web/src/components/ide/app/left.tml b/packages/temple-web/src/components/ide/app/left.tml
new file mode 100644
index 0000000..9a5f1c8
--- /dev/null
+++ b/packages/temple-web/src/components/ide/app/left.tml
@@ -0,0 +1,12 @@
+
+
\ No newline at end of file
diff --git a/packages/temple-web/src/components/ide/app/main.tml b/packages/temple-web/src/components/ide/app/main.tml
new file mode 100644
index 0000000..744ea70
--- /dev/null
+++ b/packages/temple-web/src/components/ide/app/main.tml
@@ -0,0 +1,12 @@
+
+
        
+  {children()}
+
        
\ No newline at end of file
diff --git a/packages/temple-web/src/components/ide/code.tml b/packages/temple-web/src/components/ide/code.tml
new file mode 100644
index 0000000..c3e71a8
--- /dev/null
+++ b/packages/temple-web/src/components/ide/code.tml
@@ -0,0 +1,147 @@
+
+
+
+
+
+  
        $ {childlist}
        
+
+  
+    
        
+  
+    
        
+          
+
+  ????
+        
+
diff --git a/packages/temple-web/src/components/ide/preview.tml b/packages/temple-web/src/components/ide/preview.tml
new file mode 100644
index 0000000..39c3e3d
--- /dev/null
+++ b/packages/temple-web/src/components/ide/preview.tml
@@ -0,0 +1,5 @@
+
+
        {children()}
        
\ No newline at end of file
diff --git a/packages/temple-web/src/index.ts b/packages/temple-web/src/index.ts
index 0e64be7..13d1ef3 100644
--- a/packages/temple-web/src/index.ts
+++ b/packages/temple-web/src/index.ts
@@ -12,10 +12,10 @@ type Next = () => void;
 const docs = path.join(__dirname, '../../../docs');
 
 //create temple compiler
-const compiler = temple({ brand: '', cwd: __dirname });
+const compiler = temple({ brand: '', cwd: __dirname, minify: false });
 
 //use temple ui
-compiler.use(tui({ brand: '' }));
+compiler.use(tui());
 
 //use build cache
 compiler.use(cache({ 
diff --git a/packages/temple-web/src/modules/api/docs.tml b/packages/temple-web/src/modules/api/docs.tml
new file mode 100644
index 0000000..5b8f058
--- /dev/null
+++ b/packages/temple-web/src/modules/api/docs.tml
@@ -0,0 +1,5 @@
+
+
        {children()}
        
\ No newline at end of file
diff --git a/packages/temple-web/src/modules/api/ui.tml b/packages/temple-web/src/modules/api/ui.tml
index 0c996f3..283357e 100644
--- a/packages/temple-web/src/modules/api/ui.tml
+++ b/packages/temple-web/src/modules/api/ui.tml
@@ -1,148 +1,16 @@
-
-
-
+
 
-
        
-  
        
-     1}>
-      
-        
-      
-    
-    API: {active.value}
-  
        
-  
        
-    
        
-      
-        
-          
-          
-            
-          
-          
-        
-        
-          
-            
-              
-                
-                
-                  
-                
-                  
-                
-              
-                
+              
+                
+              
+            
+              
+            
+            
+          
+        
+      
+    
        PropertyReturnsDescription
        {key}
-                    
-                      {prop.type}
-                    {prop.list ? '[]' :''}
-                  {prop.type}{prop.list ? '[]' :''}
-                  {key}(
-                    
-                       0}>, 
-                      {arg.name}: 
-                      
-                        
-                          {arg.type}
-                        {arg.list ? '[]' :''}
-                      
-                        {arg.type}{arg.list ? '[]' :''}
-                      
-                    
-                  )
+
        
+   1}>
+    
+      
+    
+  
+  API: {active.value}
+
        
+
        
+  
        
+    
+      
+        
+        
+          
+        
+        
+      
+      
+        
+          
+            
+              
+              
+                
+              
+                
-                
-                  
-                
-                  
-                
-              
-                
-              
-            
-          
-        
-      
        PropertyReturnsDescription
        
+                {key}
+              
+                  
+                    {prop.type}
+                  {prop.list ? '[]' :''}
+                
+                  {prop.type}{prop.list ? '[]' :''}
                 
-                    
-                      {prop.returns.type}
-                    {prop.returns.list ? '[]' :''}
-                  {prop.returns.type}{prop.returns.list ? '[]' :''}{`on('${key}', (event: Event) => void)`}
               
-                
-                  
        {prop.description}
        
-                  
-                    
        Example
        
-                    {prop.example} 
-                          
-                        
+            
+                      		
+                {key}(
+                  
+                     0}>, 
+                    {arg.name}: 
+                    
+                      
+                        {arg.type}
+                      {arg.list ? '[]' :''}
+                    
+                      {arg.type}{arg.list ? '[]' :''}
+                    
+                  
+                )
               
        
-    
        
+              
+                
        		
+                  
+                    {prop.returns.type}
+                  {prop.returns.list ? '[]' :''}
+                
+                  {prop.returns.type}{prop.returns.list ? '[]' :''}
+                
+                {`on('${key}', (event: Event) => void)`}
+              
+              
+                
        {prop.description}
        
+                
+                  
        Example
        
+                  {prop.example} 
+                        
+                      
+            
        
   
        
 
        
\ No newline at end of file
diff --git a/packages/temple-web/src/modules/html/aside.tml b/packages/temple-web/src/modules/html/aside.tml
new file mode 100644
index 0000000..02cb7d0
--- /dev/null
+++ b/packages/temple-web/src/modules/html/aside.tml
@@ -0,0 +1,130 @@
+
        
+  
+    Temple Logo
+  
+  
        
+    Temple
+  
        
+  
+
        
+
\ No newline at end of file
diff --git a/packages/temple-web/src/modules/html/head.tml b/packages/temple-web/src/modules/html/head.tml
index b31cc27..94be77b 100644
--- a/packages/temple-web/src/modules/html/head.tml
+++ b/packages/temple-web/src/modules/html/head.tml
@@ -16,7 +16,7 @@
   
   
   
-  
+  
   
   
   
diff --git a/packages/temple-web/src/modules/html/header.tml b/packages/temple-web/src/modules/html/header.tml
new file mode 100644
index 0000000..79064b3
--- /dev/null
+++ b/packages/temple-web/src/modules/html/header.tml
@@ -0,0 +1,44 @@
+
+  
+    
+    
        
+  
+    
+      Temple Logo
+    
+    
        
+      Temple
+    
        
+          
+  
+        
\ No newline at end of file
diff --git a/packages/temple-web/src/modules/ide/app.tml b/packages/temple-web/src/modules/ide/app.tml
index 6321d05..03d98bf 100644
--- a/packages/temple-web/src/modules/ide/app.tml
+++ b/packages/temple-web/src/modules/ide/app.tml
@@ -1,15 +1,16 @@
 
-
        
-  
        
-    
-    
-    
-    {title}
+
        
+  
        
+    
+    
+    
+    
+      {title}
+    
   
        
-  
        {children()}
        
+  
        {children()}
        
 
        
\ No newline at end of file
diff --git a/packages/temple-web/src/modules/ide/app/head.tml b/packages/temple-web/src/modules/ide/app/head.tml
new file mode 100644
index 0000000..a6cc9a0
--- /dev/null
+++ b/packages/temple-web/src/modules/ide/app/head.tml
@@ -0,0 +1,6 @@
+
+
        
+  {children()}
+
        
\ No newline at end of file
diff --git a/packages/temple-web/src/modules/ide/app/left.tml b/packages/temple-web/src/modules/ide/app/left.tml
new file mode 100644
index 0000000..5416f6f
--- /dev/null
+++ b/packages/temple-web/src/modules/ide/app/left.tml
@@ -0,0 +1,6 @@
+
+
\ No newline at end of file
diff --git a/packages/temple-web/src/modules/ide/app/main.tml b/packages/temple-web/src/modules/ide/app/main.tml
new file mode 100644
index 0000000..11b2e6e
--- /dev/null
+++ b/packages/temple-web/src/modules/ide/app/main.tml
@@ -0,0 +1,6 @@
+
+
        
+  {children()}
+
        
\ No newline at end of file
diff --git a/packages/temple-web/src/modules/ide/code.tml b/packages/temple-web/src/modules/ide/code.tml
index 50c3d19..15c7f89 100644
--- a/packages/temple-web/src/modules/ide/code.tml
+++ b/packages/temple-web/src/modules/ide/code.tml
@@ -7,17 +7,19 @@
     line-height: 20px;
   }
   :host([inline]) {
-    display: inline;
+    display: inline !important;
   }
   :host([inline]),
   :host([inline]) > pre,
   :host([inline]) > pre > code {
-    display: inline;
+    display: inline !important;
   }
   .snippet {
     background-color: #000000;
     color: #ABB2BF;
+    height: 100%;
     margin: 0;
+    overflow: auto;
     padding: 0;
   }
 
@@ -75,7 +77,10 @@
 
   .terminal {
     background-color: #000000;
+    font-family: 'Courier New', Courier, monospace;
     font-size: 15px;
+    height: 100%;
+    overflow: auto;
     padding: 10px;
   }
   .terminal span {
@@ -138,5 +143,7 @@
   
     
        
   
+
+  ????
 
 
diff --git a/packages/temple-web/src/modules/ide/preview.tml b/packages/temple-web/src/modules/ide/preview.tml
index 0d2a600..39c3e3d 100644
--- a/packages/temple-web/src/modules/ide/preview.tml
+++ b/packages/temple-web/src/modules/ide/preview.tml
@@ -1,17 +1,5 @@
-
-
 
-
        {children()}
        
\ No newline at end of file
+
        {children()}
        
\ No newline at end of file
diff --git a/packages/temple-web/src/modules/panel/head.tml b/packages/temple-web/src/modules/panel/head.tml
index 1d3bf45..3434736 100644
--- a/packages/temple-web/src/modules/panel/head.tml
+++ b/packages/temple-web/src/modules/panel/head.tml
@@ -1,27 +1,42 @@
-
        
-  
+
+
        
+  
+    
+  
   
-    Temple Logo
+    Temple Logo
   
-  
        Temple
        
-  
    `} tag and cells
-            should be wrapped in a {``} 
-            tag. ie. {`
    `}
+            
+            
+              When using lists, items should be wrapped in a 
+              {`
      `} or 
+              {`
        `} tags.
+              ie. {`
        • `}
+            
+          
        
+
+          
+            
+            Warning: Any markup auto corrected by browser will cause data syncing 
+            issues with Temple.
+          
+
+          
+            Temple components can loosely be self closing
+            {``}
+            or expressed as a block
+            {``}.
+          
 
-            
        {title}
        
+          
+          
        
+            {_('Attributes')}
+          
        
+
+          
+            {`
+              
+                {title}
+              
+              
+                {detail}
+              
+            `}
+          
+
+          
+            Attributes can be bound to expressions using the 
+            {`{}`} syntax. 
+            Expressions can be variables, functions, or any valid 
+            JavaScript expression. By default, attributes work exactly 
+            like their HTML counterparts.
+          
+
+          
        
+            {`
+              
+            `}
+          
        
+          
+            Traditional HTML attributes can be assigned string values or 
+            no value evaluates as {`true`}.
+          
+
+          {`
+            Click
           `}
-        
-
-        
-        
        {_('Markup')}
        
-
-        
-          In order to be closer to the native, Temple follows the same 
-          standards and conventions as HTML5 web components. Temple 
-          components are compiled to native web components that possibly 
-          can be used in other projects any modern browser.
-        
-
-        
-        
        {_('Tag Names')}
        
-
-        
-          Tag names must have at least one dash (-) in them. As such 
-          you probably want to name your element with two distinct words 
-          like {`i18n-translate`}. You can 
-          use as many dashes as you want, you're not limited to one. 
-          Some specific rules to follow in order to make a valid tag 
-          name:
-        
-
-        
          
-          
-            It must use all lowercase characters of the alphabet (a-z).
-          
-          
-            t must contain at least one dash (-).
-          
-          
-            It must not be an already reserved tag name including 
-            annotation-xml,
-            color-profile,
-            font-face,
-            font-face-src,
-            font-face-uri,
-            font-face-format,
-            font-face-name, and 
-            missing-glyph.
-          
-          
-            It must not contain symbols, like =, @, $.
-          
-          
-            It can contain underscores, and numbers.
-          
-          
-            It can contain characters from different alphabets, 
-            such as é, ð, ö, 爱.
-          
-        
        
-
-        
-          Additionally, Temple works best with correct markup. The 
-          following standards should be followed:
-        
-
-        
          
-          
-            Self closing tags like 
-            {``},
-            {``},
-            {``},
-            {``}
-            must have a slash before the closing.
-          
-          
-            When using tables, rows should be wrapped in a 
-            {`
    `}
-          
-          
-            When using lists, items should be wrapped in a 
-            {`
      `} or 
-            {`
        `} tags.
-            ie. {`
        • `}
-          
-        
        
-
-        
-          
-          Warning: Any markup auto corrected by browser will cause data syncing 
-          issues with Temple.
-        
-
-        
-          Temple components can loosely be self closing
-          {``}
-          or expressed as a block
-          {``}.
-        
-
-        
-        
        {_('Attributes')}
        
-
-        
-          {`
-            
-              {title}
-            
-            
-              {detail}
-            
+          
+            Attributes can be assigned variable names.
+          
+
+          {`
+            Click
+          `}
+          
+            Variable names do not need to be wrapped in curly braces
+            {`{}`}.
+          
+
+          {`
+            Click
           `}
-        
-
-        
-          Attributes can be bound to expressions using the 
-          {`{}`} syntax. 
-          Expressions can be variables, functions, or any valid 
-          JavaScript expression. By default, attributes work exactly 
-          like their HTML counterparts.
-        
-
-        {`
-          
-        `}
-        
-          Traditional HTML attributes can be assigned string values or 
-          no value evaluates as {`true`}.
-        
-
-        {`
-          Click
-        `}
-        
-          Attributes can be assigned variable names.
-        
-
-        {`
-          Click
-        `}
-        
-          Variable names do not need to be wrapped in curly braces
-          {`{}`}.
-        
-
-        {`
-          Click
-        `}
-        
-          Attributes with the same name as a variable can be assigned
-          by just wrapping curly braces. ie. 
-          {`{title}`}.
-        
-
-        {`
-          
-          Click
-        `}
-        
-          Spread operators can be used to assign multiple attributes.
-        
-
-        {`
-          
-          
-            Click
-          
-        `}
-        
-          You can assign any valid JavaScript expression to an attribute.
-        
-
-        
-        
        {_('Conditionals')}
        
-
-        
+          
+            Attributes with the same name as a variable can be assigned
+            by just wrapping curly braces. ie. 
+            {`{title}`}.
+          
+
+          
        
+            {`
+              
+              Click
+            `}
+          
        
+          
+            Spread operators can be used to assign multiple attributes.
+          
+
+          
        
+            {`
+              
+              
+                Click
+              
+            `}
+          
        
+          
+            You can assign any valid JavaScript expression to an attribute.
+          
+
+          
+          
        
+            {_('Conditionals')}
+          
        
+
+          
+            {`
+               10}>
+                
        Count is greater than 10
        
+              
+                
        Count is less than 5
        
+              
+                
        Count is between 5 and 10
        
+                      
+            `}        
+                  
+          
+            Conditionals can be used to show or hide elements based on 
+            the value of a variable.
+          
+
+          
        
+            {`
+               10}>
+                
        Count is greater than 10
        
+                      
+            `}        
+          
        
+          
+            The basic syntax for an if statement looks like this and can be 
+            {`truesy`} or 
+            {`falsey`}.
+          
+
+          
        
+            {`
+               10}>
+                
        Count is not greater than 10
        
+                      
+            `}        
+          
        
+          
+            You can also use the {`false`}
+            attribute to negate the condition.
+          
+
+          
        
+            {`
+               10}>
+                
        Count is greater than 10
        
+              
+                
        Count is less than or equal to 10
        
+                      
+            `}        
+          
        
+          
+            You can use the {`else`} block to 
+            show content when the condition is false.
+          
+
           {`
              10}>
               
        Count is greater than 10
        
             
               
        Count is less than 5
        
-            
-              
        Count is between 5 and 10
        
                     
           `}        
-                
-        
-          Conditionals can be used to show or hide elements based on 
-          the value of a variable.
-        
-
-        {`
-           10}>
-            
        Count is greater than 10
        
-                  
-        `}        
-        
-          The basic syntax for an if statement looks like this and can be 
-          {`truesy`} or 
-          {`falsey`}.
-        
-
-        {`
-           10}>
-            
        Count is not greater than 10
        
-                  
-        `}        
-        
-          You can also use the {`false`}
-          attribute to negate the condition.
-        
-
-        {`
-           10}>
-            
        Count is greater than 10
        
-          
-            
        Count is less than or equal to 10
        
-                  
-        `}        
-        
-          You can use the {`else`} block to 
-          show content when the condition is false.
-        
-
-        {`
-           10}>
-            
        Count is greater than 10
        
-          
-            
        Count is less than 5
        
-                  
-        `}        
-        
-          You can use the {`elif`} block to 
-          show content when the previous condition is false.
-        
-
-        
-        
        {_('Iterations')}
        
-
-        
+          
+            You can use the {`elif`} block to 
+            show content when the previous condition is false.
+          
+
+          
+          
        
+            {_('Iterations')}
+          
        
+
+          
+            {`
+              
+                
        #{index + 1} {article.title}
        
+                
        {article.body}
        
+                      
+            `}        
+                  
+          
+            The {``} block can be used 
+            to iterate over an array of items or objects.
+            The {`from`} attribute value is 
+            required and can be an array, object or JavaScript expression 
+            that evaluates to an array or object. Both the 
+            {`key`} and 
+            {`value`} attributes are optional.
+          
+
+          
        
+            {`
+              
+                
        {article.title}
        
+                
        {article.body}
        
+                      
+            `}        
+          
        
+          
+            The value of {`value`}, in this 
+            case {`article`} can be used 
+            only with in the block. This can be any valid JavaScript 
+            variable name.
+          
+
           {`
-            
-              
        #{index + 1} {article.title}
        
-              
        {article.body}
        
+            
+              
        #{index} ???
        
                     
           `}        
-                
-        
-          The {``} block can be used 
-          to iterate over an array of items or objects.
-          The {`from`} attribute value is 
-          required and can be an array, object or JavaScript expression 
-          that evaluates to an array or object. Both the 
-          {`key`} and 
-          {`value`} attributes are optional.
-        
-
-        {`
-          
-            
        {article.title}
        
-            
        {article.body}
        
-                  
-        `}        
-        
-          The value of {`value`}, in this 
-          case {`article`} can be used 
-          only with in the block. This can be any valid JavaScript 
-          variable name.
-        
-
-        {`
-          
-            
        #{index} ???
        
-                  
-        `}        
-        
-          The value of {`key`}, in this 
-          case {`index`} can be used 
-          only with in the block. This can be any valid JavaScript 
-          variable name.
-        
-
-        
-        
        {_('Try/Catch')}
        
-
-        
-          {`
-            
-              
        {mayCauseError()}
        
-            
-              
        Error: {e.message}
        
-                    
-          `}        
-                
-
-        
-          The {``} block can 
-          be used to catch errors that occur in the block. The 
-          {``} block is required and 
-          can be used to handle the error.
-
-          The value of {`error`}, in the  
-          {``} block in this case
-          {`e`} is an 
-          {`Error`} object
-          that can only be used with in the block. 
-        
-
-        
-      
-      
        
-    
+          
+            The value of {`key`}, in this 
+            case {`index`} can be used 
+            only with in the block. This can be any valid JavaScript 
+            variable name.
+          
+
+          
+          
        
+            {_('Try/Catch')}
+          
        
+
+          
+            {`
+              
+                
        {mayCauseError()}
        
+              
+                
        Error: {e.message}
        
+                      
+            `}        
+                  
+
+          
+            The {``} block can 
+            be used to catch errors that occur in the block. The 
+            {``} block is required and 
+            can be used to handle the error.
+
+            The value of {`error`}, in the  
+            {``} block in this case
+            {`e`} is an 
+            {`Error`} object
+            that can only be used with in the block. 
+          
+
+          
+          
        
+        
+      
+    
   
 
\ No newline at end of file
diff --git a/packages/temple-web/src/pages/docs/single-page.dtml b/packages/temple-web/src/pages/docs/single-page.dtml
index 6fe3661..d2591c5 100644
--- a/packages/temple-web/src/pages/docs/single-page.dtml
+++ b/packages/temple-web/src/pages/docs/single-page.dtml
@@ -1,11 +1,25 @@
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
 
 
   
-  
-    
-    
-    
-      
        
-        
        {_('Single Page App')}
        
+  
+    
+      
+      
+      
+        
+          
        
+            {_('Single Page App')}
+          
        
 
-        
-          A single page application (SPA) is a website or web 
-          application that dynamically rewrites a current web page with 
-          new data from a web server, instead of the default method of 
-          a web browser loading entire new pages. Temple is capable of 
-          creating reactive SPAs using Webpack and TypeScript.
-        
+          
+            A single page application (SPA) is a website or web 
+            application that dynamically rewrites a current web page with 
+            new data from a web server, instead of the default method of 
+            a web browser loading entire new pages. Temple is capable of 
+            creating reactive SPAs using Webpack and TypeScript.
+          
 
-        
-          First install the following Temple packages.
-        
-        
-          npm install --save-dev @ossph/temple @ossph/temple-loader
-        
+          
+            First install the following Temple packages.
+          
+          
+            npm install --save-dev @ossph/temple @ossph/temple-loader
+          
 
-        
-          Then, install the following TypeScript packages.
-        
-        
-          npm install --save-dev @types/node ts-loader ts-node typescript
-        
+          
+            Then, install the following TypeScript packages.
+          
+          
+            npm install --save-dev @types/node ts-loader ts-node typescript
+          
 
-        
-          Then, install the following Webpack packages.
-        
-        
-          npm install --save-dev html-webpack-plugin webpack-dev-server webpack webpack-cli
-        
+          
+            Then, install the following Webpack packages.
+          
+          
+            npm install --save-dev html-webpack-plugin webpack-dev-server webpack webpack-cli
+          
 
-        
-          Next create the following files and directories.
-        
+          
+            Next create the following files and directories.
+          
 
-        
-          
        
-            
        
-              
-                src/client.ts
+          
+            
+              
        
+                
+                  src/client.ts
+                
+                
+                  src/app.tml
+                
+                
+                  index.html
+                
+                
+                  webpack.config.js
+                
+                
+                  tsconfig.json
+                
+                
+                  package.json
+                
+              
        
+                    
+            
+              
        
+                
+                src
+              
        
+              
+                
+                app.tml
               
-              
-                src/app.tml
+              
+                
+                client.ts
               
-              
+              
+                
                 index.html
               
-              
-                webpack.config.js
+              
+                
+                package.json
               
-              
+              
+                
                 tsconfig.json
               
-              
-                package.json
+              
+                
+                webpack.config.js
               
-            
        
-          
        
-          
        
-            
        
-              
-              src
-            
        
-            
-              
-              app.tml
-            
-            
-              
-              client.ts
-            
-            
-              
-              index.html
-            
-            
-              
-              package.json
-            
-            
-              
-              tsconfig.json
-            
-            
-              
-              webpack.config.js
-            
-          
        
-          
        
-            
        
+            
+            
               
-            
        
-          
        
-                
-        
-          To test the SPA and see the results, run the following command in terminal.
-        
-        
-          
-            npm run dev
-          
-        
-        
-        
-      
        
-      
        
-            
+            
+          
+          
+            To test the SPA and see the results, run the following command in terminal.
+          
+          
+            
+              npm run dev
+            
+          
+          
+          
+          
        
+        
+      
+    
   
 
\ No newline at end of file
diff --git a/packages/temple-web/src/pages/docs/state-management.dtml b/packages/temple-web/src/pages/docs/state-management.dtml
index 19633c2..0cd2e28 100644
--- a/packages/temple-web/src/pages/docs/state-management.dtml
+++ b/packages/temple-web/src/pages/docs/state-management.dtml
@@ -1,13 +1,23 @@
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
 
 
 
   
-  
-    
-    
-    
-      
        
-        
        {_('Static Site Generator')}
        
+  
+    
+      
+      
+      
+        
+          
        
+            {_('Static Site Generator')}
+          
        
 
-        
-          A static site generator is a tool that generates a full static 
-          HTML website based on raw data and a set of templates. 
-          Essentially, a static site generator automates the task of 
-          coding individual HTML pages and gets those pages ready to 
-          serve to users ahead of time. Because these HTML pages are 
-          pre-built, they can load very quickly in browsers. You can use 
-          Temple, TypeScript and the native Node.js HTTP server to 
-          generate HTML documents in order to be served statically.
-        
+          
+            A static site generator is a tool that generates a full static 
+            HTML website based on raw data and a set of templates. 
+            Essentially, a static site generator automates the task of 
+            coding individual HTML pages and gets those pages ready to 
+            serve to users ahead of time. Because these HTML pages are 
+            pre-built, they can load very quickly in browsers. You can use 
+            Temple, TypeScript and the native Node.js HTTP server to 
+            generate HTML documents in order to be served statically.
+          
 
-        
-          First, create a project with the following structure and files.
-        
-        
-          
        
-            
        
-              
-                src/index.ts
+          
+            First, create a project with the following structure and files.
+          
+          
+            
+              
        
+                
+                  src/index.ts
+                
+                
+                  src/page.dtml
+                
+                
+                  package.json
+                
+              
        
+                    
+            
+              
        
+                
+                src
+              
        
+              
+                
+                index.ts
               
-              
-                src/pages/index.dtml
+              
+                
+                page.dtml
               
-              
+              
+                
                 package.json
               
-            
        
-          
        
-          
        
-            
        
-              
-              src
-            
        
-            
-              
-              index.ts
-            
-            
        
-              
-              pages
-            
        
-            
-              
-              index.dtml
-            
-            
-              
-              package.json
-            
-          
        
-          
        
-            
        
+            
+            
               {`
                 import http from 'http';
                 import temple, { cache } from '@ossph/temple/compiler';
@@ -160,46 +210,46 @@
                     "dev": "ts-node ./src/index.ts"
                   },
                   "dependencies": {
-                    "@ossph/temple": "0.1.4"
+                    "@ossph/temple": "0.1.6"
                   },
                   "devDependencies": {
-                    "@ossph/temple-dev": "0.1.4",
+                    "@ossph/temple-dev": "0.1.6",
                     "@types/node": "22.1.0",
                     "ts-node": "10.9.2",
                     "typescript": "5.5.4"
                   }
                 }
               `}
-            
        
-          
        
-                
+            
+          
 
-        
-          To test the script and see the results, run the following 
-          command in terminal.
-        
-        
-          npm run dev
-        
-        
-          Load 
-          'http://localhost:3000/' 
-          in your browser. After loading you should see files that were 
-          generated in a new build folder found in your project root. 
-        
-        
-        
-      
        
-      
        
-            
+          
+            To test the script and see the results, run the following 
+            command in terminal.
+          
+          
+            npm run dev
+          
+          
+            Load 
+            http://localhost:3000/ 
+            in your browser. After loading you should see files that were 
+            generated in a new build folder found in your project root. 
+          
+          
+          
+          
        
+        
+      
+    
   
 
\ No newline at end of file
diff --git a/packages/temple-web/src/pages/docs/template-engine.dtml b/packages/temple-web/src/pages/docs/template-engine.dtml
index 4b54510..2ed9977 100644
--- a/packages/temple-web/src/pages/docs/template-engine.dtml
+++ b/packages/temple-web/src/pages/docs/template-engine.dtml
@@ -1,11 +1,25 @@
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
 
 
   
-  
-    
-    
-    
-      
        
-        
        {_('Template Engine')}
        
+  
+    
+      
+      
+      
+        
+          
        
+            {_('Template Engine')}
+          
        
 
-        
-          Template engines are used when you want to rapidly build web 
-          applications that are split into different pages. Templates 
-          also enable fast rendering of the server-side data that needs
-          to be passed to the application. You can use Temple, TypeScript 
-          and the native Node.js HTTP server to serve up HTML documents
-          from the server-side.
-        
+          
+            Template engines are used when you want to rapidly build web 
+            applications that are split into different pages. Templates 
+            also enable fast rendering of the server-side data that needs
+            to be passed to the application. You can use Temple, TypeScript 
+            and the native Node.js HTTP server to serve up HTML documents
+            from the server-side.
+          
 
-        
-          First, create a project with the following structure and files.
-        
-        
-          
        
-            
        
-              
-                src/index.ts
+          
+            First, create a project with the following structure and files.
+          
+          
+            
+              
        
+                
+                  src/index.ts
+                
+                
+                  src/page.dtml
+                
+                
+                  package.json
+                
+              
        
+                    
+            
+              
        
+                
+                src
+              
        
+              
+                
+                index.ts
               
-              
-                src/page.dtml
+              
+                
+                page.dtml
               
-              
+              
+                
                 package.json
               
-            
        
-          
        
-          
        
-            
        
-              
-              src
-            
        
-            
-              
-              index.ts
-            
-            
-              
-              page.dtml
-            
-            
-              
-              package.json
-            
-          
        
-          
        
-            
        
+            
+            
               {`
                 import http from 'http';
                 import temple from '@ossph/temple/compiler';
@@ -129,49 +183,49 @@
                     "dev": "ts-node ./src/index.ts"
                   },
                   "dependencies": {
-                    "@ossph/temple": "0.1.4"
+                    "@ossph/temple": "0.1.6"
                   },
                   "devDependencies": {
-                    "@ossph/temple-dev": "0.1.4",
+                    "@ossph/temple-dev": "0.1.6",
                     "@types/node": "22.1.0",
                     "ts-node": "10.9.2",
                     "typescript": "5.5.4"
                   }
                 }
               `}
-            
        
-          
        
-                
-        
-          The server file 
-          src/index.ts 
-          implements a simple server utilizing the Temple compiler in 
-          its most simplistic form. The document file
-          src/page.dtml 
-          is using the most basic Temple syntax. To test the script and 
-          see the results, run the following command in terminal.
-        
-        
-          npm run dev
-        
-        
-          Load 
-          'http://localhost:3000/' 
-          in your browser to see your application.
-        
-        
-        
-      
        
-      
        
-            
+            
+          
+          
+            The server file 
+            src/index.ts 
+            implements a simple server utilizing the Temple compiler in 
+            its most simplistic form. The document file
+            src/page.dtml 
+            is using the most basic Temple syntax. To test the script and 
+            see the results, run the following command in terminal.
+          
+          
+            npm run dev
+          
+          
+            Load 
+            http://localhost:3000/ 
+            in your browser to see your application.
+          
+          
+          
+          
        
+        
+      
+    
   
 
\ No newline at end of file
diff --git a/packages/temple-web/src/pages/index.dtml b/packages/temple-web/src/pages/index.dtml
index 8a94fbc..a15d732 100644
--- a/packages/temple-web/src/pages/index.dtml
+++ b/packages/temple-web/src/pages/index.dtml
@@ -1,178 +1,20 @@
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
 
 
 
 
   
-  
-    
-    
-      
        
-        Temple Logo
-        
        {_('Temple')}
        
-        
-          The reactive web component template engine.
-        
-        
-          {_('Get Started')}
-        
-        
-          {_('Read the Docs')}
-        
-      
        
-      
        
-        
-          Temple is a modern HTML markup language and a server first 
-          template engine with a built-in parser/compiler that 
-          generates web components and supports reactivity.
-        
-        
-          
        
-            {`
-              
-              
-              
        Hello {name}!
        
-            `}        
-            
-              
        
-                
        {_('Hello world!')}
        
+  
+    
+      
+      
+        
        
+          Temple Logo
+          
        {_('Temple')}
        
+          
+            The reactive web component template engine.
+          
+          
+            {_('Get Started')}
+          
+          
+            {_('Read the Docs')}
+          
+        
        
+        
        
+          
+            Temple is a modern HTML markup language and a server first 
+            template engine with a built-in parser/compiler that 
+            generates web components and supports reactivity.
+          
+          
+            
        
+              {`
+                
+                
+                
        Hello {name}!
        
+              `}        
+              
+                
        
+                  
        {_('Hello world!')}
        
+                
        
+                      
+            
        
+                  
+        
        
+        
        
+          
          
+            
        • 
+              
          
+                
          
+                  {_('Expressive Markup')}
+                
          
+                
+                  Any data type as attributes. Easily express logic with 
+                  markup directives like if, each, and try catch. 
+                
               
          
-            
-          
        
-        
-      
        
-      
        
-        
          
-          
        • 
-            
          {_('Expressive Markup')}
          
-            
-              Any data type as attributes. Easily express logic with 
-              markup directives like if, each, and try catch. 
-            
-          
          • 
-          
        • 
-            
          {_('Reactive Signals')}
          
-            
-              Easily transition from backend logic to reactive states.
-              No Hydration and no memoization needed.
-            
-          
          • 
-          
        • 
-            
          {_('Bare Metal')}
          
-            
-              Work with the DOM directly. Import any web components 
-              from any source. Works with Lit, HTMX.
-            
-          
          • 
-        
        
-      
        
-      
        
-        
        {_('Server Setup')}
        
-        
-          Temple can be used with popular server 
-          frameworks in just a few lines of code.
-        
-        
-          {`
-            import temple from '@ossph/temple/compiler';
-            //make a temple compiler
-            const compiler = temple();
-            //render HTML
-            const results = compiler.render('./page.dtml');
-          `}
-        
-
-        
        {_('Props')}
        
-        
-          Import your component props and use immediately
-        
-        
-          
        
-            {`
-              
-              
-              
        Hello {name}!
        
-            `}        
-            
-              
        
-                
        {_('Hello world!')}
        
+            
+            
      1. 
+              
        
+                
        
+                  {_('Reactive Signals')}
+                
        
+                
+                  Easily transition from backend logic to reactive states.
+                  No Hydration and no memoization needed.
+                
               
        
-            
-          
        2. 
-        
-
-        
        {_('Reactive Signals')}
        
-        
-          Use signals to manage state changes and re-renders.
-        
-        
-          
        
-            {`
-              
-              
-              
        Hello {name.value}
        
-            `}        
-            
-              
        
-                
        {_('Hello world!')}
        
+            
+            
      2. 
+              
        
+                
        
+                  {_('Bare Metal')}
+                
        
+                
+                  Work with the DOM directly. Import any web components 
+                  from any source. Works with Lit, HTMX.
+                
               
        
-            
-          
        3. 
-        
-
-        
        {_('Components and Templates')}
        
-        
-          Import components and templates for reusability.
-        
-        
-          
        
-            {`
-              
-              
-              
-              Hello
-            `}
-            {`
-              
-              
-              
        {children} {name}
        
+            
+          
    
+        
+        
    
+          
    
+            {_('Server Setup')}
+          
    
+          
+            Temple can be used with popular server 
+            frameworks in just a few lines of code.
+          
+          
+            {`
+              import temple from '@ossph/temple/compiler';
+              //make a temple compiler
+              const compiler = temple();
+              //render HTML
+              const results = compiler.render('./page.dtml');
             `}
-          
-        
+          
 
-        
    {_('Conditionals and Iterations')}
    
-        
-          Case for conditions and iterations in an expressive way.
-        
-        
-          
    
-            {`
-              
+          
    
+            {_('Props')}
+          
    
+          
+            Import your component props and use immediately
+          
+          
+            
    
+              {`
+                
+                
+                
    Hello {name}!
    
+              `}    
+              
+                
    
+                  
    {_('Hello world!')}
    
+                
    
+                  
+            
    
+              
 
-              
-                
    Hello {name}
    
-                  
-            `}    
-            {`
-              
-              
      
-                
-                  
    • {i}: {item}
      • 
-                      
-              
    
-            `}    
+          
    
+            {_('Reactive Signals')}
+          
    
+          
+            Use signals to manage state changes and re-renders.
+          
+          
+            
    
+              {`
+                
+                
+                
    Hello {name.value}
    
+              `}    
+              
+                
    
+                  
    {_('Hello world!')}
    
+                
    
+                  
+            
    
+              
+
+          
    
+            {_('Components and Templates')}
+          
    
+          
+            Import components and templates for reusability.
+          
+          
+            
    
+              {`
+                
+                
+                
+                Hello
+              `}
+              {`
+                
+                
+                
    {children} {name}
    
+              `}    
+            
    
+              
+
+          
    
+            {_('Conditionals and Iterations')}
+          
    
+          
+            Case for conditions and iterations in an expressive way.
+          
+          
+            
    
+              {`
+                
+
+                
+                  
    Hello {name}
    
+                    
+              `}    
+              {`
+                
+                
      
+                  
+                    
    • {i}: {item}
      • 
+                        
+                
    
+              `}    
+            
    
+              
+        
    
+        
    
+          
    
+            {_('Works With Popular Server Frameworks')}
+          
    
+          
    
+            
+              Express
+            
+            
+              Fastify
+            
+            
+              Hapi
+            
+            
+              Koa
+            
+            
+              NestJS
+            
+            
+              Restify
+            
           
    
-        
-      
    
-      
    
-        
    {_('Works With Popular Server Frameworks')}
    
-        
-      
    
-      
    
-        
    {_('Temple Loves Developers!')}
    
-        
    
-          
-            
    Im a vue developer. No need for this. OSSPH does not support this project.
    
-              
-          
-            
    Temple? Never heard of it...
    "The Name..."
    
-              
-          
-            
    Temple is good news for Node developers. I'm a rust developer so it don't matter to me.
    
-              
-          
-            
    Temple copied this section from us. We are the original.
    
-              
-          
-            
    After creating the Temple project, I am really excited to get back to ReactJS.
    
-              
-          
-            
    Temple? no thanks. Keep your stack front end. App router for life.
    
-              
         
    
-      
    
-      
    
-        
    {_('What are you waiting for?')}
    
-        
-          {_('Get Started')}
-        
-        
-          {_('Read the Docs')}
-        
-      
    
-      
    
-    
+        
    
+          
    
+            {_('Temple Loves Developers!')}
+          
    
+          
    
+            
+              
    Im a vue developer. No need for this. OSSPH does not support this project.
    
+                
+            
+              
    Temple? Never heard of it...
    "The Name..."
    
+                
+            
+              
    Temple is good news for Node developers. I'm a rust developer so it don't matter to me.
    
+                
+            
+              
    Temple copied this section from us. We are the original.
    
+                
+            
+              
    After creating the Temple project, I am really excited to get back to ReactJS.
    
+                
+            
+              
    Temple? no thanks. Keep your stack front end. App router for life.
    
+                
+          
    
+        
    
+        
    
+          
    
+            {_('What are you waiting for?')}
+          
    
+          
+            {_('Get Started')}
+          
+          
+            {_('Read the Docs')}
+          
+        
    
+        
    
+      
+    
   
 
\ No newline at end of file
diff --git a/packages/temple-web/src/pages/template-1.dtml b/packages/temple-web/src/pages/template-1.dtml
new file mode 100644
index 0000000..577822f
--- /dev/null
+++ b/packages/temple-web/src/pages/template-1.dtml
@@ -0,0 +1,335 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+  
+  
+    
+      
+      
+      
+        
+          
    
+            {_('On this page')}
+          
    
+          
+            
+          
+      
+        
+          
    
+            {_('Getting Started')}
+          
    
+
+          
+            In most cases Temple will be used to render a front end from 
+            a server framework. In this example, we will use the native
+            NodeJS HTTP module to create a server that renders a page
+            using Temple. Start by replacing the 
+            {`src/index.ts`}
+            file with the following code. 
+            {`function() {}`}
+          
+
+          
+            
+              npm init -y && npm install --save @ossph/temple && npm install --save-dev ts-node typescript @types/node
+            
+          
+
+          
    
+            {_('1. Add HTTP')}
+          
    
+
+          
+            In most cases Temple will be used to render a front end from 
+            a server framework. In this example, we will use the native
+            NodeJS HTTP module to create a server that renders a page
+            using Temple. Start by replacing the 
+            {`src/index.ts`}
+            file with the following code. 
+            {`function() {}`}
+          
+
+          
+            {`
+              import temple from '@ossph/temple/compiler';
+              // make a temple compiler
+              const compiler = temple();
+              // render HTML
+              compiler.render('./src/page.dtml').then(console.log);
+              // render CSS
+              compiler.styles('./src/page.dtml').then(console.log);
+              // render JS
+              compiler.client('./src/page.dtml').then(console.log);
+            `}
+          
+
+          
    
+            {_('1. Add HTTP')}
+          
    
+
+          
+            In most cases Temple will be used to render a front end from 
+            a server framework. In this example, we will use the native
+            NodeJS HTTP module to create a server that renders a page
+            using Temple. Start by replacing the 
+            {`src/index.ts`}
+            file with the following code. 
+            {`function() {}`}
+          
+
+          
+            
    
+              {`
+                
+                
+                
    Hello {name}!
    
+              `}    
+              
+                
    Hello world!
    
+                  
+            
    
+              
+
+          
+            
+            Recommended:
+            Download the Temple editor plugin at the Visual Studio Marketplace.
+          
+
+          
+            
+              
    
+                
+                  src/index.ts
+                
+                
+                  src/page.dtml
+                
+                
+                  package.json
+                
+              
    
+                
+            
+              
    
+                
+                src
+              
    
+              
+                
+                index.ts
+              
+              
+                
+                page.dtml
+              
+              
+                
+                package.json
+              
+                
+            
+              {`
+                import http from 'http';
+                import temple from '@ossph/temple/compiler';
+
+                // create temple compiler
+                const compiler = temple();
+                // create http server
+                const server = http.createServer(async (req, res) => {
+                  // if build asset...
+                  if (req.url?.startsWith('/build/')) {
+                    // get filename ie. abc123.js
+                    const filename = req.url.substring(7);
+                    // get asset
+                    const { type, content } = await compiler.asset(filename);
+                    // send response
+                    res.writeHead(200, { 'Content-Type': type });
+                    return res.end(content);
+                  // if home page
+                  } else if (req.url === '/') {
+                    // render and send response
+                    res.writeHead(200, { 'Content-Type': 'text/html' });
+                    return res.end(await compiler.render('./src/page.dtml', {
+                      title: 'Hello World'
+                    }));
+                  }
+                });
+                // listen on port 3000
+                server.listen(3000);
+              `}
+              
+              
+            
+              
+
+          
+
+          
+            
+          
+        
+  
+
\ No newline at end of file