From 5157352946e3b4d2de0ddae79dbd91682b3069c2 Mon Sep 17 00:00:00 2001
From: gene <generoso.martello@gmail.com>
Date: Sat, 26 Oct 2024 12:45:59 +0200
Subject: [PATCH] Updated default font size.

---
 docs/feed/rss.xml                             | 22 +++++++++----------
 docs/pages/documentation/about/index.html     | 17 +++++++-------
 .../documentation/active_refresh/index.html   | 19 ++++++++--------
 .../api/helpers/Logger/index.html             | 17 +++++++-------
 .../api/helpers/TaskQueue/index.html          | 17 +++++++-------
 .../api/helpers/Utils.dom/index.html          | 17 +++++++-------
 .../api/helpers/Utils/index.html              | 17 +++++++-------
 .../api/helpers/Utils_dom/index.html          | 17 +++++++-------
 .../api/helpers/ZxQuery/index.html            | 17 +++++++-------
 .../api/helpers/ZxQueryStatic/index.html      | 17 +++++++-------
 docs/pages/documentation/api/index.html       | 17 +++++++-------
 .../api/localizer/Localizer/index.html        | 17 +++++++-------
 .../api/observable/ObjectObserver/index.html  | 17 +++++++-------
 .../observable/ObservableListener/index.html  | 17 +++++++-------
 .../observable/ObservableObject/index.html    | 17 +++++++-------
 .../api/zuix/ActiveRefresh/index.html         | 17 +++++++-------
 .../api/zuix/ComponentContext/index.html      | 17 +++++++-------
 .../api/zuix/Componentizer/index.html         | 17 +++++++-------
 .../api/zuix/ContextController/index.html     | 17 +++++++-------
 .../api/zuix/ControllerInstance/index.html    | 17 +++++++-------
 .../api/zuix/ViewObserver/index.html          | 17 +++++++-------
 .../documentation/api/zuix/Zuix/index.html    | 17 +++++++-------
 .../documentation/basic_concepts/index.html   | 17 +++++++-------
 docs/pages/documentation/cli/index.html       | 17 +++++++-------
 docs/pages/documentation/component/index.html | 17 +++++++-------
 .../documentation/context_options/index.html  | 17 +++++++-------
 .../pages/documentation/controller/index.html | 17 +++++++-------
 .../documentation/getting_started/index.html  | 17 +++++++-------
 docs/pages/documentation/index.html           | 17 +++++++-------
 docs/pages/documentation/view/index.html      | 17 +++++++-------
 docs/playground/index.html                    | 17 +++++++-------
 docs/search-index.json                        |  2 +-
 docs/search-list.json                         |  2 +-
 docs/search/index.html                        | 17 +++++++-------
 docs/service-worker.js                        |  2 +-
 docs/service-worker.js.map                    |  2 +-
 docs/sitemap.xml                              |  8 +++----
 source/_inc/layouts/side_drawer.liquid        |  2 +-
 source/_inc/layouts/side_drawer/drawer.css    |  5 +++--
 .../side_drawer/page_navigation.liquid        |  2 +-
 source/_inc/layouts/side_drawer/style.css     | 10 ++++-----
 .../documentation/active_refresh/index.md     |  2 +-
 42 files changed, 310 insertions(+), 278 deletions(-)

diff --git a/docs/feed/rss.xml b/docs/feed/rss.xml
index 7b01059..a346a8b 100644
--- a/docs/feed/rss.xml
+++ b/docs/feed/rss.xml
@@ -7,8 +7,8 @@
     <description></description>
     <language>en</language>
     <copyright></copyright>
-    <lastBuildDate>Wed, 13 Mar 2024 21:31:07 +0100</lastBuildDate>
-    <pubDate>Wed, 13 Mar 2024 21:31:07 +0100</pubDate>
+    <lastBuildDate>Sat, 26 Oct 2024 12:45:03 +0200</lastBuildDate>
+    <pubDate>Sat, 26 Oct 2024 12:45:03 +0200</pubDate>
     <image>
         <title>zuix.js</title>
         <url>https://zuixjs.org//images/icons/icon-152x152.png</url>
@@ -149,15 +149,6 @@
         <atom:link href="https://zuixjs.org//pages/documentation/api/observable/ObjectObserver/" rel="self" />
         <dc:creator></dc:creator>
     </item>
-    <item>
-        <title>Events and Active&amp;rarr;Refresh</title>
-        <link>https://zuixjs.org//pages/documentation/active_refresh/</link>
-        <guid isPermaLink="true">https://zuixjs.org//pages/documentation/active_refresh/</guid>
-        <description>About scoped scripts, dependencies, refresh-handlers, built-in @ handlers, custom handlers.</description>
-        <pubDate>Wed, 13 Mar 2024 21:22:35 +0100</pubDate>
-        <atom:link href="https://zuixjs.org//pages/documentation/active_refresh/" rel="self" />
-        <dc:creator></dc:creator>
-    </item>
     <item>
         <title>zuix.js &lt;i class=&#39;material-icons notranslate&#39;&gt;emoji_nature&lt;/i&gt; API</title>
         <link>https://zuixjs.org//pages/documentation/api/helpers/Utils.dom/</link>
@@ -293,5 +284,14 @@
         <atom:link href="https://zuixjs.org//pages/documentation/view/" rel="self" />
         <dc:creator></dc:creator>
     </item>
+    <item>
+        <title>Events and Active&amp;rarr;Refresh</title>
+        <link>https://zuixjs.org//pages/documentation/active_refresh/</link>
+        <guid isPermaLink="true">https://zuixjs.org//pages/documentation/active_refresh/</guid>
+        <description>About scoped scripts, dependencies, refresh-handlers, built-in @ handlers, custom handlers.</description>
+        <pubDate>Sat, 26 Oct 2024 12:36:23 +0200</pubDate>
+        <atom:link href="https://zuixjs.org//pages/documentation/active_refresh/" rel="self" />
+        <dc:creator></dc:creator>
+    </item>
 </channel>
 </rss>
diff --git a/docs/pages/documentation/about/index.html b/docs/pages/documentation/about/index.html
index 7daf86e..a79c316 100644
--- a/docs/pages/documentation/about/index.html
+++ b/docs/pages/documentation/about/index.html
@@ -78,7 +78,7 @@
     body {
         margin: 0;
         padding: 0;
-        font-size: 12px!important;
+        font-size: 12pt!important;
         font-family: "Roboto", "Open Sans", sans-serif;
         font-weight: 400;
         position: relative;
@@ -124,7 +124,7 @@
     }
     label {
         color: #366495;
-        font-size: 14px;
+        font-size: 12pt;
         text-transform: uppercase;
         font-weight: 600;
         margin-top: 24px;
@@ -137,7 +137,7 @@
     li {
         font-weight: 400;
         line-height: 175%;
-        font-size: 100%;
+        font-size: 105%;
         min-height: 32px;
     }
     li small {
@@ -181,7 +181,7 @@
     }
 
     code[class*=language-], pre[class*=language-] {
-        font-size: 115%;
+        font-size: 100%;
     }
     pre:not([class*="language-"]) {
         width: 100%;
@@ -250,7 +250,7 @@
         margin-bottom: 16px;
     }
     div.content > p {
-        font-size: 150% !important;
+        font-size: 110% !important;
         line-height: 170% !important;
         margin: 24px 0 24px;
     }
@@ -385,11 +385,11 @@
 
 .drawer-header .text-logo {
     font-family: "Roboto", "Open Sans", sans-serif;
-    font-size: 180%;
+    font-size: 150%;
     font-weight: 400;
 }
 .drawer-header .text-logo small {
-    font-size: 12px;
+    font-size: 10pt;
     vertical-align: middle;
     margin-left: 8px;
 }
@@ -447,6 +447,7 @@
     color: var(--primary-color);
 }
 .drawer-content li a {
+    font-weight: bold;
     color: var(--accent-color);
     position: relative;
     display: block;
@@ -486,7 +487,7 @@
 padding: 2px 4px;
 border-radius: 8px;
 margin-right: 4px;
-}</style><h2>Demos and templates</h2><ul><li><a href="/playground">zuix.js playground component</a><li><a href="https://zuixjs.github.io/zkit/">zKit web enhancing bits</a><li><a href="https://zuixjs.github.io/zuix-web-starter/">Web Starter template</a><li><a href="https://zuixjs.github.io/web-app/">Web App template</a><li><a href="https://zuixjs.github.io/news-blog/">News-Blog template</a></ul><h2>Old demos</h2><ul><li><a href="https://glitch.com/@genemars">zuix.js playground on Glitch</a><li><a href="https://codepen.io/genielabs">Examples on CodePen</a></ul><div layout="rows center-spread" style="margin-top: 112px; gap:12px; margin-bottom: 32px; padding-left: 8px; padding-right: 8px; font-size: 140%"><div>&nbsp;</div><a href="/pages/documentation/getting_started/" style="text-align: center"><label layout="row center-center"><span style="padding-left: 24px">Next</span> <i class="material-icons notranslate">arrow_right</i>&nbsp;</label><div class="mdl-color-text--pink">Getting started</div></a></div></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
+}</style><h2>Demos and templates</h2><ul><li><a href="/playground">zuix.js playground component</a><li><a href="https://zuixjs.github.io/zkit/">zKit web enhancing bits</a><li><a href="https://zuixjs.github.io/zuix-web-starter/">Web Starter template</a><li><a href="https://zuixjs.github.io/web-app/">Web App template</a><li><a href="https://zuixjs.github.io/news-blog/">News-Blog template</a></ul><h2>Old demos</h2><ul><li><a href="https://glitch.com/@genemars">zuix.js playground on Glitch</a><li><a href="https://codepen.io/genielabs">Examples on CodePen</a></ul><div layout="rows center-spread" style="margin-top: 112px; gap:12px; margin-bottom: 32px; padding-left: 8px; padding-right: 8px; font-size: 120%"><div>&nbsp;</div><a href="/pages/documentation/getting_started/" style="text-align: center"><label layout="row center-center"><span style="padding-left: 24px">Next</span> <i class="material-icons notranslate">arrow_right</i>&nbsp;</label><div class="mdl-color-text--pink">Getting started</div></a></div></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="font-size:80%; padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
 <ul>
     <li >
     <a href="/home" class="mdl-js-ripple-effect">
diff --git a/docs/pages/documentation/active_refresh/index.html b/docs/pages/documentation/active_refresh/index.html
index dfb59ed..6c7bf00 100644
--- a/docs/pages/documentation/active_refresh/index.html
+++ b/docs/pages/documentation/active_refresh/index.html
@@ -80,7 +80,7 @@
     body {
         margin: 0;
         padding: 0;
-        font-size: 12px!important;
+        font-size: 12pt!important;
         font-family: "Roboto", "Open Sans", sans-serif;
         font-weight: 400;
         position: relative;
@@ -126,7 +126,7 @@
     }
     label {
         color: #366495;
-        font-size: 14px;
+        font-size: 12pt;
         text-transform: uppercase;
         font-weight: 600;
         margin-top: 24px;
@@ -139,7 +139,7 @@
     li {
         font-weight: 400;
         line-height: 175%;
-        font-size: 100%;
+        font-size: 105%;
         min-height: 32px;
     }
     li small {
@@ -183,7 +183,7 @@
     }
 
     code[class*=language-], pre[class*=language-] {
-        font-size: 115%;
+        font-size: 100%;
     }
     pre:not([class*="language-"]) {
         width: 100%;
@@ -252,7 +252,7 @@
         margin-bottom: 16px;
     }
     div.content > p {
-        font-size: 150% !important;
+        font-size: 110% !important;
         line-height: 170% !important;
         margin: 24px 0 24px;
     }
@@ -387,11 +387,11 @@
 
 .drawer-header .text-logo {
     font-family: "Roboto", "Open Sans", sans-serif;
-    font-size: 180%;
+    font-size: 150%;
     font-weight: 400;
 }
 .drawer-header .text-logo small {
-    font-size: 12px;
+    font-size: 10pt;
     vertical-align: middle;
     margin-left: 8px;
 }
@@ -449,6 +449,7 @@
     color: var(--primary-color);
 }
 .drawer-content li a {
+    font-weight: bold;
     color: var(--accent-color);
     position: relative;
     display: block;
@@ -568,7 +569,7 @@
 function ready() {
 return self.testIsReady;
 }</script></div><mdl-button @disable-if="self.testIsReady" (click)="self.testIsReady = true">Set ready</mdl-button></div><style>[z-context="ready-example"] {
-    font-size: 200%;
+    font-size: 140%;
     width: 200px;
     padding: 12px;
     margin-bottom:24px;
@@ -847,7 +848,7 @@
 state<span class="token punctuation">.</span>validFormData <span class="token operator">=</span> <span class="token boolean">true</span><span class="token punctuation">;</span>
 
 <span class="token comment">// ...</span>
-</code></pre><div layout="rows center-spread" style="margin-top: 112px; gap:12px; margin-bottom: 32px; padding-left: 8px; padding-right: 8px; font-size: 140%"><a href="/pages/documentation/view/" style="text-align: center"><label layout="row center-center"><i class="material-icons notranslate">arrow_left</i>&nbsp; <span style="padding-right: 24px">Previous</span></label><div class="mdl-color-text--pink">View</div></a><a href="/pages/documentation/controller/" style="text-align: center"><label layout="row center-center"><span style="padding-left: 24px">Next</span> <i class="material-icons notranslate">arrow_right</i>&nbsp;</label><div class="mdl-color-text--pink">Controller</div></a></div></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
+</code></pre><div layout="rows center-spread" style="margin-top: 112px; gap:12px; margin-bottom: 32px; padding-left: 8px; padding-right: 8px; font-size: 120%"><a href="/pages/documentation/view/" style="text-align: center"><label layout="row center-center"><i class="material-icons notranslate">arrow_left</i>&nbsp; <span style="padding-right: 24px">Previous</span></label><div class="mdl-color-text--pink">View</div></a><a href="/pages/documentation/controller/" style="text-align: center"><label layout="row center-center"><span style="padding-left: 24px">Next</span> <i class="material-icons notranslate">arrow_right</i>&nbsp;</label><div class="mdl-color-text--pink">Controller</div></a></div></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="font-size:80%; padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
 <ul>
     <li >
     <a href="/home" class="mdl-js-ripple-effect">
diff --git a/docs/pages/documentation/api/helpers/Logger/index.html b/docs/pages/documentation/api/helpers/Logger/index.html
index f4061ea..11f24c0 100644
--- a/docs/pages/documentation/api/helpers/Logger/index.html
+++ b/docs/pages/documentation/api/helpers/Logger/index.html
@@ -80,7 +80,7 @@
     body {
         margin: 0;
         padding: 0;
-        font-size: 12px!important;
+        font-size: 12pt!important;
         font-family: "Roboto", "Open Sans", sans-serif;
         font-weight: 400;
         position: relative;
@@ -126,7 +126,7 @@
     }
     label {
         color: #366495;
-        font-size: 14px;
+        font-size: 12pt;
         text-transform: uppercase;
         font-weight: 600;
         margin-top: 24px;
@@ -139,7 +139,7 @@
     li {
         font-weight: 400;
         line-height: 175%;
-        font-size: 100%;
+        font-size: 105%;
         min-height: 32px;
     }
     li small {
@@ -183,7 +183,7 @@
     }
 
     code[class*=language-], pre[class*=language-] {
-        font-size: 115%;
+        font-size: 100%;
     }
     pre:not([class*="language-"]) {
         width: 100%;
@@ -252,7 +252,7 @@
         margin-bottom: 16px;
     }
     div.content > p {
-        font-size: 150% !important;
+        font-size: 110% !important;
         line-height: 170% !important;
         margin: 24px 0 24px;
     }
@@ -387,11 +387,11 @@
 
 .drawer-header .text-logo {
     font-family: "Roboto", "Open Sans", sans-serif;
-    font-size: 180%;
+    font-size: 150%;
     font-weight: 400;
 }
 .drawer-header .text-logo small {
-    font-size: 12px;
+    font-size: 10pt;
     vertical-align: middle;
     margin-left: 8px;
 }
@@ -449,6 +449,7 @@
     color: var(--primary-color);
 }
 .drawer-content li a {
+    font-weight: bold;
     color: var(--accent-color);
     position: relative;
     display: block;
@@ -721,7 +722,7 @@
 *Source:*
 [helpers/ZxQuery.js](../../helpers/ZxQuery.js), [line 101](../../helpers/ZxQuery.js#L101)
 
---></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
+--></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="font-size:80%; padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
 <ul>
     <li >
     <a href="/home" class="mdl-js-ripple-effect">
diff --git a/docs/pages/documentation/api/helpers/TaskQueue/index.html b/docs/pages/documentation/api/helpers/TaskQueue/index.html
index 68df74e..c2b16da 100644
--- a/docs/pages/documentation/api/helpers/TaskQueue/index.html
+++ b/docs/pages/documentation/api/helpers/TaskQueue/index.html
@@ -80,7 +80,7 @@
     body {
         margin: 0;
         padding: 0;
-        font-size: 12px!important;
+        font-size: 12pt!important;
         font-family: "Roboto", "Open Sans", sans-serif;
         font-weight: 400;
         position: relative;
@@ -126,7 +126,7 @@
     }
     label {
         color: #366495;
-        font-size: 14px;
+        font-size: 12pt;
         text-transform: uppercase;
         font-weight: 600;
         margin-top: 24px;
@@ -139,7 +139,7 @@
     li {
         font-weight: 400;
         line-height: 175%;
-        font-size: 100%;
+        font-size: 105%;
         min-height: 32px;
     }
     li small {
@@ -183,7 +183,7 @@
     }
 
     code[class*=language-], pre[class*=language-] {
-        font-size: 115%;
+        font-size: 100%;
     }
     pre:not([class*="language-"]) {
         width: 100%;
@@ -252,7 +252,7 @@
         margin-bottom: 16px;
     }
     div.content > p {
-        font-size: 150% !important;
+        font-size: 110% !important;
         line-height: 170% !important;
         margin: 24px 0 24px;
     }
@@ -387,11 +387,11 @@
 
 .drawer-header .text-logo {
     font-family: "Roboto", "Open Sans", sans-serif;
-    font-size: 180%;
+    font-size: 150%;
     font-weight: 400;
 }
 .drawer-header .text-logo small {
-    font-size: 12px;
+    font-size: 10pt;
     vertical-align: middle;
     margin-left: 8px;
 }
@@ -449,6 +449,7 @@
     color: var(--primary-color);
 }
 .drawer-content li a {
+    font-weight: bold;
     color: var(--accent-color);
     position: relative;
     display: block;
@@ -689,7 +690,7 @@
 *Source:*
 [helpers/ZxQuery.js](../../helpers/ZxQuery.js), [line 101](../../helpers/ZxQuery.js#L101)
 
---></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
+--></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="font-size:80%; padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
 <ul>
     <li >
     <a href="/home" class="mdl-js-ripple-effect">
diff --git a/docs/pages/documentation/api/helpers/Utils.dom/index.html b/docs/pages/documentation/api/helpers/Utils.dom/index.html
index b508482..44b79a2 100644
--- a/docs/pages/documentation/api/helpers/Utils.dom/index.html
+++ b/docs/pages/documentation/api/helpers/Utils.dom/index.html
@@ -80,7 +80,7 @@
     body {
         margin: 0;
         padding: 0;
-        font-size: 12px!important;
+        font-size: 12pt!important;
         font-family: "Roboto", "Open Sans", sans-serif;
         font-weight: 400;
         position: relative;
@@ -126,7 +126,7 @@
     }
     label {
         color: #366495;
-        font-size: 14px;
+        font-size: 12pt;
         text-transform: uppercase;
         font-weight: 600;
         margin-top: 24px;
@@ -139,7 +139,7 @@
     li {
         font-weight: 400;
         line-height: 175%;
-        font-size: 100%;
+        font-size: 105%;
         min-height: 32px;
     }
     li small {
@@ -183,7 +183,7 @@
     }
 
     code[class*=language-], pre[class*=language-] {
-        font-size: 115%;
+        font-size: 100%;
     }
     pre:not([class*="language-"]) {
         width: 100%;
@@ -252,7 +252,7 @@
         margin-bottom: 16px;
     }
     div.content > p {
-        font-size: 150% !important;
+        font-size: 110% !important;
         line-height: 170% !important;
         margin: 24px 0 24px;
     }
@@ -387,11 +387,11 @@
 
 .drawer-header .text-logo {
     font-family: "Roboto", "Open Sans", sans-serif;
-    font-size: 180%;
+    font-size: 150%;
     font-weight: 400;
 }
 .drawer-header .text-logo small {
-    font-size: 12px;
+    font-size: 10pt;
     vertical-align: middle;
     margin-left: 8px;
 }
@@ -449,6 +449,7 @@
     color: var(--primary-color);
 }
 .drawer-content li a {
+    font-weight: bold;
     color: var(--accent-color);
     position: relative;
     display: block;
@@ -709,7 +710,7 @@
 *Source:*
 [helpers/ZxQuery.js](../../helpers/ZxQuery.js), [line 101](../../helpers/ZxQuery.js#L101)
 
---></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
+--></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="font-size:80%; padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
 <ul>
     <li >
     <a href="/home" class="mdl-js-ripple-effect">
diff --git a/docs/pages/documentation/api/helpers/Utils/index.html b/docs/pages/documentation/api/helpers/Utils/index.html
index f702ce1..8ecb33c 100644
--- a/docs/pages/documentation/api/helpers/Utils/index.html
+++ b/docs/pages/documentation/api/helpers/Utils/index.html
@@ -80,7 +80,7 @@
     body {
         margin: 0;
         padding: 0;
-        font-size: 12px!important;
+        font-size: 12pt!important;
         font-family: "Roboto", "Open Sans", sans-serif;
         font-weight: 400;
         position: relative;
@@ -126,7 +126,7 @@
     }
     label {
         color: #366495;
-        font-size: 14px;
+        font-size: 12pt;
         text-transform: uppercase;
         font-weight: 600;
         margin-top: 24px;
@@ -139,7 +139,7 @@
     li {
         font-weight: 400;
         line-height: 175%;
-        font-size: 100%;
+        font-size: 105%;
         min-height: 32px;
     }
     li small {
@@ -183,7 +183,7 @@
     }
 
     code[class*=language-], pre[class*=language-] {
-        font-size: 115%;
+        font-size: 100%;
     }
     pre:not([class*="language-"]) {
         width: 100%;
@@ -252,7 +252,7 @@
         margin-bottom: 16px;
     }
     div.content > p {
-        font-size: 150% !important;
+        font-size: 110% !important;
         line-height: 170% !important;
         margin: 24px 0 24px;
     }
@@ -387,11 +387,11 @@
 
 .drawer-header .text-logo {
     font-family: "Roboto", "Open Sans", sans-serif;
-    font-size: 180%;
+    font-size: 150%;
     font-weight: 400;
 }
 .drawer-header .text-logo small {
-    font-size: 12px;
+    font-size: 10pt;
     vertical-align: middle;
     margin-left: 8px;
 }
@@ -449,6 +449,7 @@
     color: var(--primary-color);
 }
 .drawer-content li a {
+    font-weight: bold;
     color: var(--accent-color);
     position: relative;
     display: block;
@@ -724,7 +725,7 @@
 *Source:*
 [helpers/ZxQuery.js](../../helpers/ZxQuery.js), [line 101](../../helpers/ZxQuery.js#L101)
 
---></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
+--></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="font-size:80%; padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
 <ul>
     <li >
     <a href="/home" class="mdl-js-ripple-effect">
diff --git a/docs/pages/documentation/api/helpers/Utils_dom/index.html b/docs/pages/documentation/api/helpers/Utils_dom/index.html
index 547d2fc..c92fb58 100644
--- a/docs/pages/documentation/api/helpers/Utils_dom/index.html
+++ b/docs/pages/documentation/api/helpers/Utils_dom/index.html
@@ -80,7 +80,7 @@
     body {
         margin: 0;
         padding: 0;
-        font-size: 12px!important;
+        font-size: 12pt!important;
         font-family: "Roboto", "Open Sans", sans-serif;
         font-weight: 400;
         position: relative;
@@ -126,7 +126,7 @@
     }
     label {
         color: #366495;
-        font-size: 14px;
+        font-size: 12pt;
         text-transform: uppercase;
         font-weight: 600;
         margin-top: 24px;
@@ -139,7 +139,7 @@
     li {
         font-weight: 400;
         line-height: 175%;
-        font-size: 100%;
+        font-size: 105%;
         min-height: 32px;
     }
     li small {
@@ -183,7 +183,7 @@
     }
 
     code[class*=language-], pre[class*=language-] {
-        font-size: 115%;
+        font-size: 100%;
     }
     pre:not([class*="language-"]) {
         width: 100%;
@@ -252,7 +252,7 @@
         margin-bottom: 16px;
     }
     div.content > p {
-        font-size: 150% !important;
+        font-size: 110% !important;
         line-height: 170% !important;
         margin: 24px 0 24px;
     }
@@ -387,11 +387,11 @@
 
 .drawer-header .text-logo {
     font-family: "Roboto", "Open Sans", sans-serif;
-    font-size: 180%;
+    font-size: 150%;
     font-weight: 400;
 }
 .drawer-header .text-logo small {
-    font-size: 12px;
+    font-size: 10pt;
     vertical-align: middle;
     margin-left: 8px;
 }
@@ -449,6 +449,7 @@
     color: var(--primary-color);
 }
 .drawer-content li a {
+    font-weight: bold;
     color: var(--accent-color);
     position: relative;
     display: block;
@@ -709,7 +710,7 @@
 *Source:*
 [helpers/ZxQuery.js](../../helpers/ZxQuery.js), [line 101](../../helpers/ZxQuery.js#L101)
 
---></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
+--></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="font-size:80%; padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
 <ul>
     <li >
     <a href="/home" class="mdl-js-ripple-effect">
diff --git a/docs/pages/documentation/api/helpers/ZxQuery/index.html b/docs/pages/documentation/api/helpers/ZxQuery/index.html
index dd17f87..524322f 100644
--- a/docs/pages/documentation/api/helpers/ZxQuery/index.html
+++ b/docs/pages/documentation/api/helpers/ZxQuery/index.html
@@ -80,7 +80,7 @@
     body {
         margin: 0;
         padding: 0;
-        font-size: 12px!important;
+        font-size: 12pt!important;
         font-family: "Roboto", "Open Sans", sans-serif;
         font-weight: 400;
         position: relative;
@@ -126,7 +126,7 @@
     }
     label {
         color: #366495;
-        font-size: 14px;
+        font-size: 12pt;
         text-transform: uppercase;
         font-weight: 600;
         margin-top: 24px;
@@ -139,7 +139,7 @@
     li {
         font-weight: 400;
         line-height: 175%;
-        font-size: 100%;
+        font-size: 105%;
         min-height: 32px;
     }
     li small {
@@ -183,7 +183,7 @@
     }
 
     code[class*=language-], pre[class*=language-] {
-        font-size: 115%;
+        font-size: 100%;
     }
     pre:not([class*="language-"]) {
         width: 100%;
@@ -252,7 +252,7 @@
         margin-bottom: 16px;
     }
     div.content > p {
-        font-size: 150% !important;
+        font-size: 110% !important;
         line-height: 170% !important;
         margin: 24px 0 24px;
     }
@@ -387,11 +387,11 @@
 
 .drawer-header .text-logo {
     font-family: "Roboto", "Open Sans", sans-serif;
-    font-size: 180%;
+    font-size: 150%;
     font-weight: 400;
 }
 .drawer-header .text-logo small {
-    font-size: 12px;
+    font-size: 10pt;
     vertical-align: middle;
     margin-left: 8px;
 }
@@ -449,6 +449,7 @@
     color: var(--primary-color);
 }
 .drawer-content li a {
+    font-weight: bold;
     color: var(--accent-color);
     position: relative;
     display: block;
@@ -874,7 +875,7 @@
 *Source:*
 [helpers/ZxQuery.js](../../helpers/ZxQuery.js), [line 101](../../helpers/ZxQuery.js#L101)
 
---></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
+--></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="font-size:80%; padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
 <ul>
     <li >
     <a href="/home" class="mdl-js-ripple-effect">
diff --git a/docs/pages/documentation/api/helpers/ZxQueryStatic/index.html b/docs/pages/documentation/api/helpers/ZxQueryStatic/index.html
index 319fd7d..88796f6 100644
--- a/docs/pages/documentation/api/helpers/ZxQueryStatic/index.html
+++ b/docs/pages/documentation/api/helpers/ZxQueryStatic/index.html
@@ -80,7 +80,7 @@
     body {
         margin: 0;
         padding: 0;
-        font-size: 12px!important;
+        font-size: 12pt!important;
         font-family: "Roboto", "Open Sans", sans-serif;
         font-weight: 400;
         position: relative;
@@ -126,7 +126,7 @@
     }
     label {
         color: #366495;
-        font-size: 14px;
+        font-size: 12pt;
         text-transform: uppercase;
         font-weight: 600;
         margin-top: 24px;
@@ -139,7 +139,7 @@
     li {
         font-weight: 400;
         line-height: 175%;
-        font-size: 100%;
+        font-size: 105%;
         min-height: 32px;
     }
     li small {
@@ -183,7 +183,7 @@
     }
 
     code[class*=language-], pre[class*=language-] {
-        font-size: 115%;
+        font-size: 100%;
     }
     pre:not([class*="language-"]) {
         width: 100%;
@@ -252,7 +252,7 @@
         margin-bottom: 16px;
     }
     div.content > p {
-        font-size: 150% !important;
+        font-size: 110% !important;
         line-height: 170% !important;
         margin: 24px 0 24px;
     }
@@ -387,11 +387,11 @@
 
 .drawer-header .text-logo {
     font-family: "Roboto", "Open Sans", sans-serif;
-    font-size: 180%;
+    font-size: 150%;
     font-weight: 400;
 }
 .drawer-header .text-logo small {
-    font-size: 12px;
+    font-size: 10pt;
     vertical-align: middle;
     margin-left: 8px;
 }
@@ -449,6 +449,7 @@
     color: var(--primary-color);
 }
 .drawer-content li a {
+    font-weight: bold;
     color: var(--accent-color);
     position: relative;
     display: block;
@@ -739,7 +740,7 @@
 *Source:*
 [helpers/ZxQuery.js](../../helpers/ZxQuery.js), [line 101](../../helpers/ZxQuery.js#L101)
 
---></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
+--></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="font-size:80%; padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
 <ul>
     <li >
     <a href="/home" class="mdl-js-ripple-effect">
diff --git a/docs/pages/documentation/api/index.html b/docs/pages/documentation/api/index.html
index 3df90dc..c3b3bc8 100644
--- a/docs/pages/documentation/api/index.html
+++ b/docs/pages/documentation/api/index.html
@@ -78,7 +78,7 @@
     body {
         margin: 0;
         padding: 0;
-        font-size: 12px!important;
+        font-size: 12pt!important;
         font-family: "Roboto", "Open Sans", sans-serif;
         font-weight: 400;
         position: relative;
@@ -124,7 +124,7 @@
     }
     label {
         color: #366495;
-        font-size: 14px;
+        font-size: 12pt;
         text-transform: uppercase;
         font-weight: 600;
         margin-top: 24px;
@@ -137,7 +137,7 @@
     li {
         font-weight: 400;
         line-height: 175%;
-        font-size: 100%;
+        font-size: 105%;
         min-height: 32px;
     }
     li small {
@@ -181,7 +181,7 @@
     }
 
     code[class*=language-], pre[class*=language-] {
-        font-size: 115%;
+        font-size: 100%;
     }
     pre:not([class*="language-"]) {
         width: 100%;
@@ -250,7 +250,7 @@
         margin-bottom: 16px;
     }
     div.content > p {
-        font-size: 150% !important;
+        font-size: 110% !important;
         line-height: 170% !important;
         margin: 24px 0 24px;
     }
@@ -385,11 +385,11 @@
 
 .drawer-header .text-logo {
     font-family: "Roboto", "Open Sans", sans-serif;
-    font-size: 180%;
+    font-size: 150%;
     font-weight: 400;
 }
 .drawer-header .text-logo small {
-    font-size: 12px;
+    font-size: 10pt;
     vertical-align: middle;
     margin-left: 8px;
 }
@@ -447,6 +447,7 @@
     color: var(--primary-color);
 }
 .drawer-content li a {
+    font-weight: bold;
     color: var(--accent-color);
     position: relative;
     display: block;
@@ -494,7 +495,7 @@
 
 ...
 
---><div layout="rows center-spread" style="margin-top: 112px; gap:12px; margin-bottom: 32px; padding-left: 8px; padding-right: 8px; font-size: 140%"><a href="/playground/" style="text-align: center"><label layout="row center-center"><i class="material-icons notranslate">arrow_left</i>&nbsp; <span style="padding-right: 24px">Previous</span></label><div class="mdl-color-text--pink">Playground</div></a><div>&nbsp;</div></div></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
+--><div layout="rows center-spread" style="margin-top: 112px; gap:12px; margin-bottom: 32px; padding-left: 8px; padding-right: 8px; font-size: 120%"><a href="/playground/" style="text-align: center"><label layout="row center-center"><i class="material-icons notranslate">arrow_left</i>&nbsp; <span style="padding-right: 24px">Previous</span></label><div class="mdl-color-text--pink">Playground</div></a><div>&nbsp;</div></div></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="font-size:80%; padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
 <ul>
     <li >
     <a href="/home" class="mdl-js-ripple-effect">
diff --git a/docs/pages/documentation/api/localizer/Localizer/index.html b/docs/pages/documentation/api/localizer/Localizer/index.html
index 68c588f..d9141b1 100644
--- a/docs/pages/documentation/api/localizer/Localizer/index.html
+++ b/docs/pages/documentation/api/localizer/Localizer/index.html
@@ -80,7 +80,7 @@
     body {
         margin: 0;
         padding: 0;
-        font-size: 12px!important;
+        font-size: 12pt!important;
         font-family: "Roboto", "Open Sans", sans-serif;
         font-weight: 400;
         position: relative;
@@ -126,7 +126,7 @@
     }
     label {
         color: #366495;
-        font-size: 14px;
+        font-size: 12pt;
         text-transform: uppercase;
         font-weight: 600;
         margin-top: 24px;
@@ -139,7 +139,7 @@
     li {
         font-weight: 400;
         line-height: 175%;
-        font-size: 100%;
+        font-size: 105%;
         min-height: 32px;
     }
     li small {
@@ -183,7 +183,7 @@
     }
 
     code[class*=language-], pre[class*=language-] {
-        font-size: 115%;
+        font-size: 100%;
     }
     pre:not([class*="language-"]) {
         width: 100%;
@@ -252,7 +252,7 @@
         margin-bottom: 16px;
     }
     div.content > p {
-        font-size: 150% !important;
+        font-size: 110% !important;
         line-height: 170% !important;
         margin: 24px 0 24px;
     }
@@ -387,11 +387,11 @@
 
 .drawer-header .text-logo {
     font-family: "Roboto", "Open Sans", sans-serif;
-    font-size: 180%;
+    font-size: 150%;
     font-weight: 400;
 }
 .drawer-header .text-logo small {
-    font-size: 12px;
+    font-size: 10pt;
     vertical-align: middle;
     margin-left: 8px;
 }
@@ -449,6 +449,7 @@
     color: var(--primary-color);
 }
 .drawer-content li a {
+    font-weight: bold;
     color: var(--accent-color);
     position: relative;
     display: block;
@@ -704,7 +705,7 @@
 *Source:*
 [helpers/ZxQuery.js](../../helpers/ZxQuery.js), [line 101](../../helpers/ZxQuery.js#L101)
 
---></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
+--></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="font-size:80%; padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
 <ul>
     <li >
     <a href="/home" class="mdl-js-ripple-effect">
diff --git a/docs/pages/documentation/api/observable/ObjectObserver/index.html b/docs/pages/documentation/api/observable/ObjectObserver/index.html
index 7e74bff..5fe865f 100644
--- a/docs/pages/documentation/api/observable/ObjectObserver/index.html
+++ b/docs/pages/documentation/api/observable/ObjectObserver/index.html
@@ -80,7 +80,7 @@
     body {
         margin: 0;
         padding: 0;
-        font-size: 12px!important;
+        font-size: 12pt!important;
         font-family: "Roboto", "Open Sans", sans-serif;
         font-weight: 400;
         position: relative;
@@ -126,7 +126,7 @@
     }
     label {
         color: #366495;
-        font-size: 14px;
+        font-size: 12pt;
         text-transform: uppercase;
         font-weight: 600;
         margin-top: 24px;
@@ -139,7 +139,7 @@
     li {
         font-weight: 400;
         line-height: 175%;
-        font-size: 100%;
+        font-size: 105%;
         min-height: 32px;
     }
     li small {
@@ -183,7 +183,7 @@
     }
 
     code[class*=language-], pre[class*=language-] {
-        font-size: 115%;
+        font-size: 100%;
     }
     pre:not([class*="language-"]) {
         width: 100%;
@@ -252,7 +252,7 @@
         margin-bottom: 16px;
     }
     div.content > p {
-        font-size: 150% !important;
+        font-size: 110% !important;
         line-height: 170% !important;
         margin: 24px 0 24px;
     }
@@ -387,11 +387,11 @@
 
 .drawer-header .text-logo {
     font-family: "Roboto", "Open Sans", sans-serif;
-    font-size: 180%;
+    font-size: 150%;
     font-weight: 400;
 }
 .drawer-header .text-logo small {
-    font-size: 12px;
+    font-size: 10pt;
     vertical-align: middle;
     margin-left: 8px;
 }
@@ -449,6 +449,7 @@
     color: var(--primary-color);
 }
 .drawer-content li a {
+    font-weight: bold;
     color: var(--accent-color);
     position: relative;
     display: block;
@@ -689,7 +690,7 @@
 *Source:*
 [helpers/ZxQuery.js](../../helpers/ZxQuery.js), [line 101](../../helpers/ZxQuery.js#L101)
 
---></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
+--></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="font-size:80%; padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
 <ul>
     <li >
     <a href="/home" class="mdl-js-ripple-effect">
diff --git a/docs/pages/documentation/api/observable/ObservableListener/index.html b/docs/pages/documentation/api/observable/ObservableListener/index.html
index 0828b95..f90cc1b 100644
--- a/docs/pages/documentation/api/observable/ObservableListener/index.html
+++ b/docs/pages/documentation/api/observable/ObservableListener/index.html
@@ -80,7 +80,7 @@
     body {
         margin: 0;
         padding: 0;
-        font-size: 12px!important;
+        font-size: 12pt!important;
         font-family: "Roboto", "Open Sans", sans-serif;
         font-weight: 400;
         position: relative;
@@ -126,7 +126,7 @@
     }
     label {
         color: #366495;
-        font-size: 14px;
+        font-size: 12pt;
         text-transform: uppercase;
         font-weight: 600;
         margin-top: 24px;
@@ -139,7 +139,7 @@
     li {
         font-weight: 400;
         line-height: 175%;
-        font-size: 100%;
+        font-size: 105%;
         min-height: 32px;
     }
     li small {
@@ -183,7 +183,7 @@
     }
 
     code[class*=language-], pre[class*=language-] {
-        font-size: 115%;
+        font-size: 100%;
     }
     pre:not([class*="language-"]) {
         width: 100%;
@@ -252,7 +252,7 @@
         margin-bottom: 16px;
     }
     div.content > p {
-        font-size: 150% !important;
+        font-size: 110% !important;
         line-height: 170% !important;
         margin: 24px 0 24px;
     }
@@ -387,11 +387,11 @@
 
 .drawer-header .text-logo {
     font-family: "Roboto", "Open Sans", sans-serif;
-    font-size: 180%;
+    font-size: 150%;
     font-weight: 400;
 }
 .drawer-header .text-logo small {
-    font-size: 12px;
+    font-size: 10pt;
     vertical-align: middle;
     margin-left: 8px;
 }
@@ -449,6 +449,7 @@
     color: var(--primary-color);
 }
 .drawer-content li a {
+    font-weight: bold;
     color: var(--accent-color);
     position: relative;
     display: block;
@@ -699,7 +700,7 @@
 *Source:*
 [helpers/ZxQuery.js](../../helpers/ZxQuery.js), [line 101](../../helpers/ZxQuery.js#L101)
 
---></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
+--></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="font-size:80%; padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
 <ul>
     <li >
     <a href="/home" class="mdl-js-ripple-effect">
diff --git a/docs/pages/documentation/api/observable/ObservableObject/index.html b/docs/pages/documentation/api/observable/ObservableObject/index.html
index f02aaaf..28615e3 100644
--- a/docs/pages/documentation/api/observable/ObservableObject/index.html
+++ b/docs/pages/documentation/api/observable/ObservableObject/index.html
@@ -80,7 +80,7 @@
     body {
         margin: 0;
         padding: 0;
-        font-size: 12px!important;
+        font-size: 12pt!important;
         font-family: "Roboto", "Open Sans", sans-serif;
         font-weight: 400;
         position: relative;
@@ -126,7 +126,7 @@
     }
     label {
         color: #366495;
-        font-size: 14px;
+        font-size: 12pt;
         text-transform: uppercase;
         font-weight: 600;
         margin-top: 24px;
@@ -139,7 +139,7 @@
     li {
         font-weight: 400;
         line-height: 175%;
-        font-size: 100%;
+        font-size: 105%;
         min-height: 32px;
     }
     li small {
@@ -183,7 +183,7 @@
     }
 
     code[class*=language-], pre[class*=language-] {
-        font-size: 115%;
+        font-size: 100%;
     }
     pre:not([class*="language-"]) {
         width: 100%;
@@ -252,7 +252,7 @@
         margin-bottom: 16px;
     }
     div.content > p {
-        font-size: 150% !important;
+        font-size: 110% !important;
         line-height: 170% !important;
         margin: 24px 0 24px;
     }
@@ -387,11 +387,11 @@
 
 .drawer-header .text-logo {
     font-family: "Roboto", "Open Sans", sans-serif;
-    font-size: 180%;
+    font-size: 150%;
     font-weight: 400;
 }
 .drawer-header .text-logo small {
-    font-size: 12px;
+    font-size: 10pt;
     vertical-align: middle;
     margin-left: 8px;
 }
@@ -449,6 +449,7 @@
     color: var(--primary-color);
 }
 .drawer-content li a {
+    font-weight: bold;
     color: var(--accent-color);
     position: relative;
     display: block;
@@ -694,7 +695,7 @@
 *Source:*
 [helpers/ZxQuery.js](../../helpers/ZxQuery.js), [line 101](../../helpers/ZxQuery.js#L101)
 
---></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
+--></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="font-size:80%; padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
 <ul>
     <li >
     <a href="/home" class="mdl-js-ripple-effect">
diff --git a/docs/pages/documentation/api/zuix/ActiveRefresh/index.html b/docs/pages/documentation/api/zuix/ActiveRefresh/index.html
index 189e1fd..be9ee40 100644
--- a/docs/pages/documentation/api/zuix/ActiveRefresh/index.html
+++ b/docs/pages/documentation/api/zuix/ActiveRefresh/index.html
@@ -80,7 +80,7 @@
     body {
         margin: 0;
         padding: 0;
-        font-size: 12px!important;
+        font-size: 12pt!important;
         font-family: "Roboto", "Open Sans", sans-serif;
         font-weight: 400;
         position: relative;
@@ -126,7 +126,7 @@
     }
     label {
         color: #366495;
-        font-size: 14px;
+        font-size: 12pt;
         text-transform: uppercase;
         font-weight: 600;
         margin-top: 24px;
@@ -139,7 +139,7 @@
     li {
         font-weight: 400;
         line-height: 175%;
-        font-size: 100%;
+        font-size: 105%;
         min-height: 32px;
     }
     li small {
@@ -183,7 +183,7 @@
     }
 
     code[class*=language-], pre[class*=language-] {
-        font-size: 115%;
+        font-size: 100%;
     }
     pre:not([class*="language-"]) {
         width: 100%;
@@ -252,7 +252,7 @@
         margin-bottom: 16px;
     }
     div.content > p {
-        font-size: 150% !important;
+        font-size: 110% !important;
         line-height: 170% !important;
         margin: 24px 0 24px;
     }
@@ -387,11 +387,11 @@
 
 .drawer-header .text-logo {
     font-family: "Roboto", "Open Sans", sans-serif;
-    font-size: 180%;
+    font-size: 150%;
     font-weight: 400;
 }
 .drawer-header .text-logo small {
-    font-size: 12px;
+    font-size: 10pt;
     vertical-align: middle;
     margin-left: 8px;
 }
@@ -449,6 +449,7 @@
     color: var(--primary-color);
 }
 .drawer-content li a {
+    font-weight: bold;
     color: var(--accent-color);
     position: relative;
     display: block;
@@ -704,7 +705,7 @@
 *Source:*
 [helpers/ZxQuery.js](../../helpers/ZxQuery.js), [line 101](../../helpers/ZxQuery.js#L101)
 
---></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
+--></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="font-size:80%; padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
 <ul>
     <li >
     <a href="/home" class="mdl-js-ripple-effect">
diff --git a/docs/pages/documentation/api/zuix/ComponentContext/index.html b/docs/pages/documentation/api/zuix/ComponentContext/index.html
index cb72508..32443e8 100644
--- a/docs/pages/documentation/api/zuix/ComponentContext/index.html
+++ b/docs/pages/documentation/api/zuix/ComponentContext/index.html
@@ -80,7 +80,7 @@
     body {
         margin: 0;
         padding: 0;
-        font-size: 12px!important;
+        font-size: 12pt!important;
         font-family: "Roboto", "Open Sans", sans-serif;
         font-weight: 400;
         position: relative;
@@ -126,7 +126,7 @@
     }
     label {
         color: #366495;
-        font-size: 14px;
+        font-size: 12pt;
         text-transform: uppercase;
         font-weight: 600;
         margin-top: 24px;
@@ -139,7 +139,7 @@
     li {
         font-weight: 400;
         line-height: 175%;
-        font-size: 100%;
+        font-size: 105%;
         min-height: 32px;
     }
     li small {
@@ -183,7 +183,7 @@
     }
 
     code[class*=language-], pre[class*=language-] {
-        font-size: 115%;
+        font-size: 100%;
     }
     pre:not([class*="language-"]) {
         width: 100%;
@@ -252,7 +252,7 @@
         margin-bottom: 16px;
     }
     div.content > p {
-        font-size: 150% !important;
+        font-size: 110% !important;
         line-height: 170% !important;
         margin: 24px 0 24px;
     }
@@ -387,11 +387,11 @@
 
 .drawer-header .text-logo {
     font-family: "Roboto", "Open Sans", sans-serif;
-    font-size: 180%;
+    font-size: 150%;
     font-weight: 400;
 }
 .drawer-header .text-logo small {
-    font-size: 12px;
+    font-size: 10pt;
     vertical-align: middle;
     margin-left: 8px;
 }
@@ -449,6 +449,7 @@
     color: var(--primary-color);
 }
 .drawer-content li a {
+    font-weight: bold;
     color: var(--accent-color);
     position: relative;
     display: block;
@@ -769,7 +770,7 @@
 *Source:*
 [helpers/ZxQuery.js](../../helpers/ZxQuery.js), [line 101](../../helpers/ZxQuery.js#L101)
 
---></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
+--></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="font-size:80%; padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
 <ul>
     <li >
     <a href="/home" class="mdl-js-ripple-effect">
diff --git a/docs/pages/documentation/api/zuix/Componentizer/index.html b/docs/pages/documentation/api/zuix/Componentizer/index.html
index 0fc1925..84ffe57 100644
--- a/docs/pages/documentation/api/zuix/Componentizer/index.html
+++ b/docs/pages/documentation/api/zuix/Componentizer/index.html
@@ -80,7 +80,7 @@
     body {
         margin: 0;
         padding: 0;
-        font-size: 12px!important;
+        font-size: 12pt!important;
         font-family: "Roboto", "Open Sans", sans-serif;
         font-weight: 400;
         position: relative;
@@ -126,7 +126,7 @@
     }
     label {
         color: #366495;
-        font-size: 14px;
+        font-size: 12pt;
         text-transform: uppercase;
         font-weight: 600;
         margin-top: 24px;
@@ -139,7 +139,7 @@
     li {
         font-weight: 400;
         line-height: 175%;
-        font-size: 100%;
+        font-size: 105%;
         min-height: 32px;
     }
     li small {
@@ -183,7 +183,7 @@
     }
 
     code[class*=language-], pre[class*=language-] {
-        font-size: 115%;
+        font-size: 100%;
     }
     pre:not([class*="language-"]) {
         width: 100%;
@@ -252,7 +252,7 @@
         margin-bottom: 16px;
     }
     div.content > p {
-        font-size: 150% !important;
+        font-size: 110% !important;
         line-height: 170% !important;
         margin: 24px 0 24px;
     }
@@ -387,11 +387,11 @@
 
 .drawer-header .text-logo {
     font-family: "Roboto", "Open Sans", sans-serif;
-    font-size: 180%;
+    font-size: 150%;
     font-weight: 400;
 }
 .drawer-header .text-logo small {
-    font-size: 12px;
+    font-size: 10pt;
     vertical-align: middle;
     margin-left: 8px;
 }
@@ -449,6 +449,7 @@
     color: var(--primary-color);
 }
 .drawer-content li a {
+    font-weight: bold;
     color: var(--accent-color);
     position: relative;
     display: block;
@@ -704,7 +705,7 @@
 *Source:*
 [helpers/ZxQuery.js](../../helpers/ZxQuery.js), [line 101](../../helpers/ZxQuery.js#L101)
 
---></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
+--></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="font-size:80%; padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
 <ul>
     <li >
     <a href="/home" class="mdl-js-ripple-effect">
diff --git a/docs/pages/documentation/api/zuix/ContextController/index.html b/docs/pages/documentation/api/zuix/ContextController/index.html
index 8255e01..99c8ffc 100644
--- a/docs/pages/documentation/api/zuix/ContextController/index.html
+++ b/docs/pages/documentation/api/zuix/ContextController/index.html
@@ -80,7 +80,7 @@
     body {
         margin: 0;
         padding: 0;
-        font-size: 12px!important;
+        font-size: 12pt!important;
         font-family: "Roboto", "Open Sans", sans-serif;
         font-weight: 400;
         position: relative;
@@ -126,7 +126,7 @@
     }
     label {
         color: #366495;
-        font-size: 14px;
+        font-size: 12pt;
         text-transform: uppercase;
         font-weight: 600;
         margin-top: 24px;
@@ -139,7 +139,7 @@
     li {
         font-weight: 400;
         line-height: 175%;
-        font-size: 100%;
+        font-size: 105%;
         min-height: 32px;
     }
     li small {
@@ -183,7 +183,7 @@
     }
 
     code[class*=language-], pre[class*=language-] {
-        font-size: 115%;
+        font-size: 100%;
     }
     pre:not([class*="language-"]) {
         width: 100%;
@@ -252,7 +252,7 @@
         margin-bottom: 16px;
     }
     div.content > p {
-        font-size: 150% !important;
+        font-size: 110% !important;
         line-height: 170% !important;
         margin: 24px 0 24px;
     }
@@ -387,11 +387,11 @@
 
 .drawer-header .text-logo {
     font-family: "Roboto", "Open Sans", sans-serif;
-    font-size: 180%;
+    font-size: 150%;
     font-weight: 400;
 }
 .drawer-header .text-logo small {
-    font-size: 12px;
+    font-size: 10pt;
     vertical-align: middle;
     margin-left: 8px;
 }
@@ -449,6 +449,7 @@
     color: var(--primary-color);
 }
 .drawer-content li a {
+    font-weight: bold;
     color: var(--accent-color);
     position: relative;
     display: block;
@@ -794,7 +795,7 @@
 *Source:*
 [helpers/ZxQuery.js](../../helpers/ZxQuery.js), [line 101](../../helpers/ZxQuery.js#L101)
 
---></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
+--></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="font-size:80%; padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
 <ul>
     <li >
     <a href="/home" class="mdl-js-ripple-effect">
diff --git a/docs/pages/documentation/api/zuix/ControllerInstance/index.html b/docs/pages/documentation/api/zuix/ControllerInstance/index.html
index 28c3f87..3fede51 100644
--- a/docs/pages/documentation/api/zuix/ControllerInstance/index.html
+++ b/docs/pages/documentation/api/zuix/ControllerInstance/index.html
@@ -80,7 +80,7 @@
     body {
         margin: 0;
         padding: 0;
-        font-size: 12px!important;
+        font-size: 12pt!important;
         font-family: "Roboto", "Open Sans", sans-serif;
         font-weight: 400;
         position: relative;
@@ -126,7 +126,7 @@
     }
     label {
         color: #366495;
-        font-size: 14px;
+        font-size: 12pt;
         text-transform: uppercase;
         font-weight: 600;
         margin-top: 24px;
@@ -139,7 +139,7 @@
     li {
         font-weight: 400;
         line-height: 175%;
-        font-size: 100%;
+        font-size: 105%;
         min-height: 32px;
     }
     li small {
@@ -183,7 +183,7 @@
     }
 
     code[class*=language-], pre[class*=language-] {
-        font-size: 115%;
+        font-size: 100%;
     }
     pre:not([class*="language-"]) {
         width: 100%;
@@ -252,7 +252,7 @@
         margin-bottom: 16px;
     }
     div.content > p {
-        font-size: 150% !important;
+        font-size: 110% !important;
         line-height: 170% !important;
         margin: 24px 0 24px;
     }
@@ -387,11 +387,11 @@
 
 .drawer-header .text-logo {
     font-family: "Roboto", "Open Sans", sans-serif;
-    font-size: 180%;
+    font-size: 150%;
     font-weight: 400;
 }
 .drawer-header .text-logo small {
-    font-size: 12px;
+    font-size: 10pt;
     vertical-align: middle;
     margin-left: 8px;
 }
@@ -449,6 +449,7 @@
     color: var(--primary-color);
 }
 .drawer-content li a {
+    font-weight: bold;
     color: var(--accent-color);
     position: relative;
     display: block;
@@ -814,7 +815,7 @@
 *Source:*
 [helpers/ZxQuery.js](../../helpers/ZxQuery.js), [line 101](../../helpers/ZxQuery.js#L101)
 
---></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
+--></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="font-size:80%; padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
 <ul>
     <li >
     <a href="/home" class="mdl-js-ripple-effect">
diff --git a/docs/pages/documentation/api/zuix/ViewObserver/index.html b/docs/pages/documentation/api/zuix/ViewObserver/index.html
index 7bdf393..6bc765e 100644
--- a/docs/pages/documentation/api/zuix/ViewObserver/index.html
+++ b/docs/pages/documentation/api/zuix/ViewObserver/index.html
@@ -80,7 +80,7 @@
     body {
         margin: 0;
         padding: 0;
-        font-size: 12px!important;
+        font-size: 12pt!important;
         font-family: "Roboto", "Open Sans", sans-serif;
         font-weight: 400;
         position: relative;
@@ -126,7 +126,7 @@
     }
     label {
         color: #366495;
-        font-size: 14px;
+        font-size: 12pt;
         text-transform: uppercase;
         font-weight: 600;
         margin-top: 24px;
@@ -139,7 +139,7 @@
     li {
         font-weight: 400;
         line-height: 175%;
-        font-size: 100%;
+        font-size: 105%;
         min-height: 32px;
     }
     li small {
@@ -183,7 +183,7 @@
     }
 
     code[class*=language-], pre[class*=language-] {
-        font-size: 115%;
+        font-size: 100%;
     }
     pre:not([class*="language-"]) {
         width: 100%;
@@ -252,7 +252,7 @@
         margin-bottom: 16px;
     }
     div.content > p {
-        font-size: 150% !important;
+        font-size: 110% !important;
         line-height: 170% !important;
         margin: 24px 0 24px;
     }
@@ -387,11 +387,11 @@
 
 .drawer-header .text-logo {
     font-family: "Roboto", "Open Sans", sans-serif;
-    font-size: 180%;
+    font-size: 150%;
     font-weight: 400;
 }
 .drawer-header .text-logo small {
-    font-size: 12px;
+    font-size: 10pt;
     vertical-align: middle;
     margin-left: 8px;
 }
@@ -449,6 +449,7 @@
     color: var(--primary-color);
 }
 .drawer-content li a {
+    font-weight: bold;
     color: var(--accent-color);
     position: relative;
     display: block;
@@ -684,7 +685,7 @@
 *Source:*
 [helpers/ZxQuery.js](../../helpers/ZxQuery.js), [line 101](../../helpers/ZxQuery.js#L101)
 
---></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
+--></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="font-size:80%; padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
 <ul>
     <li >
     <a href="/home" class="mdl-js-ripple-effect">
diff --git a/docs/pages/documentation/api/zuix/Zuix/index.html b/docs/pages/documentation/api/zuix/Zuix/index.html
index f9f70c4..2f529df 100644
--- a/docs/pages/documentation/api/zuix/Zuix/index.html
+++ b/docs/pages/documentation/api/zuix/Zuix/index.html
@@ -80,7 +80,7 @@
     body {
         margin: 0;
         padding: 0;
-        font-size: 12px!important;
+        font-size: 12pt!important;
         font-family: "Roboto", "Open Sans", sans-serif;
         font-weight: 400;
         position: relative;
@@ -126,7 +126,7 @@
     }
     label {
         color: #366495;
-        font-size: 14px;
+        font-size: 12pt;
         text-transform: uppercase;
         font-weight: 600;
         margin-top: 24px;
@@ -139,7 +139,7 @@
     li {
         font-weight: 400;
         line-height: 175%;
-        font-size: 100%;
+        font-size: 105%;
         min-height: 32px;
     }
     li small {
@@ -183,7 +183,7 @@
     }
 
     code[class*=language-], pre[class*=language-] {
-        font-size: 115%;
+        font-size: 100%;
     }
     pre:not([class*="language-"]) {
         width: 100%;
@@ -252,7 +252,7 @@
         margin-bottom: 16px;
     }
     div.content > p {
-        font-size: 150% !important;
+        font-size: 110% !important;
         line-height: 170% !important;
         margin: 24px 0 24px;
     }
@@ -387,11 +387,11 @@
 
 .drawer-header .text-logo {
     font-family: "Roboto", "Open Sans", sans-serif;
-    font-size: 180%;
+    font-size: 150%;
     font-weight: 400;
 }
 .drawer-header .text-logo small {
-    font-size: 12px;
+    font-size: 10pt;
     vertical-align: middle;
     margin-left: 8px;
 }
@@ -449,6 +449,7 @@
     color: var(--primary-color);
 }
 .drawer-content li a {
+    font-weight: bold;
     color: var(--accent-color);
     position: relative;
     display: block;
@@ -922,7 +923,7 @@
 *Source:*
 [helpers/ZxQuery.js](../../helpers/ZxQuery.js), [line 101](../../helpers/ZxQuery.js#L101)
 
---></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
+--></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="font-size:80%; padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
 <ul>
     <li >
     <a href="/home" class="mdl-js-ripple-effect">
diff --git a/docs/pages/documentation/basic_concepts/index.html b/docs/pages/documentation/basic_concepts/index.html
index ad711ff..e0d10d9 100644
--- a/docs/pages/documentation/basic_concepts/index.html
+++ b/docs/pages/documentation/basic_concepts/index.html
@@ -80,7 +80,7 @@
     body {
         margin: 0;
         padding: 0;
-        font-size: 12px!important;
+        font-size: 12pt!important;
         font-family: "Roboto", "Open Sans", sans-serif;
         font-weight: 400;
         position: relative;
@@ -126,7 +126,7 @@
     }
     label {
         color: #366495;
-        font-size: 14px;
+        font-size: 12pt;
         text-transform: uppercase;
         font-weight: 600;
         margin-top: 24px;
@@ -139,7 +139,7 @@
     li {
         font-weight: 400;
         line-height: 175%;
-        font-size: 100%;
+        font-size: 105%;
         min-height: 32px;
     }
     li small {
@@ -183,7 +183,7 @@
     }
 
     code[class*=language-], pre[class*=language-] {
-        font-size: 115%;
+        font-size: 100%;
     }
     pre:not([class*="language-"]) {
         width: 100%;
@@ -252,7 +252,7 @@
         margin-bottom: 16px;
     }
     div.content > p {
-        font-size: 150% !important;
+        font-size: 110% !important;
         line-height: 170% !important;
         margin: 24px 0 24px;
     }
@@ -387,11 +387,11 @@
 
 .drawer-header .text-logo {
     font-family: "Roboto", "Open Sans", sans-serif;
-    font-size: 180%;
+    font-size: 150%;
     font-weight: 400;
 }
 .drawer-header .text-logo small {
-    font-size: 12px;
+    font-size: 10pt;
     vertical-align: middle;
     margin-left: 8px;
 }
@@ -449,6 +449,7 @@
     color: var(--primary-color);
 }
 .drawer-content li a {
+    font-weight: bold;
     color: var(--accent-color);
     position: relative;
     display: block;
@@ -483,7 +484,7 @@
 }
 [z-context="menu-drawer"]:focus {
     outline: none;
-}</style><!-- zUIx.js inline resources bundle --><script src="index.bundle.js"></script></head><!-- scroll helper is used to show/hide the header when scrolling --><body ctrl="" z-load="@lib/controllers/header-auto-hide" :header="'header'" z-lazy="scroll" data-theme="" layout="column stretch-stretch"><nav #header="" layout="row center-start"><div self="stretch" layout="row center-start"><button onclick="menuDrawer.open()" class="header-menu-button mdl-button mdl-button--icon"><i class="material-icons notranslate">menu_open</i></button><h1 self="size-x1" class="title">Terms and concepts</h1></div></nav><main layout="column top-center"><h1 #alt_header="" class="title">Terms and concepts</h1><div self="size-x1" class="content"><p>This is a brief introduction to some terms and concepts commonly used in web development and related to <em>zuix.js</em> functionality. For a better understanding of these pages a basic knowledge of HTML, CSS and JavaScript is required.<h2>Component</h2><p>We can think of a component as a <strong>reusable part</strong> of the page that can be defined once and then added to any page, one or more times, by just referencing it.<p>In a component there are two kind of reusable parts:<ul><li>a visible part (<em>view</em>), which is a block of HTML and CSS code that is rendered in the page<li>a program-logic part (<em>controller</em>), which is a block of JavaScript code used to control and animate the associated <em>view</em></ul><p>A complete component is therefore formed by the combo <em>view</em> + <em>controller</em>, although as described later in these pages, we can also have <em>view-only</em> components that do not contain any JavaScript code, or <em>controller-only</em> components that are associated to a generic element of the page instead of a specific view template.<h3>Component implementation</h3><p>A component can be implemented with various methods:<ul><li>using a distinct file for each reusable part (<code>.html</code>, <code>.css</code>, <code>.js</code>)<li>using a single <code>.js</code> file which will also generate the output of the HTML and CSS code for the view<li>declaring all parts inline, on the HTML page itself</ul><p>The first method, among other advantages, maximizes the maintainability, reusability, and customizability of each part. This design pattern, that reckons on loading all bits of a component from external files, is not directly supported by the web platform, and in order to be implemented it requires a <em>resource loader</em> such as <em>zuix.js</em>.<h3>View rendering</h3><p>"Rendering" is the process of outputting the view of a component instance into the page. This process can be implemented using one of the following methods:<ul><li><strong>Client-side</strong><br>the view is dynamically added using JavaScript<li><strong>Server-side</strong><br>the view is pre-rendered on the server before the requested page is sent to the client<li><strong>Build-side</strong><br>the view is pre-rendered during the build process of the page, using a static-site generator or similar tool</ul><p>The first method is the standard approach in <em>zuix.js</em>, but it also allows to pre-render a component's view either server-side or during the build process, by simply outputting the component's <em>HTML</em> inside a container element with some special directive attributes (<code>ctrl z-load</code>), so that <em>zuix.js</em> will then instantiate the controller of the component and bind it to the pre-rendered view instance.<h2>Web Components</h2><p>The term <a href="https://developer.mozilla.org/en-US/docs/Web/API/Web_components">Web Components</a> identifies a set of <em>Web Platform</em> APIs that allow to create custom HTML elements.<br>The main advantage in using custom elements is encapsulation ‐ "being able to keep the markup structure, style, and behavior hidden and separate from other code on the page so that different parts do not clash, and the code can be kept nice and clean." (<a href="https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_shadow_DOM">MDN</a>)<br><em>zuix.js</em> also implements <em>emulated encapsulation</em> through which is possible to load the same component either using a custom element or by using any standard element as host.<div layout="rows center-spread" style="margin-top: 112px; gap:12px; margin-bottom: 32px; padding-left: 8px; padding-right: 8px; font-size: 140%"><a href="/pages/documentation/getting_started/" style="text-align: center"><label layout="row center-center"><i class="material-icons notranslate">arrow_left</i>&nbsp; <span style="padding-right: 24px">Previous</span></label><div class="mdl-color-text--pink">Getting started</div></a><a href="/pages/documentation/component/" style="text-align: center"><label layout="row center-center"><span style="padding-left: 24px">Next</span> <i class="material-icons notranslate">arrow_right</i>&nbsp;</label><div class="mdl-color-text--pink">Component</div></a></div></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
+}</style><!-- zUIx.js inline resources bundle --><script src="index.bundle.js"></script></head><!-- scroll helper is used to show/hide the header when scrolling --><body ctrl="" z-load="@lib/controllers/header-auto-hide" :header="'header'" z-lazy="scroll" data-theme="" layout="column stretch-stretch"><nav #header="" layout="row center-start"><div self="stretch" layout="row center-start"><button onclick="menuDrawer.open()" class="header-menu-button mdl-button mdl-button--icon"><i class="material-icons notranslate">menu_open</i></button><h1 self="size-x1" class="title">Terms and concepts</h1></div></nav><main layout="column top-center"><h1 #alt_header="" class="title">Terms and concepts</h1><div self="size-x1" class="content"><p>This is a brief introduction to some terms and concepts commonly used in web development and related to <em>zuix.js</em> functionality. For a better understanding of these pages a basic knowledge of HTML, CSS and JavaScript is required.<h2>Component</h2><p>We can think of a component as a <strong>reusable part</strong> of the page that can be defined once and then added to any page, one or more times, by just referencing it.<p>In a component there are two kind of reusable parts:<ul><li>a visible part (<em>view</em>), which is a block of HTML and CSS code that is rendered in the page<li>a program-logic part (<em>controller</em>), which is a block of JavaScript code used to control and animate the associated <em>view</em></ul><p>A complete component is therefore formed by the combo <em>view</em> + <em>controller</em>, although as described later in these pages, we can also have <em>view-only</em> components that do not contain any JavaScript code, or <em>controller-only</em> components that are associated to a generic element of the page instead of a specific view template.<h3>Component implementation</h3><p>A component can be implemented with various methods:<ul><li>using a distinct file for each reusable part (<code>.html</code>, <code>.css</code>, <code>.js</code>)<li>using a single <code>.js</code> file which will also generate the output of the HTML and CSS code for the view<li>declaring all parts inline, on the HTML page itself</ul><p>The first method, among other advantages, maximizes the maintainability, reusability, and customizability of each part. This design pattern, that reckons on loading all bits of a component from external files, is not directly supported by the web platform, and in order to be implemented it requires a <em>resource loader</em> such as <em>zuix.js</em>.<h3>View rendering</h3><p>"Rendering" is the process of outputting the view of a component instance into the page. This process can be implemented using one of the following methods:<ul><li><strong>Client-side</strong><br>the view is dynamically added using JavaScript<li><strong>Server-side</strong><br>the view is pre-rendered on the server before the requested page is sent to the client<li><strong>Build-side</strong><br>the view is pre-rendered during the build process of the page, using a static-site generator or similar tool</ul><p>The first method is the standard approach in <em>zuix.js</em>, but it also allows to pre-render a component's view either server-side or during the build process, by simply outputting the component's <em>HTML</em> inside a container element with some special directive attributes (<code>ctrl z-load</code>), so that <em>zuix.js</em> will then instantiate the controller of the component and bind it to the pre-rendered view instance.<h2>Web Components</h2><p>The term <a href="https://developer.mozilla.org/en-US/docs/Web/API/Web_components">Web Components</a> identifies a set of <em>Web Platform</em> APIs that allow to create custom HTML elements.<br>The main advantage in using custom elements is encapsulation ‐ "being able to keep the markup structure, style, and behavior hidden and separate from other code on the page so that different parts do not clash, and the code can be kept nice and clean." (<a href="https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_shadow_DOM">MDN</a>)<br><em>zuix.js</em> also implements <em>emulated encapsulation</em> through which is possible to load the same component either using a custom element or by using any standard element as host.<div layout="rows center-spread" style="margin-top: 112px; gap:12px; margin-bottom: 32px; padding-left: 8px; padding-right: 8px; font-size: 120%"><a href="/pages/documentation/getting_started/" style="text-align: center"><label layout="row center-center"><i class="material-icons notranslate">arrow_left</i>&nbsp; <span style="padding-right: 24px">Previous</span></label><div class="mdl-color-text--pink">Getting started</div></a><a href="/pages/documentation/component/" style="text-align: center"><label layout="row center-center"><span style="padding-left: 24px">Next</span> <i class="material-icons notranslate">arrow_right</i>&nbsp;</label><div class="mdl-color-text--pink">Component</div></a></div></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="font-size:80%; padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
 <ul>
     <li >
     <a href="/home" class="mdl-js-ripple-effect">
diff --git a/docs/pages/documentation/cli/index.html b/docs/pages/documentation/cli/index.html
index 3898718..0fd967a 100644
--- a/docs/pages/documentation/cli/index.html
+++ b/docs/pages/documentation/cli/index.html
@@ -80,7 +80,7 @@
     body {
         margin: 0;
         padding: 0;
-        font-size: 12px!important;
+        font-size: 12pt!important;
         font-family: "Roboto", "Open Sans", sans-serif;
         font-weight: 400;
         position: relative;
@@ -126,7 +126,7 @@
     }
     label {
         color: #366495;
-        font-size: 14px;
+        font-size: 12pt;
         text-transform: uppercase;
         font-weight: 600;
         margin-top: 24px;
@@ -139,7 +139,7 @@
     li {
         font-weight: 400;
         line-height: 175%;
-        font-size: 100%;
+        font-size: 105%;
         min-height: 32px;
     }
     li small {
@@ -183,7 +183,7 @@
     }
 
     code[class*=language-], pre[class*=language-] {
-        font-size: 115%;
+        font-size: 100%;
     }
     pre:not([class*="language-"]) {
         width: 100%;
@@ -252,7 +252,7 @@
         margin-bottom: 16px;
     }
     div.content > p {
-        font-size: 150% !important;
+        font-size: 110% !important;
         line-height: 170% !important;
         margin: 24px 0 24px;
     }
@@ -387,11 +387,11 @@
 
 .drawer-header .text-logo {
     font-family: "Roboto", "Open Sans", sans-serif;
-    font-size: 180%;
+    font-size: 150%;
     font-weight: 400;
 }
 .drawer-header .text-logo small {
-    font-size: 12px;
+    font-size: 10pt;
     vertical-align: middle;
     margin-left: 8px;
 }
@@ -449,6 +449,7 @@
     color: var(--primary-color);
 }
 .drawer-content li a {
+    font-weight: bold;
     color: var(--accent-color);
     position: relative;
     display: block;
@@ -489,7 +490,7 @@
 border-radius: 8px;
 margin-right: 4px;
 }</style><h2>Prerequisites</h2><ul><li><a href="https://nodejs.org/en/download/">Install Node.js</a> version 14 or higher<li>Install <code>zuix</code>, command-line tool:</ul><pre class="language-shell"><code class="language-shell">npx zuix</code></pre><h2>Creating a new project</h2><pre class="language-bash"><code class="language-bash"><span class="token comment"># Create a new website project named 'my-new-webapp'</span>
-npx zuix new my-new-webapp</code></pre><p>A new folder named <em>my-new-webapp</em> will be created containing all files required to run the web-starter project.<p>Different starter project templates are available and can be specified using the <code>-t</code> option. See <em>zuix.js</em> <a href="https://zuixjs.github.io/zuix-web-starter/content/docs/getting-started/">Web Starter documentation</a> for a list of available templates and a complete overview of commands and features.<p>You can also try the web-starter template live on <a href="https://stackblitz.com/github/zuixjs/zuix-web-starter?terminal=start">StackBlitz</a>.<h3>Adding a new component</h3><pre class="language-shell"><code class="language-shell">npx zuix generate component <span class="token string">"&lt;component_name&gt;"</span></code></pre><p><label class="mdl-color-text--primary">Examples</label><pre class="language-shell"><code class="language-shell">npx zuix g component cards/my-new-card</code></pre><p>will generate three files for the component <code>MyNewCard</code>:<ul><li><code>./source/app/components/cards/my-new-card.html</code><li><code>./source/app/components/cards/my-new-card.css</code><li><code>./source/app/components/cards/my-new-card.js</code></ul><p>To generate only the view template <code>ArticleHeader</code>:<pre class="language-shell"><code class="language-shell">npx zuix g template article-header</code></pre><p>will generate:<ul><li><code>./source/app/templates/article-header.html</code><li><code>./source/app/templates/article-header.css</code></ul><p>To generate the controller <code>MyServiceApi</code>:<pre class="language-shell"><code class="language-shell">npx zuix g controller my-service-api</code></pre><ul><li><code>./source/app/controllers/my-service-api.js</code></ul><div layout="rows center-spread" style="margin-top: 112px; gap:12px; margin-bottom: 32px; padding-left: 8px; padding-right: 8px; font-size: 140%"><a href="/pages/documentation/controller/" style="text-align: center"><label layout="row center-center"><i class="material-icons notranslate">arrow_left</i>&nbsp; <span style="padding-right: 24px">Previous</span></label><div class="mdl-color-text--pink">Controller</div></a><a href="/playground/" style="text-align: center"><label layout="row center-center"><span style="padding-left: 24px">Next</span> <i class="material-icons notranslate">arrow_right</i>&nbsp;</label><div class="mdl-color-text--pink">Playground</div></a></div></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
+npx zuix new my-new-webapp</code></pre><p>A new folder named <em>my-new-webapp</em> will be created containing all files required to run the web-starter project.<p>Different starter project templates are available and can be specified using the <code>-t</code> option. See <em>zuix.js</em> <a href="https://zuixjs.github.io/zuix-web-starter/content/docs/getting-started/">Web Starter documentation</a> for a list of available templates and a complete overview of commands and features.<p>You can also try the web-starter template live on <a href="https://stackblitz.com/github/zuixjs/zuix-web-starter?terminal=start">StackBlitz</a>.<h3>Adding a new component</h3><pre class="language-shell"><code class="language-shell">npx zuix generate component <span class="token string">"&lt;component_name&gt;"</span></code></pre><p><label class="mdl-color-text--primary">Examples</label><pre class="language-shell"><code class="language-shell">npx zuix g component cards/my-new-card</code></pre><p>will generate three files for the component <code>MyNewCard</code>:<ul><li><code>./source/app/components/cards/my-new-card.html</code><li><code>./source/app/components/cards/my-new-card.css</code><li><code>./source/app/components/cards/my-new-card.js</code></ul><p>To generate only the view template <code>ArticleHeader</code>:<pre class="language-shell"><code class="language-shell">npx zuix g template article-header</code></pre><p>will generate:<ul><li><code>./source/app/templates/article-header.html</code><li><code>./source/app/templates/article-header.css</code></ul><p>To generate the controller <code>MyServiceApi</code>:<pre class="language-shell"><code class="language-shell">npx zuix g controller my-service-api</code></pre><ul><li><code>./source/app/controllers/my-service-api.js</code></ul><div layout="rows center-spread" style="margin-top: 112px; gap:12px; margin-bottom: 32px; padding-left: 8px; padding-right: 8px; font-size: 120%"><a href="/pages/documentation/controller/" style="text-align: center"><label layout="row center-center"><i class="material-icons notranslate">arrow_left</i>&nbsp; <span style="padding-right: 24px">Previous</span></label><div class="mdl-color-text--pink">Controller</div></a><a href="/playground/" style="text-align: center"><label layout="row center-center"><span style="padding-left: 24px">Next</span> <i class="material-icons notranslate">arrow_right</i>&nbsp;</label><div class="mdl-color-text--pink">Playground</div></a></div></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="font-size:80%; padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
 <ul>
     <li >
     <a href="/home" class="mdl-js-ripple-effect">
diff --git a/docs/pages/documentation/component/index.html b/docs/pages/documentation/component/index.html
index b445fb1..9b68152 100644
--- a/docs/pages/documentation/component/index.html
+++ b/docs/pages/documentation/component/index.html
@@ -80,7 +80,7 @@
     body {
         margin: 0;
         padding: 0;
-        font-size: 12px!important;
+        font-size: 12pt!important;
         font-family: "Roboto", "Open Sans", sans-serif;
         font-weight: 400;
         position: relative;
@@ -126,7 +126,7 @@
     }
     label {
         color: #366495;
-        font-size: 14px;
+        font-size: 12pt;
         text-transform: uppercase;
         font-weight: 600;
         margin-top: 24px;
@@ -139,7 +139,7 @@
     li {
         font-weight: 400;
         line-height: 175%;
-        font-size: 100%;
+        font-size: 105%;
         min-height: 32px;
     }
     li small {
@@ -183,7 +183,7 @@
     }
 
     code[class*=language-], pre[class*=language-] {
-        font-size: 115%;
+        font-size: 100%;
     }
     pre:not([class*="language-"]) {
         width: 100%;
@@ -252,7 +252,7 @@
         margin-bottom: 16px;
     }
     div.content > p {
-        font-size: 150% !important;
+        font-size: 110% !important;
         line-height: 170% !important;
         margin: 24px 0 24px;
     }
@@ -387,11 +387,11 @@
 
 .drawer-header .text-logo {
     font-family: "Roboto", "Open Sans", sans-serif;
-    font-size: 180%;
+    font-size: 150%;
     font-weight: 400;
 }
 .drawer-header .text-logo small {
-    font-size: 12px;
+    font-size: 10pt;
     vertical-align: middle;
     margin-left: 8px;
 }
@@ -449,6 +449,7 @@
     color: var(--primary-color);
 }
 .drawer-content li a {
+    font-weight: bold;
     color: var(--accent-color);
     position: relative;
     display: block;
@@ -586,7 +587,7 @@
 <span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">&gt;</span></span></code></pre><p><label class="mdl-color-text--primary">Result</label><div style="min-height: 64px"><div z-model="{number: 42}"><mdl-button :type="'fab'" (pointerdown)="model.number--">remove</mdl-button><strong #number=""></strong><mdl-button :type="'fab'" (pointerdown)="model.number++">add</mdl-button><!-- SCOPED CSS: `media="#"` attribute
 will apply styles only to the enclosing
 component context --><style media="#">:host {text-align: center}
-strong {margin: 12px}</style></div></div><div style="margin-top: 24px"><a ctrl="" z-load="@lib/controllers/mdl-button" class="visible-on-ready" z-lazy="true" href="../../../playground/#/app/examples/default-component" :type="'flat'" :class="'accent'" style="text-transform: none"><i class="material-icons rotate notranslate">sports_soccer</i> <span>Try this in the Playground</span></a></div><div layout="rows center-spread" style="margin-top: 112px; gap:12px; margin-bottom: 32px; padding-left: 8px; padding-right: 8px; font-size: 140%"><a href="/pages/documentation/basic_concepts/" style="text-align: center"><label layout="row center-center"><i class="material-icons notranslate">arrow_left</i>&nbsp; <span style="padding-right: 24px">Previous</span></label><div class="mdl-color-text--pink">Terms and concepts</div></a><a href="/pages/documentation/context_options/" style="text-align: center"><label layout="row center-center"><span style="padding-left: 24px">Next</span> <i class="material-icons notranslate">arrow_right</i>&nbsp;</label><div class="mdl-color-text--pink">Context Options</div></a></div></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
+strong {margin: 12px}</style></div></div><div style="margin-top: 24px"><a ctrl="" z-load="@lib/controllers/mdl-button" class="visible-on-ready" z-lazy="true" href="../../../playground/#/app/examples/default-component" :type="'flat'" :class="'accent'" style="text-transform: none"><i class="material-icons rotate notranslate">sports_soccer</i> <span>Try this in the Playground</span></a></div><div layout="rows center-spread" style="margin-top: 112px; gap:12px; margin-bottom: 32px; padding-left: 8px; padding-right: 8px; font-size: 120%"><a href="/pages/documentation/basic_concepts/" style="text-align: center"><label layout="row center-center"><i class="material-icons notranslate">arrow_left</i>&nbsp; <span style="padding-right: 24px">Previous</span></label><div class="mdl-color-text--pink">Terms and concepts</div></a><a href="/pages/documentation/context_options/" style="text-align: center"><label layout="row center-center"><span style="padding-left: 24px">Next</span> <i class="material-icons notranslate">arrow_right</i>&nbsp;</label><div class="mdl-color-text--pink">Context Options</div></a></div></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="font-size:80%; padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
 <ul>
     <li >
     <a href="/home" class="mdl-js-ripple-effect">
diff --git a/docs/pages/documentation/context_options/index.html b/docs/pages/documentation/context_options/index.html
index 76f0372..038a06c 100644
--- a/docs/pages/documentation/context_options/index.html
+++ b/docs/pages/documentation/context_options/index.html
@@ -80,7 +80,7 @@
     body {
         margin: 0;
         padding: 0;
-        font-size: 12px!important;
+        font-size: 12pt!important;
         font-family: "Roboto", "Open Sans", sans-serif;
         font-weight: 400;
         position: relative;
@@ -126,7 +126,7 @@
     }
     label {
         color: #366495;
-        font-size: 14px;
+        font-size: 12pt;
         text-transform: uppercase;
         font-weight: 600;
         margin-top: 24px;
@@ -139,7 +139,7 @@
     li {
         font-weight: 400;
         line-height: 175%;
-        font-size: 100%;
+        font-size: 105%;
         min-height: 32px;
     }
     li small {
@@ -183,7 +183,7 @@
     }
 
     code[class*=language-], pre[class*=language-] {
-        font-size: 115%;
+        font-size: 100%;
     }
     pre:not([class*="language-"]) {
         width: 100%;
@@ -252,7 +252,7 @@
         margin-bottom: 16px;
     }
     div.content > p {
-        font-size: 150% !important;
+        font-size: 110% !important;
         line-height: 170% !important;
         margin: 24px 0 24px;
     }
@@ -387,11 +387,11 @@
 
 .drawer-header .text-logo {
     font-family: "Roboto", "Open Sans", sans-serif;
-    font-size: 180%;
+    font-size: 150%;
     font-weight: 400;
 }
 .drawer-header .text-logo small {
-    font-size: 12px;
+    font-size: 10pt;
     vertical-align: middle;
     margin-left: 8px;
 }
@@ -449,6 +449,7 @@
     color: var(--primary-color);
 }
 .drawer-content li a {
+    font-weight: bold;
     color: var(--accent-color);
     position: relative;
     display: block;
@@ -655,7 +656,7 @@
       <span class="token string-property property">"@cdnjs"</span><span class="token operator">:</span> <span class="token string">"https://cdnjs.cloudflare.com/ajax/libs/"</span>
     <span class="token punctuation">}</span>
   <span class="token punctuation">}</span>
-<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span></code></pre><p>where <code>resourcePath</code> is the default base path when loading components from a relative location, and <code>libraryPath</code> is a list of shortcuts that can be used as prefix in component's <a href="../component/#"><em>&lt;path&gt;</em></a> to load components from different locations.<p>This is how the <code>@lib</code> prefix was used in the <a href="../component/#type_ctrl">controller example</a>, as a shortcut to <a href="https://zuixjs.github.io/zkit/">zKit</a> component's library.<p>This way it's also possible to change a components' set by just changing those paths to another location where components preserve the same files and folders structure.<p>So, theming become not just a matter of changing styles and graphics, but also a whole set of components and functionality could be customized for a different theme by just pointing to a different library path in <em>zuix.js</em> configuration store.<div layout="rows center-spread" style="margin-top: 112px; gap:12px; margin-bottom: 32px; padding-left: 8px; padding-right: 8px; font-size: 140%"><a href="/pages/documentation/component/" style="text-align: center"><label layout="row center-center"><i class="material-icons notranslate">arrow_left</i>&nbsp; <span style="padding-right: 24px">Previous</span></label><div class="mdl-color-text--pink">Component</div></a><a href="/pages/documentation/view/" style="text-align: center"><label layout="row center-center"><span style="padding-left: 24px">Next</span> <i class="material-icons notranslate">arrow_right</i>&nbsp;</label><div class="mdl-color-text--pink">View</div></a></div></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
+<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span></code></pre><p>where <code>resourcePath</code> is the default base path when loading components from a relative location, and <code>libraryPath</code> is a list of shortcuts that can be used as prefix in component's <a href="../component/#"><em>&lt;path&gt;</em></a> to load components from different locations.<p>This is how the <code>@lib</code> prefix was used in the <a href="../component/#type_ctrl">controller example</a>, as a shortcut to <a href="https://zuixjs.github.io/zkit/">zKit</a> component's library.<p>This way it's also possible to change a components' set by just changing those paths to another location where components preserve the same files and folders structure.<p>So, theming become not just a matter of changing styles and graphics, but also a whole set of components and functionality could be customized for a different theme by just pointing to a different library path in <em>zuix.js</em> configuration store.<div layout="rows center-spread" style="margin-top: 112px; gap:12px; margin-bottom: 32px; padding-left: 8px; padding-right: 8px; font-size: 120%"><a href="/pages/documentation/component/" style="text-align: center"><label layout="row center-center"><i class="material-icons notranslate">arrow_left</i>&nbsp; <span style="padding-right: 24px">Previous</span></label><div class="mdl-color-text--pink">Component</div></a><a href="/pages/documentation/view/" style="text-align: center"><label layout="row center-center"><span style="padding-left: 24px">Next</span> <i class="material-icons notranslate">arrow_right</i>&nbsp;</label><div class="mdl-color-text--pink">View</div></a></div></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="font-size:80%; padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
 <ul>
     <li >
     <a href="/home" class="mdl-js-ripple-effect">
diff --git a/docs/pages/documentation/controller/index.html b/docs/pages/documentation/controller/index.html
index 4abf280..7bd432f 100644
--- a/docs/pages/documentation/controller/index.html
+++ b/docs/pages/documentation/controller/index.html
@@ -80,7 +80,7 @@
     body {
         margin: 0;
         padding: 0;
-        font-size: 12px!important;
+        font-size: 12pt!important;
         font-family: "Roboto", "Open Sans", sans-serif;
         font-weight: 400;
         position: relative;
@@ -126,7 +126,7 @@
     }
     label {
         color: #366495;
-        font-size: 14px;
+        font-size: 12pt;
         text-transform: uppercase;
         font-weight: 600;
         margin-top: 24px;
@@ -139,7 +139,7 @@
     li {
         font-weight: 400;
         line-height: 175%;
-        font-size: 100%;
+        font-size: 105%;
         min-height: 32px;
     }
     li small {
@@ -183,7 +183,7 @@
     }
 
     code[class*=language-], pre[class*=language-] {
-        font-size: 115%;
+        font-size: 100%;
     }
     pre:not([class*="language-"]) {
         width: 100%;
@@ -252,7 +252,7 @@
         margin-bottom: 16px;
     }
     div.content > p {
-        font-size: 150% !important;
+        font-size: 110% !important;
         line-height: 170% !important;
         margin: 24px 0 24px;
     }
@@ -387,11 +387,11 @@
 
 .drawer-header .text-logo {
     font-family: "Roboto", "Open Sans", sans-serif;
-    font-size: 180%;
+    font-size: 150%;
     font-weight: 400;
 }
 .drawer-header .text-logo small {
-    font-size: 12px;
+    font-size: 10pt;
     vertical-align: middle;
     margin-left: 8px;
 }
@@ -449,6 +449,7 @@
     color: var(--primary-color);
 }
 .drawer-content li a {
+    font-weight: bold;
     color: var(--accent-color);
     position: relative;
     display: block;
@@ -678,7 +679,7 @@
   myService<span class="token punctuation">.</span><span class="token function">publicMethod1</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
   myService<span class="token punctuation">.</span><span class="token function">publicMethod2</span><span class="token punctuation">(</span><span class="token string">'test'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
   <span class="token comment">// ...</span>
-<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span></code></pre><div layout="rows center-spread" style="margin-top: 112px; gap:12px; margin-bottom: 32px; padding-left: 8px; padding-right: 8px; font-size: 140%"><a href="/pages/documentation/active_refresh/" style="text-align: center"><label layout="row center-center"><i class="material-icons notranslate">arrow_left</i>&nbsp; <span style="padding-right: 24px">Previous</span></label><div class="mdl-color-text--pink">Events and Active→Refresh</div></a><a href="/pages/documentation/cli/" style="text-align: center"><label layout="row center-center"><span style="padding-left: 24px">Next</span> <i class="material-icons notranslate">arrow_right</i>&nbsp;</label><div class="mdl-color-text--pink">CLI / Templates</div></a></div></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
+<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span></code></pre><div layout="rows center-spread" style="margin-top: 112px; gap:12px; margin-bottom: 32px; padding-left: 8px; padding-right: 8px; font-size: 120%"><a href="/pages/documentation/active_refresh/" style="text-align: center"><label layout="row center-center"><i class="material-icons notranslate">arrow_left</i>&nbsp; <span style="padding-right: 24px">Previous</span></label><div class="mdl-color-text--pink">Events and Active→Refresh</div></a><a href="/pages/documentation/cli/" style="text-align: center"><label layout="row center-center"><span style="padding-left: 24px">Next</span> <i class="material-icons notranslate">arrow_right</i>&nbsp;</label><div class="mdl-color-text--pink">CLI / Templates</div></a></div></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="font-size:80%; padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
 <ul>
     <li >
     <a href="/home" class="mdl-js-ripple-effect">
diff --git a/docs/pages/documentation/getting_started/index.html b/docs/pages/documentation/getting_started/index.html
index 8648e9d..dc46120 100644
--- a/docs/pages/documentation/getting_started/index.html
+++ b/docs/pages/documentation/getting_started/index.html
@@ -80,7 +80,7 @@
     body {
         margin: 0;
         padding: 0;
-        font-size: 12px!important;
+        font-size: 12pt!important;
         font-family: "Roboto", "Open Sans", sans-serif;
         font-weight: 400;
         position: relative;
@@ -126,7 +126,7 @@
     }
     label {
         color: #366495;
-        font-size: 14px;
+        font-size: 12pt;
         text-transform: uppercase;
         font-weight: 600;
         margin-top: 24px;
@@ -139,7 +139,7 @@
     li {
         font-weight: 400;
         line-height: 175%;
-        font-size: 100%;
+        font-size: 105%;
         min-height: 32px;
     }
     li small {
@@ -183,7 +183,7 @@
     }
 
     code[class*=language-], pre[class*=language-] {
-        font-size: 115%;
+        font-size: 100%;
     }
     pre:not([class*="language-"]) {
         width: 100%;
@@ -252,7 +252,7 @@
         margin-bottom: 16px;
     }
     div.content > p {
-        font-size: 150% !important;
+        font-size: 110% !important;
         line-height: 170% !important;
         margin: 24px 0 24px;
     }
@@ -387,11 +387,11 @@
 
 .drawer-header .text-logo {
     font-family: "Roboto", "Open Sans", sans-serif;
-    font-size: 180%;
+    font-size: 150%;
     font-weight: 400;
 }
 .drawer-header .text-logo small {
-    font-size: 12px;
+    font-size: 10pt;
     vertical-align: middle;
     margin-left: 8px;
 }
@@ -449,6 +449,7 @@
     color: var(--primary-color);
 }
 .drawer-content li a {
+    font-weight: bold;
     color: var(--accent-color);
     position: relative;
     display: block;
@@ -486,7 +487,7 @@
 }</style><!-- zUIx.js inline resources bundle --><script src="index.bundle.js"></script></head><!-- scroll helper is used to show/hide the header when scrolling --><body ctrl="" z-load="@lib/controllers/header-auto-hide" :header="'header'" z-lazy="scroll" data-theme="" layout="column stretch-stretch"><nav #header="" layout="row center-start"><div self="stretch" layout="row center-start"><button onclick="menuDrawer.open()" class="header-menu-button mdl-button mdl-button--icon"><i class="material-icons notranslate">menu_open</i></button><h1 self="size-x1" class="title">Getting started</h1></div></nav><main layout="column top-center"><h1 #alt_header="" class="title">Getting started</h1><div self="size-x1" class="content"><p>See <strong>zuix.js</strong> in action using the online playground, where is possible to create and download ready to use components directly in the browser!</p><a layout="row center-start" class="mdl-color-text--accent" href="/playground/#/app/widgets/analog-clock"><i class="material-icons notranslate rotate">sports_soccer</i> <span style="font-size: 160%; margin-left: 6px">Playground</span></a><h2>Bare library usage on an existing site</h2><h3>JsDeliver</h3><p>As a regular script:<pre class="language-html"><code class="language-html"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span> <span class="token attr-name">src</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>https://cdn.jsdelivr.net/npm/zuix-dist@1.1.29<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span><span class="token script"></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span></code></pre><p>As a module:<pre class="language-html"><code class="language-html"><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>module<span class="token punctuation">"</span></span> <span class="token attr-name">src</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>https://cdn.jsdelivr.net/npm/zuix-dist@1.1.29/js/zuix.module.min.js<span class="token punctuation">"</span></span><span class="token punctuation">&gt;</span></span><span class="token script"></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span></code></pre><p>As a dependency of another module:<pre class="language-js"><code class="language-js"><span class="token comment">// file: my-class.module.js</span>
 <span class="token keyword">import</span> <span class="token string">'https://cdn.jsdelivr.net/npm/zuix-dist@1.1.29/js/zuix.module.min.js'</span><span class="token punctuation">;</span> </code></pre><h3>NPM</h3><pre class="language-bash"><code class="language-bash"><span class="token function">npm</span> <span class="token function">install</span> zuix-dist</code></pre><p>then copy the library from <code>node_modules/zuix-dist/js</code> to your project's <code>js</code> folder and include it in your HTML page or JavaScript module.<h2>Creating a new web project using the CLI</h2><p>The <code>zuix-cli</code> tool can be used to create a new web project, the only prerequisite is that <a href="https://nodejs.org/en/download/package-manager">node.js</a> must be installed first.<pre class="language-bash"><code class="language-bash"><span class="token comment"># Create a new website project named 'my-new-webapp'</span>
 npx zuix new my-new-webapp</code></pre><p>A new folder named <em>my-new-webapp</em> will be created containing all files required to run the starter project.<p>From the new folder we can now start the local server that will watch, build and serve the web application files (by default at <em>http://localhost:8080</em>).<pre class="language-bash"><code class="language-bash"><span class="token builtin class-name">cd</span> my-new-webapp
-npx zuix start</code></pre><p>Read more about all other <code>zuix</code> command functionality from <a href="../cli/"><code>zuix-cli</code></a> documentation page.<div layout="rows center-spread" style="margin-top: 112px; gap:12px; margin-bottom: 32px; padding-left: 8px; padding-right: 8px; font-size: 140%"><a href="/pages/documentation/about/" style="text-align: center"><label layout="row center-center"><i class="material-icons notranslate">arrow_left</i>&nbsp; <span style="padding-right: 24px">Previous</span></label><div class="mdl-color-text--pink">About zuix.js</div></a><a href="/pages/documentation/basic_concepts/" style="text-align: center"><label layout="row center-center"><span style="padding-left: 24px">Next</span> <i class="material-icons notranslate">arrow_right</i>&nbsp;</label><div class="mdl-color-text--pink">Terms and concepts</div></a></div></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
+npx zuix start</code></pre><p>Read more about all other <code>zuix</code> command functionality from <a href="../cli/"><code>zuix-cli</code></a> documentation page.<div layout="rows center-spread" style="margin-top: 112px; gap:12px; margin-bottom: 32px; padding-left: 8px; padding-right: 8px; font-size: 120%"><a href="/pages/documentation/about/" style="text-align: center"><label layout="row center-center"><i class="material-icons notranslate">arrow_left</i>&nbsp; <span style="padding-right: 24px">Previous</span></label><div class="mdl-color-text--pink">About zuix.js</div></a><a href="/pages/documentation/basic_concepts/" style="text-align: center"><label layout="row center-center"><span style="padding-left: 24px">Next</span> <i class="material-icons notranslate">arrow_right</i>&nbsp;</label><div class="mdl-color-text--pink">Terms and concepts</div></a></div></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="font-size:80%; padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
 <ul>
     <li >
     <a href="/home" class="mdl-js-ripple-effect">
diff --git a/docs/pages/documentation/index.html b/docs/pages/documentation/index.html
index 18c576e..e8805cd 100644
--- a/docs/pages/documentation/index.html
+++ b/docs/pages/documentation/index.html
@@ -78,7 +78,7 @@
     body {
         margin: 0;
         padding: 0;
-        font-size: 12px!important;
+        font-size: 12pt!important;
         font-family: "Roboto", "Open Sans", sans-serif;
         font-weight: 400;
         position: relative;
@@ -124,7 +124,7 @@
     }
     label {
         color: #366495;
-        font-size: 14px;
+        font-size: 12pt;
         text-transform: uppercase;
         font-weight: 600;
         margin-top: 24px;
@@ -137,7 +137,7 @@
     li {
         font-weight: 400;
         line-height: 175%;
-        font-size: 100%;
+        font-size: 105%;
         min-height: 32px;
     }
     li small {
@@ -181,7 +181,7 @@
     }
 
     code[class*=language-], pre[class*=language-] {
-        font-size: 115%;
+        font-size: 100%;
     }
     pre:not([class*="language-"]) {
         width: 100%;
@@ -250,7 +250,7 @@
         margin-bottom: 16px;
     }
     div.content > p {
-        font-size: 150% !important;
+        font-size: 110% !important;
         line-height: 170% !important;
         margin: 24px 0 24px;
     }
@@ -385,11 +385,11 @@
 
 .drawer-header .text-logo {
     font-family: "Roboto", "Open Sans", sans-serif;
-    font-size: 180%;
+    font-size: 150%;
     font-weight: 400;
 }
 .drawer-header .text-logo small {
-    font-size: 12px;
+    font-size: 10pt;
     vertical-align: middle;
     margin-left: 8px;
 }
@@ -447,6 +447,7 @@
     color: var(--primary-color);
 }
 .drawer-content li a {
+    font-weight: bold;
     color: var(--accent-color);
     position: relative;
     display: block;
@@ -481,7 +482,7 @@
 }
 [z-context="menu-drawer"]:focus {
     outline: none;
-}</style><!-- zUIx.js inline resources bundle --><script src="index.bundle.js"></script></head><!-- scroll helper is used to show/hide the header when scrolling --><body ctrl="" z-load="@lib/controllers/header-auto-hide" :header="'header'" z-lazy="scroll" data-theme="indigo-pink" layout="column stretch-stretch"><nav #header="" layout="row center-start"><div self="stretch" layout="row center-start"><button onclick="menuDrawer.open()" class="header-menu-button mdl-button mdl-button--icon"><i class="material-icons notranslate">menu_open</i></button><h1 self="size-x1" class="title">Documentation</h1></div></nav><main layout="column top-center"><h1 #alt_header="" class="title">Documentation</h1><div self="size-x1" class="content"><div layout="rows center-spread" style="margin-top: 112px; gap:12px; margin-bottom: 32px; padding-left: 8px; padding-right: 8px; font-size: 140%"><div>&nbsp;</div><div>&nbsp;</div></div></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
+}</style><!-- zUIx.js inline resources bundle --><script src="index.bundle.js"></script></head><!-- scroll helper is used to show/hide the header when scrolling --><body ctrl="" z-load="@lib/controllers/header-auto-hide" :header="'header'" z-lazy="scroll" data-theme="indigo-pink" layout="column stretch-stretch"><nav #header="" layout="row center-start"><div self="stretch" layout="row center-start"><button onclick="menuDrawer.open()" class="header-menu-button mdl-button mdl-button--icon"><i class="material-icons notranslate">menu_open</i></button><h1 self="size-x1" class="title">Documentation</h1></div></nav><main layout="column top-center"><h1 #alt_header="" class="title">Documentation</h1><div self="size-x1" class="content"><div layout="rows center-spread" style="margin-top: 112px; gap:12px; margin-bottom: 32px; padding-left: 8px; padding-right: 8px; font-size: 120%"><div>&nbsp;</div><div>&nbsp;</div></div></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="font-size:80%; padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
 <ul>
     <li >
     <a href="/home" class="mdl-js-ripple-effect">
diff --git a/docs/pages/documentation/view/index.html b/docs/pages/documentation/view/index.html
index ab6ea7d..7acf7ae 100644
--- a/docs/pages/documentation/view/index.html
+++ b/docs/pages/documentation/view/index.html
@@ -80,7 +80,7 @@
     body {
         margin: 0;
         padding: 0;
-        font-size: 12px!important;
+        font-size: 12pt!important;
         font-family: "Roboto", "Open Sans", sans-serif;
         font-weight: 400;
         position: relative;
@@ -126,7 +126,7 @@
     }
     label {
         color: #366495;
-        font-size: 14px;
+        font-size: 12pt;
         text-transform: uppercase;
         font-weight: 600;
         margin-top: 24px;
@@ -139,7 +139,7 @@
     li {
         font-weight: 400;
         line-height: 175%;
-        font-size: 100%;
+        font-size: 105%;
         min-height: 32px;
     }
     li small {
@@ -183,7 +183,7 @@
     }
 
     code[class*=language-], pre[class*=language-] {
-        font-size: 115%;
+        font-size: 100%;
     }
     pre:not([class*="language-"]) {
         width: 100%;
@@ -252,7 +252,7 @@
         margin-bottom: 16px;
     }
     div.content > p {
-        font-size: 150% !important;
+        font-size: 110% !important;
         line-height: 170% !important;
         margin: 24px 0 24px;
     }
@@ -387,11 +387,11 @@
 
 .drawer-header .text-logo {
     font-family: "Roboto", "Open Sans", sans-serif;
-    font-size: 180%;
+    font-size: 150%;
     font-weight: 400;
 }
 .drawer-header .text-logo small {
-    font-size: 12px;
+    font-size: 10pt;
     vertical-align: middle;
     margin-left: 8px;
 }
@@ -449,6 +449,7 @@
     color: var(--primary-color);
 }
 .drawer-content li a {
+    font-weight: bold;
     color: var(--accent-color);
     position: relative;
     display: block;
@@ -869,7 +870,7 @@
     on: {
       'click': () => { /* noop */ }
     }
-  }</script></div><div layout="rows center-spread" style="margin-top: 112px; gap:12px; margin-bottom: 32px; padding-left: 8px; padding-right: 8px; font-size: 140%"><a href="/pages/documentation/context_options/" style="text-align: center"><label layout="row center-center"><i class="material-icons notranslate">arrow_left</i>&nbsp; <span style="padding-right: 24px">Previous</span></label><div class="mdl-color-text--pink">Context Options</div></a><a href="/pages/documentation/active_refresh/" style="text-align: center"><label layout="row center-center"><span style="padding-left: 24px">Next</span> <i class="material-icons notranslate">arrow_right</i>&nbsp;</label><div class="mdl-color-text--pink">Events and Active→Refresh</div></a></div></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
+  }</script></div><div layout="rows center-spread" style="margin-top: 112px; gap:12px; margin-bottom: 32px; padding-left: 8px; padding-right: 8px; font-size: 120%"><a href="/pages/documentation/context_options/" style="text-align: center"><label layout="row center-center"><i class="material-icons notranslate">arrow_left</i>&nbsp; <span style="padding-right: 24px">Previous</span></label><div class="mdl-color-text--pink">Context Options</div></a><a href="/pages/documentation/active_refresh/" style="text-align: center"><label layout="row center-center"><span style="padding-left: 24px">Next</span> <i class="material-icons notranslate">arrow_right</i>&nbsp;</label><div class="mdl-color-text--pink">Events and Active→Refresh</div></a></div></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="font-size:80%; padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
 <ul>
     <li >
     <a href="/home" class="mdl-js-ripple-effect">
diff --git a/docs/playground/index.html b/docs/playground/index.html
index 8272055..891f837 100644
--- a/docs/playground/index.html
+++ b/docs/playground/index.html
@@ -80,7 +80,7 @@
     body {
         margin: 0;
         padding: 0;
-        font-size: 12px!important;
+        font-size: 12pt!important;
         font-family: "Roboto", "Open Sans", sans-serif;
         font-weight: 400;
         position: relative;
@@ -126,7 +126,7 @@
     }
     label {
         color: #366495;
-        font-size: 14px;
+        font-size: 12pt;
         text-transform: uppercase;
         font-weight: 600;
         margin-top: 24px;
@@ -139,7 +139,7 @@
     li {
         font-weight: 400;
         line-height: 175%;
-        font-size: 100%;
+        font-size: 105%;
         min-height: 32px;
     }
     li small {
@@ -183,7 +183,7 @@
     }
 
     code[class*=language-], pre[class*=language-] {
-        font-size: 115%;
+        font-size: 100%;
     }
     pre:not([class*="language-"]) {
         width: 100%;
@@ -252,7 +252,7 @@
         margin-bottom: 16px;
     }
     div.content > p {
-        font-size: 150% !important;
+        font-size: 110% !important;
         line-height: 170% !important;
         margin: 24px 0 24px;
     }
@@ -387,11 +387,11 @@
 
 .drawer-header .text-logo {
     font-family: "Roboto", "Open Sans", sans-serif;
-    font-size: 180%;
+    font-size: 150%;
     font-weight: 400;
 }
 .drawer-header .text-logo small {
-    font-size: 12px;
+    font-size: 10pt;
     vertical-align: middle;
     margin-left: 8px;
 }
@@ -449,6 +449,7 @@
     color: var(--primary-color);
 }
 .drawer-content li a {
+    font-weight: bold;
     color: var(--accent-color);
     position: relative;
     display: block;
@@ -483,7 +484,7 @@
 }
 [z-context="menu-drawer"]:focus {
     outline: none;
-}</style><!-- zUIx.js inline resources bundle --><script src="index.bundle.js"></script></head><!-- scroll helper is used to show/hide the header when scrolling --><body ctrl="" z-load="@lib/controllers/header-auto-hide" :header="'header'" z-lazy="scroll" data-theme="" layout="column stretch-stretch"><nav #header="" layout="row center-start"><div self="stretch" layout="row center-start"><button onclick="menuDrawer.open()" class="header-menu-button mdl-button mdl-button--icon"><i class="material-icons notranslate">menu_open</i></button><h1 self="size-x1" class="title">Playground</h1></div></nav><main layout="column top-center"><h1 #alt_header="" class="title">Playground</h1><div self="size-x1" class="content"><zx-playground :menu-items="menuItems" class="visible-on-ready notranslate" style="height: 80vh"></zx-playground><script>const menuItems=[{link:"#/app/examples/new-component",description:"New component"},{link:"#/app/examples/custom-elements-01",description:"Custom elements #1"},{link:"#/app/examples/custom-elements-02",description:"Custom elements #2"},{link:"#/app/examples/default-component",description:"Default component"},{link:"#/app/widgets/time-clock",description:"Time clock"},{link:"#/app/widgets/analog-clock",description:"Analog clock"}]</script><div layout="row center-center"><a ctrl="" z-load="@lib/controllers/mdl-button" :type="'flat'" class="margin-16px visible-on-ready" title="Link to Playground Component docs" href="https://zuixjs.github.io/zkit/content/components/zx-playground/">Playground Component docs</a></div></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
+}</style><!-- zUIx.js inline resources bundle --><script src="index.bundle.js"></script></head><!-- scroll helper is used to show/hide the header when scrolling --><body ctrl="" z-load="@lib/controllers/header-auto-hide" :header="'header'" z-lazy="scroll" data-theme="" layout="column stretch-stretch"><nav #header="" layout="row center-start"><div self="stretch" layout="row center-start"><button onclick="menuDrawer.open()" class="header-menu-button mdl-button mdl-button--icon"><i class="material-icons notranslate">menu_open</i></button><h1 self="size-x1" class="title">Playground</h1></div></nav><main layout="column top-center"><h1 #alt_header="" class="title">Playground</h1><div self="size-x1" class="content"><zx-playground :menu-items="menuItems" class="visible-on-ready notranslate" style="height: 80vh"></zx-playground><script>const menuItems=[{link:"#/app/examples/new-component",description:"New component"},{link:"#/app/examples/custom-elements-01",description:"Custom elements #1"},{link:"#/app/examples/custom-elements-02",description:"Custom elements #2"},{link:"#/app/examples/default-component",description:"Default component"},{link:"#/app/widgets/time-clock",description:"Time clock"},{link:"#/app/widgets/analog-clock",description:"Analog clock"}]</script><div layout="row center-center"><a ctrl="" z-load="@lib/controllers/mdl-button" :type="'flat'" class="margin-16px visible-on-ready" title="Link to Playground Component docs" href="https://zuixjs.github.io/zkit/content/components/zx-playground/">Playground Component docs</a></div></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="font-size:80%; padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
 <ul>
     <li >
     <a href="/home" class="mdl-js-ripple-effect">
diff --git a/docs/search-index.json b/docs/search-index.json
index 265fa93..b014ec8 100644
--- a/docs/search-index.json
+++ b/docs/search-index.json
@@ -1,2 +1,2 @@
 
-{"keys":[{"path":["title"],"id":"title","weight":1,"src":"title","getFn":null},{"path":["description"],"id":"description","weight":1,"src":"description","getFn":null},{"path":["content"],"id":"content","weight":1,"src":"content","getFn":null}],"records":[{"i":0,"$":{"0":{"v":"API","n":1},"1":{"v":"API classes documentation, Zuix, ComponentContext, ContextController, ZxQuery.","n":0.378},"2":{"v":"## [Zuix](zuix/Zuix) class This is the main library class accessible through the global object `zuix`. ## [ComponentContext](zuix/ComponentContext) class The context of a component manages and holds a reference to all the resources related to the component instance itself. ## [ContextController](zuix/ContextController) class This is the class used for implementing a controller. Methods of the controller object allow accessing and managing the view, events and all other aspect of a *zuix.js* component. ## [ZxQuery](helpers/ZxQuery) class *ZxQuery* is a class that provides a few utility methods ","n":0.11}}},{"i":1,"$":{"0":{"v":"Terms and concepts","n":0.577},"1":{"v":"Rendering components with a SSG or with SSR, and differences with client-side components loading. About reusability.","n":0.25},"2":{"v":"This is a brief introduction to some terms and concepts commonly used in web development and related to *zuix.js* functionality. For a better understanding of these pages a basic knowledge of HTML, CSS and JavaScript is required. ## Component We can think of a component as a **reusable part** of the page that can be defined once and then added to any page, one or more times, by just referencing it. In a component there are two kind of reusable parts: - a visible part (*view*), which is a block of HTML and CSS code that is rendered in the page - a program-logic part (*controller*), which is a b","n":0.095}}},{"i":2,"$":{"0":{"v":"About zuix.js","n":0.707},"1":{"v":"zuix.js is a lightweight library for creating component based websites and applications by using standard HTML, CSS and JavaScript.","n":0.229},"2":{"v":"🐝 `zuix.js` is a lightweight library for building modular, component-based websites and apps that use standard HTML, CSS, and JavaScript with a few handy extras that will speed up development time and improve code reusability and maintainability. It&#39;s framework-agnostic, and does not require any bundler, package manager, or transpiling to work; all the magic is already provided by the library itself and can be used with your favorite web development stack. Designed to maximize website speed, it will automatically load components and dependencies only when they are actually going to be use","n":0.104}}},{"i":3,"$":{"0":{"v":"CLI / Templates","n":0.577},"1":{"v":"Command Line Interface, creating a new projects, pages, templates and components.","n":0.302},"2":{"v":"🧰 `zuix-cli` is a tool for the command line for creating new projects, adding pages or components, bundling and compressing into a single HTML file all resources used in a page, either local or remote ones. Project starter templates are using [Eleventy](https://11ty.dev/) as site generator, which works very nicely together with *zuix.js*. **Features in brief** - Page bundling (components, styles, scripts) - Assets mirroring (creates a local copy of external resources such as scripts, images and videos) - *Eleventy* site generator: * Integrated web server (*BrowserSync*) * Automatic rebuild an","n":0.105}}},{"i":4,"$":{"0":{"v":"Component","n":1},"1":{"v":"Components, custom elements, shadow DOM, standalone components, the <em>default</em> component.","n":0.316},"2":{"v":"A *component* consists of a **[View](../view)**, that is implemented as HTML template with its own CSS, and a **[Controller](../controller)** that is the Javascript code that controls the *view*, its presentation and the interaction logic. Component&#39;s files are placed in the same *path* location and their base name is the same, and it represents itself the *component&#39;s name*: - `[/]&lt;component_name&gt;.html` - `[/]&lt;component_name&gt;.css` (optional) - `[/]&lt;component_name&gt;.js` The *unique identifier of the component* is therefore its full path, formed by the `` of the compone","n":0.11}}},{"i":5,"$":{"0":{"v":"Context Options","n":0.707},"1":{"v":"Component's loading options, event handlers, styles, priority, theming.","n":0.354},"2":{"v":"When loading a component some options might be provided, some of which are available for all components, some others are custom options that can be implemented by the component for its own purpose. In either case, these options (*context options*), can be passed adding the attribute `z-options` to the component&#39;s host element. The value of the `z-options` attribute can be the name of a variable in the global scope with the value of a JSON object implementing one or more option fields described in the [ContextOptions](../api/zuix/Zuix/#ContextOptions) API. The value can also be an inline JS","n":0.103}}},{"i":6,"$":{"0":{"v":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","n":0.447},"1":{"v":"zUIx.js API documentation, Class: Componentizer","n":0.447},"2":{"v":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit","n":0.101}}},{"i":7,"$":{"0":{"v":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","n":0.447},"1":{"v":"zUIx.js API documentation, Class: Localizer","n":0.447},"2":{"v":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit","n":0.101}}},{"i":8,"$":{"0":{"v":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","n":0.447},"1":{"v":"zUIx.js API documentation, Class: ComponentContext","n":0.447},"2":{"v":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit","n":0.101}}},{"i":9,"$":{"0":{"v":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","n":0.447},"1":{"v":"zUIx.js API documentation, Class: ObservableListener","n":0.447},"2":{"v":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit","n":0.101}}},{"i":10,"$":{"0":{"v":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","n":0.447},"1":{"v":"zUIx.js API documentation, Class: Logger","n":0.447},"2":{"v":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit","n":0.101}}},{"i":11,"$":{"0":{"v":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","n":0.447},"1":{"v":"zUIx.js API documentation, Class: ObservableObject","n":0.447},"2":{"v":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit","n":0.101}}},{"i":12,"$":{"0":{"v":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","n":0.447},"1":{"v":"zUIx.js API documentation, Class: ObjectObserver","n":0.447},"2":{"v":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit","n":0.101}}},{"i":13,"$":{"0":{"v":"Events and Active&rarr;Refresh","n":0.577},"1":{"v":"About scoped scripts, dependencies, refresh-handlers, built-in @ handlers, custom handlers.","n":0.316},"2":{"v":"Inside the view of a component, other than standard HTML event handlers, it is possible to add event handlers that live inside the component&#39;s scripting scope. This kind of event handlers can be added to an element as an attribute having the name of the event wrapped between parentheses: `(&lt;event_name&gt;)=&quot;&lt;inline_code_or_handler_fn&gt;&quot;` The value o such event attribute is evaluated as JavaScript expression and can contain reference to variables and functions defined in the component&#39;s scripting scope, where the following predefined members are available: | Name | Des","n":0.108}}},{"i":14,"$":{"0":{"v":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","n":0.447},"1":{"v":"zUIx.js API documentation, Namespace: dom","n":0.447},"2":{"v":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit","n":0.101}}},{"i":15,"$":{"0":{"v":"Getting started","n":0.707},"1":{"v":"Creating a new project using *zuix.js* CLI tool and bare library usage.","n":0.289},"2":{"v":"See **zuix.js** in action using the online playground, where is possible to create and download ready to use components directly in the browser! {% unpre %} ```html sports_soccer Playground ``` {% endunpre %} ## Bare library usage on an existing site ### JsDeliver As a regular script: ```html ``` As a module: ```html ``` As a dependency of another module: ```js // file: my-class.module.js import &#39;https://cdn.jsdelivr.net/npm/zuix-dist@{{ pkg.dependencies[&#39;zuix-dist&#39;] | remove_first: &#39;^&#39; }}/js/zuix.module.min.js&#39;; ``` ### NPM ```bash npm install zuix-dist ``` then copy t","n":0.11}}},{"i":16,"$":{"0":{"v":"Controller","n":1},"1":{"v":"Controller implementation types, lifecycle, options, events.","n":0.408},"2":{"v":"A controller is a JavaScript piece of code that can be associated to a view, and it manages its data, presentation and the usage/interaction logic. Through a controller, it&#39;s possible to customize all aspects of a component&#39;s lifecycle since it&#39;s early initialization up to the disposal of the component itself. This can be done by implementing component&#39;s [lifecycle callbacks](../api/zuix/ContextController/#init). ## Loading a controller A controller can be loaded programmatically using the [`zuix.loadComponent(..)`](../api/zuix/Zuix/#loadComponent) method, or it can be loaded d","n":0.113}}},{"i":17,"$":{"0":{"v":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","n":0.447},"1":{"v":"zUIx.js API documentation, Class: Zuix","n":0.447},"2":{"v":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit","n":0.101}}},{"i":18,"$":{"0":{"v":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","n":0.447},"1":{"v":"zUIx.js API documentation, Class: ActiveRefresh","n":0.447},"2":{"v":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit","n":0.101}}},{"i":19,"$":{"0":{"v":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","n":0.447},"1":{"v":"zUIx.js API documentation, Class: ControllerInstance","n":0.447},"2":{"v":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit","n":0.101}}},{"i":20,"$":{"0":{"v":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","n":0.447},"1":{"v":"zUIx.js API documentation, Class: TaskQueue","n":0.447},"2":{"v":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit","n":0.101}}},{"i":21,"$":{"0":{"v":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","n":0.447},"1":{"v":"zUIx.js API documentation, Class: ZxQueryStatic","n":0.447},"2":{"v":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit","n":0.101}}},{"i":22,"$":{"0":{"v":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","n":0.447},"1":{"v":"zUIx.js API documentation, Class: ContextController","n":0.447},"2":{"v":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit","n":0.101}}},{"i":23,"$":{"0":{"v":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","n":0.447},"1":{"v":"zUIx.js API documentation, Class: ViewObserver","n":0.447},"2":{"v":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit","n":0.101}}},{"i":24,"$":{"0":{"v":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","n":0.447},"1":{"v":"zUIx.js API documentation, Namespace: Utils","n":0.447},"2":{"v":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit","n":0.101}}},{"i":25,"$":{"0":{"v":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","n":0.447},"1":{"v":"zUIx.js API documentation, Namespace: dom","n":0.447},"2":{"v":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit","n":0.101}}},{"i":26,"$":{"0":{"v":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","n":0.447},"1":{"v":"zUIx.js API documentation, Class: ZxQuery","n":0.447},"2":{"v":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit","n":0.101}}},{"i":27,"$":{"0":{"v":"View","n":1},"1":{"v":"View, Data binding, binding adapters, accessibility, behaviors, events.","n":0.354},"2":{"v":"A *view* is the visual part of a component, and it consists of an `.html` template file, and a `.css` file, both with the same base name: - `&lt;component_id&gt;.html` - `&lt;component_id&gt;.css` (optional) A *view* can also be implemented inline, rather than in separate files, and can be declared by adding the `z-view` attribute to its container element. The value of `z-view` attribute is meant to be a unique identifier (`[/]component_name`) and should not match the identifier of any other view placed in a file or inline in the same page, unless we want to override it. Example Inline declara","n":0.101}}}]}
+{"keys":[{"path":["title"],"id":"title","weight":1,"src":"title","getFn":null},{"path":["description"],"id":"description","weight":1,"src":"description","getFn":null},{"path":["content"],"id":"content","weight":1,"src":"content","getFn":null}],"records":[{"i":0,"$":{"0":{"v":"API","n":1},"1":{"v":"API classes documentation, Zuix, ComponentContext, ContextController, ZxQuery.","n":0.378},"2":{"v":"## [Zuix](zuix/Zuix) class This is the main library class accessible through the global object `zuix`. ## [ComponentContext](zuix/ComponentContext) class The context of a component manages and holds a reference to all the resources related to the component instance itself. ## [ContextController](zuix/ContextController) class This is the class used for implementing a controller. Methods of the controller object allow accessing and managing the view, events and all other aspect of a *zuix.js* component. ## [ZxQuery](helpers/ZxQuery) class *ZxQuery* is a class that provides a few utility methods ","n":0.11}}},{"i":1,"$":{"0":{"v":"Terms and concepts","n":0.577},"1":{"v":"Rendering components with a SSG or with SSR, and differences with client-side components loading. About reusability.","n":0.25},"2":{"v":"This is a brief introduction to some terms and concepts commonly used in web development and related to *zuix.js* functionality. For a better understanding of these pages a basic knowledge of HTML, CSS and JavaScript is required. ## Component We can think of a component as a **reusable part** of the page that can be defined once and then added to any page, one or more times, by just referencing it. In a component there are two kind of reusable parts: - a visible part (*view*), which is a block of HTML and CSS code that is rendered in the page - a program-logic part (*controller*), which is a b","n":0.095}}},{"i":2,"$":{"0":{"v":"About zuix.js","n":0.707},"1":{"v":"zuix.js is a lightweight library for creating component based websites and applications by using standard HTML, CSS and JavaScript.","n":0.229},"2":{"v":"🐝 `zuix.js` is a lightweight library for building modular, component-based websites and apps that use standard HTML, CSS, and JavaScript with a few handy extras that will speed up development time and improve code reusability and maintainability. It&#39;s framework-agnostic, and does not require any bundler, package manager, or transpiling to work; all the magic is already provided by the library itself and can be used with your favorite web development stack. Designed to maximize website speed, it will automatically load components and dependencies only when they are actually going to be use","n":0.104}}},{"i":3,"$":{"0":{"v":"CLI / Templates","n":0.577},"1":{"v":"Command Line Interface, creating a new projects, pages, templates and components.","n":0.302},"2":{"v":"🧰 `zuix-cli` is a tool for the command line for creating new projects, adding pages or components, bundling and compressing into a single HTML file all resources used in a page, either local or remote ones. Project starter templates are using [Eleventy](https://11ty.dev/) as site generator, which works very nicely together with *zuix.js*. **Features in brief** - Page bundling (components, styles, scripts) - Assets mirroring (creates a local copy of external resources such as scripts, images and videos) - *Eleventy* site generator: * Integrated web server (*BrowserSync*) * Automatic rebuild an","n":0.105}}},{"i":4,"$":{"0":{"v":"Component","n":1},"1":{"v":"Components, custom elements, shadow DOM, standalone components, the <em>default</em> component.","n":0.316},"2":{"v":"A *component* consists of a **[View](../view)**, that is implemented as HTML template with its own CSS, and a **[Controller](../controller)** that is the Javascript code that controls the *view*, its presentation and the interaction logic. Component&#39;s files are placed in the same *path* location and their base name is the same, and it represents itself the *component&#39;s name*: - `[/]&lt;component_name&gt;.html` - `[/]&lt;component_name&gt;.css` (optional) - `[/]&lt;component_name&gt;.js` The *unique identifier of the component* is therefore its full path, formed by the `` of the compone","n":0.11}}},{"i":5,"$":{"0":{"v":"Context Options","n":0.707},"1":{"v":"Component's loading options, event handlers, styles, priority, theming.","n":0.354},"2":{"v":"When loading a component some options might be provided, some of which are available for all components, some others are custom options that can be implemented by the component for its own purpose. In either case, these options (*context options*), can be passed adding the attribute `z-options` to the component&#39;s host element. The value of the `z-options` attribute can be the name of a variable in the global scope with the value of a JSON object implementing one or more option fields described in the [ContextOptions](../api/zuix/Zuix/#ContextOptions) API. The value can also be an inline JS","n":0.103}}},{"i":6,"$":{"0":{"v":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","n":0.447},"1":{"v":"zUIx.js API documentation, Class: Componentizer","n":0.447},"2":{"v":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit","n":0.101}}},{"i":7,"$":{"0":{"v":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","n":0.447},"1":{"v":"zUIx.js API documentation, Class: Localizer","n":0.447},"2":{"v":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit","n":0.101}}},{"i":8,"$":{"0":{"v":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","n":0.447},"1":{"v":"zUIx.js API documentation, Class: ComponentContext","n":0.447},"2":{"v":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit","n":0.101}}},{"i":9,"$":{"0":{"v":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","n":0.447},"1":{"v":"zUIx.js API documentation, Class: ObservableListener","n":0.447},"2":{"v":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit","n":0.101}}},{"i":10,"$":{"0":{"v":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","n":0.447},"1":{"v":"zUIx.js API documentation, Class: Logger","n":0.447},"2":{"v":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit","n":0.101}}},{"i":11,"$":{"0":{"v":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","n":0.447},"1":{"v":"zUIx.js API documentation, Class: ObservableObject","n":0.447},"2":{"v":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit","n":0.101}}},{"i":12,"$":{"0":{"v":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","n":0.447},"1":{"v":"zUIx.js API documentation, Class: ObjectObserver","n":0.447},"2":{"v":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit","n":0.101}}},{"i":13,"$":{"0":{"v":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","n":0.447},"1":{"v":"zUIx.js API documentation, Namespace: dom","n":0.447},"2":{"v":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit","n":0.101}}},{"i":14,"$":{"0":{"v":"Getting started","n":0.707},"1":{"v":"Creating a new project using *zuix.js* CLI tool and bare library usage.","n":0.289},"2":{"v":"See **zuix.js** in action using the online playground, where is possible to create and download ready to use components directly in the browser! {% unpre %} ```html sports_soccer Playground ``` {% endunpre %} ## Bare library usage on an existing site ### JsDeliver As a regular script: ```html ``` As a module: ```html ``` As a dependency of another module: ```js // file: my-class.module.js import &#39;https://cdn.jsdelivr.net/npm/zuix-dist@{{ pkg.dependencies[&#39;zuix-dist&#39;] | remove_first: &#39;^&#39; }}/js/zuix.module.min.js&#39;; ``` ### NPM ```bash npm install zuix-dist ``` then copy t","n":0.11}}},{"i":15,"$":{"0":{"v":"Controller","n":1},"1":{"v":"Controller implementation types, lifecycle, options, events.","n":0.408},"2":{"v":"A controller is a JavaScript piece of code that can be associated to a view, and it manages its data, presentation and the usage/interaction logic. Through a controller, it&#39;s possible to customize all aspects of a component&#39;s lifecycle since it&#39;s early initialization up to the disposal of the component itself. This can be done by implementing component&#39;s [lifecycle callbacks](../api/zuix/ContextController/#init). ## Loading a controller A controller can be loaded programmatically using the [`zuix.loadComponent(..)`](../api/zuix/Zuix/#loadComponent) method, or it can be loaded d","n":0.113}}},{"i":16,"$":{"0":{"v":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","n":0.447},"1":{"v":"zUIx.js API documentation, Class: Zuix","n":0.447},"2":{"v":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit","n":0.101}}},{"i":17,"$":{"0":{"v":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","n":0.447},"1":{"v":"zUIx.js API documentation, Class: ActiveRefresh","n":0.447},"2":{"v":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit","n":0.101}}},{"i":18,"$":{"0":{"v":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","n":0.447},"1":{"v":"zUIx.js API documentation, Class: ControllerInstance","n":0.447},"2":{"v":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit","n":0.101}}},{"i":19,"$":{"0":{"v":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","n":0.447},"1":{"v":"zUIx.js API documentation, Class: TaskQueue","n":0.447},"2":{"v":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit","n":0.101}}},{"i":20,"$":{"0":{"v":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","n":0.447},"1":{"v":"zUIx.js API documentation, Class: ZxQueryStatic","n":0.447},"2":{"v":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit","n":0.101}}},{"i":21,"$":{"0":{"v":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","n":0.447},"1":{"v":"zUIx.js API documentation, Class: ContextController","n":0.447},"2":{"v":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit","n":0.101}}},{"i":22,"$":{"0":{"v":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","n":0.447},"1":{"v":"zUIx.js API documentation, Class: ViewObserver","n":0.447},"2":{"v":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit","n":0.101}}},{"i":23,"$":{"0":{"v":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","n":0.447},"1":{"v":"zUIx.js API documentation, Namespace: Utils","n":0.447},"2":{"v":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit","n":0.101}}},{"i":24,"$":{"0":{"v":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","n":0.447},"1":{"v":"zUIx.js API documentation, Namespace: dom","n":0.447},"2":{"v":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit","n":0.101}}},{"i":25,"$":{"0":{"v":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","n":0.447},"1":{"v":"zUIx.js API documentation, Class: ZxQuery","n":0.447},"2":{"v":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit","n":0.101}}},{"i":26,"$":{"0":{"v":"View","n":1},"1":{"v":"View, Data binding, binding adapters, accessibility, behaviors, events.","n":0.354},"2":{"v":"A *view* is the visual part of a component, and it consists of an `.html` template file, and a `.css` file, both with the same base name: - `&lt;component_id&gt;.html` - `&lt;component_id&gt;.css` (optional) A *view* can also be implemented inline, rather than in separate files, and can be declared by adding the `z-view` attribute to its container element. The value of `z-view` attribute is meant to be a unique identifier (`[/]component_name`) and should not match the identifier of any other view placed in a file or inline in the same page, unless we want to override it. Example Inline declara","n":0.101}}},{"i":27,"$":{"0":{"v":"Events and Active&rarr;Refresh","n":0.577},"1":{"v":"About scoped scripts, dependencies, refresh-handlers, built-in @ handlers, custom handlers.","n":0.316},"2":{"v":"Inside the view of a component, other than standard HTML event handlers, it is possible to add event handlers that live inside the component&#39;s scripting scope. This kind of event handlers can be added to an element as an attribute having the name of the event wrapped between parentheses: `(&lt;event_name&gt;)=&quot;&lt;inline_code_or_handler_fn&gt;&quot;` The value o such event attribute is evaluated as JavaScript expression and can contain reference to variables and functions defined in the component&#39;s scripting scope, where the following predefined members are available: | Name | Des","n":0.108}}}]}
diff --git a/docs/search-list.json b/docs/search-list.json
index b2c0f1e..7974b4b 100644
--- a/docs/search-list.json
+++ b/docs/search-list.json
@@ -1 +1 @@
-[{"url":"/pages/documentation/api/","title":"API","description":"API classes documentation, Zuix, ComponentContext, ContextController, ZxQuery.","content":"## [Zuix](zuix/Zuix) class This is the main library class accessible through the global object `zuix`. ## [ComponentContext](zuix/ComponentContext) class The context of a component manages and holds a reference to all the resources related to the component instance itself. ## [ContextController](zuix/ContextController) class This is the class used for implementing a controller. Methods of the controller object allow accessing and managing the view, events and all other aspect of a *zuix.js* component. ## [ZxQuery](helpers/ZxQuery) class *ZxQuery* is a class that provides a few utility methods "},{"url":"/pages/documentation/basic_concepts/","title":"Terms and concepts","description":"Rendering components with a SSG or with SSR, and differences with client-side components loading. About reusability.","content":"This is a brief introduction to some terms and concepts commonly used in web development and related to *zuix.js* functionality. For a better understanding of these pages a basic knowledge of HTML, CSS and JavaScript is required. ## Component We can think of a component as a **reusable part** of the page that can be defined once and then added to any page, one or more times, by just referencing it. In a component there are two kind of reusable parts: - a visible part (*view*), which is a block of HTML and CSS code that is rendered in the page - a program-logic part (*controller*), which is a b"},{"url":"/pages/documentation/about/","title":"About zuix.js","description":"zuix.js is a lightweight library for creating component based websites and applications by using standard HTML, CSS and JavaScript.","content":"🐝 `zuix.js` is a lightweight library for building modular, component-based websites and apps that use standard HTML, CSS, and JavaScript with a few handy extras that will speed up development time and improve code reusability and maintainability. It&#39;s framework-agnostic, and does not require any bundler, package manager, or transpiling to work; all the magic is already provided by the library itself and can be used with your favorite web development stack. Designed to maximize website speed, it will automatically load components and dependencies only when they are actually going to be use"},{"url":"/pages/documentation/cli/","title":"CLI / Templates","description":"Command Line Interface, creating a new projects, pages, templates and components.","content":"🧰 `zuix-cli` is a tool for the command line for creating new projects, adding pages or components, bundling and compressing into a single HTML file all resources used in a page, either local or remote ones. Project starter templates are using [Eleventy](https://11ty.dev/) as site generator, which works very nicely together with *zuix.js*. **Features in brief** - Page bundling (components, styles, scripts) - Assets mirroring (creates a local copy of external resources such as scripts, images and videos) - *Eleventy* site generator: * Integrated web server (*BrowserSync*) * Automatic rebuild an"},{"url":"/pages/documentation/component/","title":"Component","description":"Components, custom elements, shadow DOM, standalone components, the <em>default</em> component.","content":"A *component* consists of a **[View](../view)**, that is implemented as HTML template with its own CSS, and a **[Controller](../controller)** that is the Javascript code that controls the *view*, its presentation and the interaction logic. Component&#39;s files are placed in the same *path* location and their base name is the same, and it represents itself the *component&#39;s name*: - `[/]&lt;component_name&gt;.html` - `[/]&lt;component_name&gt;.css` (optional) - `[/]&lt;component_name&gt;.js` The *unique identifier of the component* is therefore its full path, formed by the `` of the compone"},{"url":"/pages/documentation/context_options/","title":"Context Options","description":"Component's loading options, event handlers, styles, priority, theming.","content":"When loading a component some options might be provided, some of which are available for all components, some others are custom options that can be implemented by the component for its own purpose. In either case, these options (*context options*), can be passed adding the attribute `z-options` to the component&#39;s host element. The value of the `z-options` attribute can be the name of a variable in the global scope with the value of a JSON object implementing one or more option fields described in the [ContextOptions](../api/zuix/Zuix/#ContextOptions) API. The value can also be an inline JS"},{"url":"/pages/documentation/api/zuix/Componentizer/","title":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","description":"zUIx.js API documentation, Class: Componentizer","content":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit"},{"url":"/pages/documentation/api/localizer/Localizer/","title":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","description":"zUIx.js API documentation, Class: Localizer","content":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit"},{"url":"/pages/documentation/api/zuix/ComponentContext/","title":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","description":"zUIx.js API documentation, Class: ComponentContext","content":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit"},{"url":"/pages/documentation/api/observable/ObservableListener/","title":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","description":"zUIx.js API documentation, Class: ObservableListener","content":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit"},{"url":"/pages/documentation/api/helpers/Logger/","title":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","description":"zUIx.js API documentation, Class: Logger","content":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit"},{"url":"/pages/documentation/api/observable/ObservableObject/","title":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","description":"zUIx.js API documentation, Class: ObservableObject","content":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit"},{"url":"/pages/documentation/api/observable/ObjectObserver/","title":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","description":"zUIx.js API documentation, Class: ObjectObserver","content":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit"},{"url":"/pages/documentation/active_refresh/","title":"Events and Active&rarr;Refresh","description":"About scoped scripts, dependencies, refresh-handlers, built-in @ handlers, custom handlers.","content":"Inside the view of a component, other than standard HTML event handlers, it is possible to add event handlers that live inside the component&#39;s scripting scope. This kind of event handlers can be added to an element as an attribute having the name of the event wrapped between parentheses: `(&lt;event_name&gt;)=&quot;&lt;inline_code_or_handler_fn&gt;&quot;` The value o such event attribute is evaluated as JavaScript expression and can contain reference to variables and functions defined in the component&#39;s scripting scope, where the following predefined members are available: | Name | Des"},{"url":"/pages/documentation/api/helpers/Utils.dom/","title":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","description":"zUIx.js API documentation, Namespace: dom","content":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit"},{"url":"/pages/documentation/getting_started/","title":"Getting started","description":"Creating a new project using *zuix.js* CLI tool and bare library usage.","content":"See **zuix.js** in action using the online playground, where is possible to create and download ready to use components directly in the browser! {% unpre %} ```html sports_soccer Playground ``` {% endunpre %} ## Bare library usage on an existing site ### JsDeliver As a regular script: ```html ``` As a module: ```html ``` As a dependency of another module: ```js // file: my-class.module.js import &#39;https://cdn.jsdelivr.net/npm/zuix-dist@{{ pkg.dependencies[&#39;zuix-dist&#39;] | remove_first: &#39;^&#39; }}/js/zuix.module.min.js&#39;; ``` ### NPM ```bash npm install zuix-dist ``` then copy t"},{"url":"/pages/documentation/controller/","title":"Controller","description":"Controller implementation types, lifecycle, options, events.","content":"A controller is a JavaScript piece of code that can be associated to a view, and it manages its data, presentation and the usage/interaction logic. Through a controller, it&#39;s possible to customize all aspects of a component&#39;s lifecycle since it&#39;s early initialization up to the disposal of the component itself. This can be done by implementing component&#39;s [lifecycle callbacks](../api/zuix/ContextController/#init). ## Loading a controller A controller can be loaded programmatically using the [`zuix.loadComponent(..)`](../api/zuix/Zuix/#loadComponent) method, or it can be loaded d"},{"url":"/pages/documentation/api/zuix/Zuix/","title":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","description":"zUIx.js API documentation, Class: Zuix","content":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit"},{"url":"/pages/documentation/api/zuix/ActiveRefresh/","title":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","description":"zUIx.js API documentation, Class: ActiveRefresh","content":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit"},{"url":"/pages/documentation/api/zuix/ControllerInstance/","title":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","description":"zUIx.js API documentation, Class: ControllerInstance","content":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit"},{"url":"/pages/documentation/api/helpers/TaskQueue/","title":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","description":"zUIx.js API documentation, Class: TaskQueue","content":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit"},{"url":"/pages/documentation/api/helpers/ZxQueryStatic/","title":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","description":"zUIx.js API documentation, Class: ZxQueryStatic","content":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit"},{"url":"/pages/documentation/api/zuix/ContextController/","title":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","description":"zUIx.js API documentation, Class: ContextController","content":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit"},{"url":"/pages/documentation/api/zuix/ViewObserver/","title":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","description":"zUIx.js API documentation, Class: ViewObserver","content":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit"},{"url":"/pages/documentation/api/helpers/Utils/","title":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","description":"zUIx.js API documentation, Namespace: Utils","content":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit"},{"url":"/pages/documentation/api/helpers/Utils_dom/","title":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","description":"zUIx.js API documentation, Namespace: dom","content":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit"},{"url":"/pages/documentation/api/helpers/ZxQuery/","title":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","description":"zUIx.js API documentation, Class: ZxQuery","content":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit"},{"url":"/pages/documentation/view/","title":"View","description":"View, Data binding, binding adapters, accessibility, behaviors, events.","content":"A *view* is the visual part of a component, and it consists of an `.html` template file, and a `.css` file, both with the same base name: - `&lt;component_id&gt;.html` - `&lt;component_id&gt;.css` (optional) A *view* can also be implemented inline, rather than in separate files, and can be declared by adding the `z-view` attribute to its container element. The value of `z-view` attribute is meant to be a unique identifier (`[/]component_name`) and should not match the identifier of any other view placed in a file or inline in the same page, unless we want to override it. Example Inline declara"}]
\ No newline at end of file
+[{"url":"/pages/documentation/api/","title":"API","description":"API classes documentation, Zuix, ComponentContext, ContextController, ZxQuery.","content":"## [Zuix](zuix/Zuix) class This is the main library class accessible through the global object `zuix`. ## [ComponentContext](zuix/ComponentContext) class The context of a component manages and holds a reference to all the resources related to the component instance itself. ## [ContextController](zuix/ContextController) class This is the class used for implementing a controller. Methods of the controller object allow accessing and managing the view, events and all other aspect of a *zuix.js* component. ## [ZxQuery](helpers/ZxQuery) class *ZxQuery* is a class that provides a few utility methods "},{"url":"/pages/documentation/basic_concepts/","title":"Terms and concepts","description":"Rendering components with a SSG or with SSR, and differences with client-side components loading. About reusability.","content":"This is a brief introduction to some terms and concepts commonly used in web development and related to *zuix.js* functionality. For a better understanding of these pages a basic knowledge of HTML, CSS and JavaScript is required. ## Component We can think of a component as a **reusable part** of the page that can be defined once and then added to any page, one or more times, by just referencing it. In a component there are two kind of reusable parts: - a visible part (*view*), which is a block of HTML and CSS code that is rendered in the page - a program-logic part (*controller*), which is a b"},{"url":"/pages/documentation/about/","title":"About zuix.js","description":"zuix.js is a lightweight library for creating component based websites and applications by using standard HTML, CSS and JavaScript.","content":"🐝 `zuix.js` is a lightweight library for building modular, component-based websites and apps that use standard HTML, CSS, and JavaScript with a few handy extras that will speed up development time and improve code reusability and maintainability. It&#39;s framework-agnostic, and does not require any bundler, package manager, or transpiling to work; all the magic is already provided by the library itself and can be used with your favorite web development stack. Designed to maximize website speed, it will automatically load components and dependencies only when they are actually going to be use"},{"url":"/pages/documentation/cli/","title":"CLI / Templates","description":"Command Line Interface, creating a new projects, pages, templates and components.","content":"🧰 `zuix-cli` is a tool for the command line for creating new projects, adding pages or components, bundling and compressing into a single HTML file all resources used in a page, either local or remote ones. Project starter templates are using [Eleventy](https://11ty.dev/) as site generator, which works very nicely together with *zuix.js*. **Features in brief** - Page bundling (components, styles, scripts) - Assets mirroring (creates a local copy of external resources such as scripts, images and videos) - *Eleventy* site generator: * Integrated web server (*BrowserSync*) * Automatic rebuild an"},{"url":"/pages/documentation/component/","title":"Component","description":"Components, custom elements, shadow DOM, standalone components, the <em>default</em> component.","content":"A *component* consists of a **[View](../view)**, that is implemented as HTML template with its own CSS, and a **[Controller](../controller)** that is the Javascript code that controls the *view*, its presentation and the interaction logic. Component&#39;s files are placed in the same *path* location and their base name is the same, and it represents itself the *component&#39;s name*: - `[/]&lt;component_name&gt;.html` - `[/]&lt;component_name&gt;.css` (optional) - `[/]&lt;component_name&gt;.js` The *unique identifier of the component* is therefore its full path, formed by the `` of the compone"},{"url":"/pages/documentation/context_options/","title":"Context Options","description":"Component's loading options, event handlers, styles, priority, theming.","content":"When loading a component some options might be provided, some of which are available for all components, some others are custom options that can be implemented by the component for its own purpose. In either case, these options (*context options*), can be passed adding the attribute `z-options` to the component&#39;s host element. The value of the `z-options` attribute can be the name of a variable in the global scope with the value of a JSON object implementing one or more option fields described in the [ContextOptions](../api/zuix/Zuix/#ContextOptions) API. The value can also be an inline JS"},{"url":"/pages/documentation/api/zuix/Componentizer/","title":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","description":"zUIx.js API documentation, Class: Componentizer","content":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit"},{"url":"/pages/documentation/api/localizer/Localizer/","title":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","description":"zUIx.js API documentation, Class: Localizer","content":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit"},{"url":"/pages/documentation/api/zuix/ComponentContext/","title":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","description":"zUIx.js API documentation, Class: ComponentContext","content":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit"},{"url":"/pages/documentation/api/observable/ObservableListener/","title":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","description":"zUIx.js API documentation, Class: ObservableListener","content":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit"},{"url":"/pages/documentation/api/helpers/Logger/","title":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","description":"zUIx.js API documentation, Class: Logger","content":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit"},{"url":"/pages/documentation/api/observable/ObservableObject/","title":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","description":"zUIx.js API documentation, Class: ObservableObject","content":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit"},{"url":"/pages/documentation/api/observable/ObjectObserver/","title":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","description":"zUIx.js API documentation, Class: ObjectObserver","content":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit"},{"url":"/pages/documentation/api/helpers/Utils.dom/","title":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","description":"zUIx.js API documentation, Namespace: dom","content":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit"},{"url":"/pages/documentation/getting_started/","title":"Getting started","description":"Creating a new project using *zuix.js* CLI tool and bare library usage.","content":"See **zuix.js** in action using the online playground, where is possible to create and download ready to use components directly in the browser! {% unpre %} ```html sports_soccer Playground ``` {% endunpre %} ## Bare library usage on an existing site ### JsDeliver As a regular script: ```html ``` As a module: ```html ``` As a dependency of another module: ```js // file: my-class.module.js import &#39;https://cdn.jsdelivr.net/npm/zuix-dist@{{ pkg.dependencies[&#39;zuix-dist&#39;] | remove_first: &#39;^&#39; }}/js/zuix.module.min.js&#39;; ``` ### NPM ```bash npm install zuix-dist ``` then copy t"},{"url":"/pages/documentation/controller/","title":"Controller","description":"Controller implementation types, lifecycle, options, events.","content":"A controller is a JavaScript piece of code that can be associated to a view, and it manages its data, presentation and the usage/interaction logic. Through a controller, it&#39;s possible to customize all aspects of a component&#39;s lifecycle since it&#39;s early initialization up to the disposal of the component itself. This can be done by implementing component&#39;s [lifecycle callbacks](../api/zuix/ContextController/#init). ## Loading a controller A controller can be loaded programmatically using the [`zuix.loadComponent(..)`](../api/zuix/Zuix/#loadComponent) method, or it can be loaded d"},{"url":"/pages/documentation/api/zuix/Zuix/","title":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","description":"zUIx.js API documentation, Class: Zuix","content":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit"},{"url":"/pages/documentation/api/zuix/ActiveRefresh/","title":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","description":"zUIx.js API documentation, Class: ActiveRefresh","content":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit"},{"url":"/pages/documentation/api/zuix/ControllerInstance/","title":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","description":"zUIx.js API documentation, Class: ControllerInstance","content":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit"},{"url":"/pages/documentation/api/helpers/TaskQueue/","title":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","description":"zUIx.js API documentation, Class: TaskQueue","content":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit"},{"url":"/pages/documentation/api/helpers/ZxQueryStatic/","title":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","description":"zUIx.js API documentation, Class: ZxQueryStatic","content":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit"},{"url":"/pages/documentation/api/zuix/ContextController/","title":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","description":"zUIx.js API documentation, Class: ContextController","content":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit"},{"url":"/pages/documentation/api/zuix/ViewObserver/","title":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","description":"zUIx.js API documentation, Class: ViewObserver","content":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit"},{"url":"/pages/documentation/api/helpers/Utils/","title":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","description":"zUIx.js API documentation, Namespace: Utils","content":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit"},{"url":"/pages/documentation/api/helpers/Utils_dom/","title":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","description":"zUIx.js API documentation, Namespace: dom","content":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit"},{"url":"/pages/documentation/api/helpers/ZxQuery/","title":"zuix.js <i class='material-icons notranslate'>emoji_nature</i> API","description":"zUIx.js API documentation, Class: ZxQuery","content":"/* BEGIN: MARKDOWN JSDOC */ main .content { padding-top: 24px; } main h2 code { font-weight: 400; } main h2 { margin-top: 0; font-size: 220%; } main h3 { margin-top: 72px; font-size: 200%; color: #525252; } main h4 { margin-top: 72px; margin-bottom: 0; font-size: 180%; font-weight: 500; color: #16641c; } main h5 { color: #7c3422; text-transform: uppercase; font-size: 100%; font-weight: bold; } main h6 { font-size: 220%; } main p { margin-top: 12px !important; } main em { font-family: monospace; font-size: 95%; } main table { border: solid 1px lightgray; } main table td { border: 1px solid whit"},{"url":"/pages/documentation/view/","title":"View","description":"View, Data binding, binding adapters, accessibility, behaviors, events.","content":"A *view* is the visual part of a component, and it consists of an `.html` template file, and a `.css` file, both with the same base name: - `&lt;component_id&gt;.html` - `&lt;component_id&gt;.css` (optional) A *view* can also be implemented inline, rather than in separate files, and can be declared by adding the `z-view` attribute to its container element. The value of `z-view` attribute is meant to be a unique identifier (`[/]component_name`) and should not match the identifier of any other view placed in a file or inline in the same page, unless we want to override it. Example Inline declara"},{"url":"/pages/documentation/active_refresh/","title":"Events and Active&rarr;Refresh","description":"About scoped scripts, dependencies, refresh-handlers, built-in @ handlers, custom handlers.","content":"Inside the view of a component, other than standard HTML event handlers, it is possible to add event handlers that live inside the component&#39;s scripting scope. This kind of event handlers can be added to an element as an attribute having the name of the event wrapped between parentheses: `(&lt;event_name&gt;)=&quot;&lt;inline_code_or_handler_fn&gt;&quot;` The value o such event attribute is evaluated as JavaScript expression and can contain reference to variables and functions defined in the component&#39;s scripting scope, where the following predefined members are available: | Name | Des"}]
\ No newline at end of file
diff --git a/docs/search/index.html b/docs/search/index.html
index 7af0b47..df7f79e 100644
--- a/docs/search/index.html
+++ b/docs/search/index.html
@@ -78,7 +78,7 @@
     body {
         margin: 0;
         padding: 0;
-        font-size: 12px!important;
+        font-size: 12pt!important;
         font-family: "Roboto", "Open Sans", sans-serif;
         font-weight: 400;
         position: relative;
@@ -124,7 +124,7 @@
     }
     label {
         color: #366495;
-        font-size: 14px;
+        font-size: 12pt;
         text-transform: uppercase;
         font-weight: 600;
         margin-top: 24px;
@@ -137,7 +137,7 @@
     li {
         font-weight: 400;
         line-height: 175%;
-        font-size: 100%;
+        font-size: 105%;
         min-height: 32px;
     }
     li small {
@@ -181,7 +181,7 @@
     }
 
     code[class*=language-], pre[class*=language-] {
-        font-size: 115%;
+        font-size: 100%;
     }
     pre:not([class*="language-"]) {
         width: 100%;
@@ -250,7 +250,7 @@
         margin-bottom: 16px;
     }
     div.content > p {
-        font-size: 150% !important;
+        font-size: 110% !important;
         line-height: 170% !important;
         margin: 24px 0 24px;
     }
@@ -385,11 +385,11 @@
 
 .drawer-header .text-logo {
     font-family: "Roboto", "Open Sans", sans-serif;
-    font-size: 180%;
+    font-size: 150%;
     font-weight: 400;
 }
 .drawer-header .text-logo small {
-    font-size: 12px;
+    font-size: 10pt;
     vertical-align: middle;
     margin-left: 8px;
 }
@@ -447,6 +447,7 @@
     color: var(--primary-color);
 }
 .drawer-content li a {
+    font-weight: bold;
     color: var(--accent-color);
     position: relative;
     display: block;
@@ -562,7 +563,7 @@
         div[layout] {
             font-size: 100%;
         }
-    }</style><!-- Fuse JS --><script src="/js/fuse/fuse.min.js" defer async></script></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
+    }</style><!-- Fuse JS --><script src="/js/fuse/fuse.min.js" defer async></script></div></main><!-- Navigation Drawer --><div ctrl="" z-load="@lib/controllers/drawer-layout" z-context="menu-drawer" z-lazy="false" z-options="drawer_opts" class="drawer-layout no-select visible-on-ready" layout="column top-stretch"><!-- Navigation Drawer content --><!-- Header --><div class="drawer-header" layout="column justify-stretch"><div self="stretch" layout="row center-justify"><a href="/" title="Home"><img class="logo animate__animated animate__swing animate__fast" src="/images/icons/icon-192x192.png" alt="Logo" title="zuix.js"></a><div class="text-logo">zuix.js <small>v1.1.29</small><script>self.zuixVersion="1.1.29"</script></div><a href="https://github.com/zuixjs" style="margin: 8px 8px 4px 10px;opacity: 0.75"><img src="/images/github-mark-light.png" alt="GitHub logo" title="zuix.js on GitHub" width="32" height="32"></a></div><div style="font-size:80%; padding-left: 6px;padding-right: 6px;">JavaScript library for component-based websites and applications.</div></div><!-- Menu items and other content --><div class="drawer-content" self="size-x1"><!--
 <ul>
     <li >
     <a href="/home" class="mdl-js-ripple-effect">
diff --git a/docs/service-worker.js b/docs/service-worker.js
index 824774b..50f3bf9 100644
--- a/docs/service-worker.js
+++ b/docs/service-worker.js
@@ -1,2 +1,2 @@
-if(!self.define){let e,i={};const a=(a,n)=>(a=new URL(a+".js",n).href,i[a]||new Promise((i=>{if("document"in self){const e=document.createElement("script");e.src=a,e.onload=i,document.head.appendChild(e)}else e=a,importScripts(a),i()})).then((()=>{let e=i[a];if(!e)throw new Error(`Module ${a} didn’t register its module`);return e})));self.define=(n,c)=>{const s=e||("document"in self?document.currentScript.src:"")||location.href;if(i[s])return;let d={};const o=e=>a(e,s),r={module:{uri:s},exports:d,require:o};i[s]=Promise.all(n.map((e=>r[e]||o(e)))).then((e=>(c(...e),d)))}}define(["./workbox-15047ba7"],(function(e){"use strict";self.addEventListener("message",(e=>{e.data&&"SKIP_WAITING"===e.data.type&&self.skipWaiting()})),e.precacheAndRoute([{url:"app/content/docs/examples/alice/ch_1.html",revision:"7bdba3c49c7bb2e4cc412e7791c6e771"},{url:"app/content/docs/examples/alice/ch_2.html",revision:"ccfe438dd4542451bcdabf93ec332847"},{url:"app/content/docs/examples/alice/ch_3.html",revision:"eb43ef576cd0d1c6a85e2413870f34dc"},{url:"app/content/docs/examples/links.css",revision:"300f68df4ae2415d93a52a566b256dbf"},{url:"app/content/docs/examples/links.html",revision:"cbd247603f5f438b7c760f4fdc77cf50"},{url:"app/controllers/component-test.es5.js",revision:"4315ce75c388c30d6e5b42520e5eb6eb"},{url:"app/examples/custom-elements-01.css",revision:"d9d625f90e36313e16428a7f182dbedb"},{url:"app/examples/custom-elements-01.html",revision:"68a64fc6d107c1ce892ec39a4a079768"},{url:"app/examples/custom-elements-01.js",revision:"3bda6a343eb5a68b88ced3007b4a0072"},{url:"app/examples/custom-elements-02.css",revision:"c3c565061953830904559b9616dea61c"},{url:"app/examples/custom-elements-02.html",revision:"38be43f8d48cbf1dc9cb31300c343ae9"},{url:"app/examples/custom-elements-02.js",revision:"f15a071167478bcdba0420f3f789edf7"},{url:"app/examples/default-component.css",revision:"fab25e621a552f6009b17f494305f723"},{url:"app/examples/default-component.html",revision:"aa5ff0eb86ede6142c6a4f4933a928f8"},{url:"app/examples/default-component.js",revision:"4bd425e89334935df53a1789a4dd6e78"},{url:"app/examples/new-component.css",revision:"2cc0fbc0683255a885678944443c7485"},{url:"app/examples/new-component.html",revision:"613d5e1a637a85199e1fef8017b38ca9"},{url:"app/examples/new-component.js",revision:"f99ff997e1d113ca735299fb5f936553"},{url:"app/templates/mdl_card.css",revision:"e3fe0daa1c045731171a498dc922f092"},{url:"app/templates/mdl_card.html",revision:"8f4162c548d4eb34d2e592c499f31aa0"},{url:"app/templates/mdl-card.css",revision:"e3fe0daa1c045731171a498dc922f092"},{url:"app/templates/mdl-card.html",revision:"8f4162c548d4eb34d2e592c499f31aa0"},{url:"app/widgets/analog-clock.css",revision:"c14d980e48af8e7dca858e1c80461ce9"},{url:"app/widgets/analog-clock.html",revision:"705d36dcc9859aea3435e71ee51faa9c"},{url:"app/widgets/analog-clock.js",revision:"31f7d503d0db768a3e9d5a1665776365"},{url:"app/widgets/analog-clock.module.js",revision:"b2931cb52a3efcecea449b51e636ac7e"},{url:"app/widgets/time-clock.css",revision:"187e7e955c1e4009eb97f280ce082bcc"},{url:"app/widgets/time-clock.html",revision:"921217aece98231bb9b573093065faa2"},{url:"app/widgets/time-clock.js",revision:"6a322e9270fdf2173ee183543e8d9ada"},{url:"app/widgets/time-clock.module.js",revision:"f5e1725788c2a89c8ccb4be0921f77ae"},{url:"config.js",revision:"fd12f789d7bdc02c57a5de658862294c"},{url:"css/animate.min.css",revision:"c0be8e53226ac34833fd9b5dbc01ebc5"},{url:"css/fla/flex-layout-attribute.css",revision:"c9bc58fccb5b4c9d1d7a6e76edddffa7"},{url:"css/fla/flex-layout-attribute.min.css",revision:"c55488315343d9afb4d13ebf9cc8f97b"},{url:"css/prism.css",revision:"8957823dd78e6a4fb2110dd7e605029a"},{url:"index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"index.html",revision:"a8fb9ae6aa80559b3004589f3ccb2b3b"},{url:"js/fuse/fuse.basic.common.js",revision:"ab3ef0028c8992d0098b5b836874291a"},{url:"js/fuse/fuse.basic.esm.js",revision:"0cd240af452625e49deed3ee2445aba6"},{url:"js/fuse/fuse.basic.esm.min.js",revision:"f79f602fa4572cd580786923ce942b6c"},{url:"js/fuse/fuse.basic.js",revision:"6c4923a67225dd64e42600c578d8ff0f"},{url:"js/fuse/fuse.basic.min.js",revision:"62465d50492b6d1bfbbd0e5f9a09b222"},{url:"js/fuse/fuse.common.js",revision:"ddbe097989e19bf1872f533cbc363f1b"},{url:"js/fuse/fuse.esm.js",revision:"82bbf2ed8ece715c58afe6c75977795f"},{url:"js/fuse/fuse.esm.min.js",revision:"589223b029350d512db61a8f323ce0fe"},{url:"js/fuse/fuse.js",revision:"7e19f88c4b2a7c038943bf3b4a17986f"},{url:"js/fuse/fuse.min.js",revision:"de7d60e4a6881074275feca14b84a49d"},{url:"js/mdl/material.custom-theme.min.css",revision:"2225850a6b445fd37acf50466f50c4b5"},{url:"js/mdl/material.min.css",revision:"9ab85b48144d24908b4e455c2afb648c"},{url:"js/mdl/material.min.js",revision:"8dbb84e1d015cd5c2f5be1064eb924b3"},{url:"js/zuix/zuix-bundler.js",revision:"00ed03895f615ebd2fb0b3f0bec994d8"},{url:"js/zuix/zuix-bundler.min.js",revision:"df3c39916f2fe1f0fab80b2f5c479695"},{url:"js/zuix/zuix-bundler.module.js",revision:"134de25f07b5a2fb77bd9a963e86b163"},{url:"js/zuix/zuix-bundler.module.min.js",revision:"654a4693e5471230795a0fbbfdab68c7"},{url:"js/zuix/zuix.js",revision:"2d6f8180b7c355b2c86be58bbf0a16c4"},{url:"js/zuix/zuix.min.js",revision:"2894acdf05ed5e20dcfb25bb8281ea6a"},{url:"js/zuix/zuix.module.js",revision:"ce65c583131528332c7e928d1b0dacd8"},{url:"js/zuix/zuix.module.min.js",revision:"33370a07f10a6afd26ee774ad214a334"},{url:"js/zuix/zx-context.module.js",revision:"8d5f2cabaa0dd997e0493f1d475daa9a"},{url:"manifest.json",revision:"62a5b876bebcc21a7bccd711f8fc6063"},{url:"pages/documentation/about/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/about/index.bundle.js",revision:"093e6602e60179ecba282cbca46d9b68"},{url:"pages/documentation/about/index.html",revision:"0313acf09b6d271c8a4249b170b6ee3b"},{url:"pages/documentation/active_refresh/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/active_refresh/index.bundle.js",revision:"5da77ec8c5ba0e4ea8f73e7a54ce42d5"},{url:"pages/documentation/active_refresh/index.html",revision:"5842796f08bc657c09a99427e9398a90"},{url:"pages/documentation/api/helpers/Logger/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/api/helpers/Logger/index.bundle.js",revision:"093e6602e60179ecba282cbca46d9b68"},{url:"pages/documentation/api/helpers/Logger/index.html",revision:"26d2e5cd2764c88a5cb88081e55f5a2f"},{url:"pages/documentation/api/helpers/TaskQueue/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/api/helpers/TaskQueue/index.bundle.js",revision:"093e6602e60179ecba282cbca46d9b68"},{url:"pages/documentation/api/helpers/TaskQueue/index.html",revision:"46717f5f8ba841ee77cc4017b3eab009"},{url:"pages/documentation/api/helpers/Utils_dom/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/api/helpers/Utils_dom/index.bundle.js",revision:"093e6602e60179ecba282cbca46d9b68"},{url:"pages/documentation/api/helpers/Utils_dom/index.html",revision:"b1a7e78b9f7d2d32c0418e521f8c6bbd"},{url:"pages/documentation/api/helpers/Utils.dom/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/api/helpers/Utils.dom/index.bundle.js",revision:"093e6602e60179ecba282cbca46d9b68"},{url:"pages/documentation/api/helpers/Utils.dom/index.html",revision:"e34b765eb91b0cbf881dc9ef9127256f"},{url:"pages/documentation/api/helpers/Utils/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/api/helpers/Utils/index.bundle.js",revision:"093e6602e60179ecba282cbca46d9b68"},{url:"pages/documentation/api/helpers/Utils/index.html",revision:"cdca49148d8084f874baaaf9ca557441"},{url:"pages/documentation/api/helpers/ZxQuery/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/api/helpers/ZxQuery/index.bundle.js",revision:"093e6602e60179ecba282cbca46d9b68"},{url:"pages/documentation/api/helpers/ZxQuery/index.html",revision:"179355336bc07cc0ee3111d5f599bc1f"},{url:"pages/documentation/api/helpers/ZxQueryStatic/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/api/helpers/ZxQueryStatic/index.bundle.js",revision:"093e6602e60179ecba282cbca46d9b68"},{url:"pages/documentation/api/helpers/ZxQueryStatic/index.html",revision:"f951c0a634d9ee44b53cc90421e32811"},{url:"pages/documentation/api/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/api/index.bundle.js",revision:"093e6602e60179ecba282cbca46d9b68"},{url:"pages/documentation/api/index.html",revision:"5b10021c2f0b0716b7f180d643409f95"},{url:"pages/documentation/api/localizer/Localizer/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/api/localizer/Localizer/index.bundle.js",revision:"093e6602e60179ecba282cbca46d9b68"},{url:"pages/documentation/api/localizer/Localizer/index.html",revision:"f1aa9a7f39d28731fbf5f3565bb957b8"},{url:"pages/documentation/api/observable/ObjectObserver/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/api/observable/ObjectObserver/index.bundle.js",revision:"093e6602e60179ecba282cbca46d9b68"},{url:"pages/documentation/api/observable/ObjectObserver/index.html",revision:"814f1638867204afd423d293302d3be6"},{url:"pages/documentation/api/observable/ObservableListener/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/api/observable/ObservableListener/index.bundle.js",revision:"093e6602e60179ecba282cbca46d9b68"},{url:"pages/documentation/api/observable/ObservableListener/index.html",revision:"0d1348963aa62b91188ebe3edc71e128"},{url:"pages/documentation/api/observable/ObservableObject/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/api/observable/ObservableObject/index.bundle.js",revision:"093e6602e60179ecba282cbca46d9b68"},{url:"pages/documentation/api/observable/ObservableObject/index.html",revision:"aeb6196214419405756f208771d5e5b6"},{url:"pages/documentation/api/zuix/ActiveRefresh/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/api/zuix/ActiveRefresh/index.bundle.js",revision:"093e6602e60179ecba282cbca46d9b68"},{url:"pages/documentation/api/zuix/ActiveRefresh/index.html",revision:"0b09da9b4069ad6ce66cde6e31ed6b42"},{url:"pages/documentation/api/zuix/ComponentContext/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/api/zuix/ComponentContext/index.bundle.js",revision:"093e6602e60179ecba282cbca46d9b68"},{url:"pages/documentation/api/zuix/ComponentContext/index.html",revision:"3ad4d6e93aae719a9e20393a4dc0f84c"},{url:"pages/documentation/api/zuix/Componentizer/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/api/zuix/Componentizer/index.bundle.js",revision:"093e6602e60179ecba282cbca46d9b68"},{url:"pages/documentation/api/zuix/Componentizer/index.html",revision:"e27ddf7b6f7be86f8c93852111173135"},{url:"pages/documentation/api/zuix/ContextController/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/api/zuix/ContextController/index.bundle.js",revision:"093e6602e60179ecba282cbca46d9b68"},{url:"pages/documentation/api/zuix/ContextController/index.html",revision:"a57e510002514660dbc59b41e0cc9a88"},{url:"pages/documentation/api/zuix/ControllerInstance/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/api/zuix/ControllerInstance/index.bundle.js",revision:"093e6602e60179ecba282cbca46d9b68"},{url:"pages/documentation/api/zuix/ControllerInstance/index.html",revision:"407c3fe05925325a9938b9ddf248f09b"},{url:"pages/documentation/api/zuix/ViewObserver/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/api/zuix/ViewObserver/index.bundle.js",revision:"093e6602e60179ecba282cbca46d9b68"},{url:"pages/documentation/api/zuix/ViewObserver/index.html",revision:"80408a86bbefd13905a7533cf6b7403d"},{url:"pages/documentation/api/zuix/Zuix/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/api/zuix/Zuix/index.bundle.js",revision:"ca0e03f95e17178eb6e880324fc79124"},{url:"pages/documentation/api/zuix/Zuix/index.html",revision:"6e3753fb72ffc6abe280dafea4de1604"},{url:"pages/documentation/basic_concepts/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/basic_concepts/index.bundle.js",revision:"093e6602e60179ecba282cbca46d9b68"},{url:"pages/documentation/basic_concepts/index.html",revision:"e30d0d1c473011009e39c22a031c898c"},{url:"pages/documentation/cli/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/cli/index.bundle.js",revision:"093e6602e60179ecba282cbca46d9b68"},{url:"pages/documentation/cli/index.html",revision:"c1f2119533328b521643d260e8f4c17b"},{url:"pages/documentation/component/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/component/index.bundle.js",revision:"a04a536692ef1c77c49124c772a62c73"},{url:"pages/documentation/component/index.html",revision:"4881308501fdfd6e59df8aab9bb2f53e"},{url:"pages/documentation/context_options/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/context_options/index.bundle.js",revision:"27881f7c5b192f1f8f19bd164fd85fce"},{url:"pages/documentation/context_options/index.html",revision:"16f879008f97f3331615a40e00005802"},{url:"pages/documentation/controller/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/controller/index.bundle.js",revision:"7b426c745ae0d77a5acca1649b37cda5"},{url:"pages/documentation/controller/index.html",revision:"1502d80105e7f0227b599c656d21d284"},{url:"pages/documentation/getting_started/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/getting_started/index.bundle.js",revision:"093e6602e60179ecba282cbca46d9b68"},{url:"pages/documentation/getting_started/index.html",revision:"d6c48b41efc5c04a9fbaee5c37a48a0b"},{url:"pages/documentation/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/index.bundle.js",revision:"093e6602e60179ecba282cbca46d9b68"},{url:"pages/documentation/index.html",revision:"8accf3a6321808e678901fcc0e8091eb"},{url:"pages/documentation/view/CheckValidityBehavior.js",revision:"ab85e19fbf7c513b7d6bf2d2f756eff0"},{url:"pages/documentation/view/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/view/index.bundle.js",revision:"85c38c2041f7f75785ad5209aedb30b7"},{url:"pages/documentation/view/index.html",revision:"21e2b06cdec6c1843856a18576728e87"},{url:"pages/documentation/view/ViewSwitchBehavior.js",revision:"6568e13a81727f9347b65a41952a3b84"},{url:"playground/index.bundle.ext.js",revision:"9f0b532d7d1c21c1a62aa00b3224fdc0"},{url:"playground/index.bundle.js",revision:"12005f5d3fbfc1a05ec39fdfd3db2d1b"},{url:"playground/index.html",revision:"214554fe06e6cee5b383966024e91376"},{url:"search-index.json",revision:"f81dd48b7ff84a73cd119c36e10499a9"},{url:"search-list.json",revision:"6dc7c00e053b034fbd9e7b4c8bf0f68f"},{url:"search/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"search/index.bundle.js",revision:"92329ec58632a4d18110265a9a696d05"},{url:"search/index.html",revision:"f45c1f8f18267d511b1a48c8da3cb3b8"},{url:"app/content/docs/examples/alice/img/ch_1_1.png",revision:"f13e634f4f4767f426a791ddf85ba9b0"},{url:"app/content/docs/examples/alice/img/ch_1_2.png",revision:"a40e24033ce25edb5169d5f50a1783d7"},{url:"app/content/docs/examples/alice/img/ch_1_3.png",revision:"9325671498a60f3e05c6bfdcb6001bac"},{url:"app/content/docs/examples/alice/img/ch_2_1.png",revision:"ffd9b2ce17eb5cf4b6e0c2e88128e7bc"},{url:"app/content/docs/examples/alice/img/ch_2_2.png",revision:"c0aa4864727b53a82614fb098c286bca"},{url:"app/content/docs/examples/alice/img/ch_2_3.png",revision:"45b8f2b32fa463cbbf478693354bb676"},{url:"app/content/docs/examples/alice/img/ch_2_4.png",revision:"5175980071714ec946d815b4180b23bc"},{url:"app/content/docs/examples/alice/img/ch_3_1.png",revision:"0b58afb90669a0c00dd796f64872b141"},{url:"app/content/docs/examples/alice/img/ch_3_2.png",revision:"6f21a396f2c8b7f3a5a884dc9a8932c0"},{url:"app/content/docs/examples/images/avatar_00.png",revision:"1a565667c6cf7310db22762e8385f396"},{url:"app/content/docs/examples/images/avatar_01.png",revision:"8b86e5f8249828163a0d7e9f6d315dce"},{url:"app/content/docs/examples/images/avatar_02.png",revision:"8a011d6e36c3b968241ac4331cd03aad"},{url:"app/content/docs/examples/images/avatar_03.png",revision:"57f804786860e3d1166d0905651efed2"},{url:"app/content/docs/examples/images/card_cover_2.jpg",revision:"36c8155fd8a8504c3c49aecc3a2f1426"},{url:"app/content/docs/examples/images/card_cover_3.jpg",revision:"018aa09363578ced3cac25fc174e2d97"},{url:"app/content/docs/examples/images/card_cover_4.jpg",revision:"17458ae6c0f602d385272776d07e2b79"},{url:"app/content/docs/examples/images/card_cover.jpg",revision:"056b0eb64ac30441bd6aca8e3798286b"},{url:"app/content/docs/examples/images/card_placeholder.jpg",revision:"d4969877fffc05adb98477330588dfb4"},{url:"app/content/docs/examples/images/cover_javascript.jpg",revision:"210c83cdaafae6be05c8fbb4cb4accc3"},{url:"app/content/docs/examples/images/cover_recipes.jpg",revision:"6b19a1781bc4e0ca2d71e843ec7ad38e"},{url:"images/examples/clock.png",revision:"ed8359352f4562f7b229ccc5e544fa4e"},{url:"images/github-mark-light.png",revision:"eb94bb97c3410733ce017b184d314723"},{url:"images/github-mark.png",revision:"add1026fb07009c6879400cbcf145301"},{url:"images/icons/desktop/android-chrome-192x192.png",revision:"93d5e77e9ee1e9c6975f3c0bd1a21574"},{url:"images/icons/desktop/android-chrome-512x512.png",revision:"6df83c6c13be17a2ea70d29e340c5ddb"},{url:"images/icons/desktop/apple-touch-icon.png",revision:"2b78ed332644d19d9779c069c5842538"},{url:"images/icons/desktop/favicon-16x16.png",revision:"6c047cdbd3d5c4c962a3a692a5025d27"},{url:"images/icons/desktop/favicon-32x32.png",revision:"7413528d5e59c22af1ccf38187bc950b"},{url:"images/icons/desktop/mstile-150x150.png",revision:"540caa78f56655281b2d4b17ad52f2ce"},{url:"images/icons/desktop/safari-pinned-tab.svg",revision:"a0ab2c612c6a5019b3e4ae7c38043b98"},{url:"images/icons/icon-128x128.png",revision:"69f3f1f3f956bb71f35ce66b7717e1a0"},{url:"images/icons/icon-144x144.png",revision:"45e24db8671c41ca95c440df0cadf2a3"},{url:"images/icons/icon-152x152.png",revision:"e0867fd6e9bc25afd831b1eabdd83f8d"},{url:"images/icons/icon-192x192.png",revision:"cf383c3d4500d31884326cc9d53a8c3a"},{url:"images/icons/icon-384x384.png",revision:"31fd304cf6c5ff72928b7a91fbd68343"},{url:"images/icons/icon-512x512.png",revision:"47d9af0508ab29138dcb8ca6a4664cf2"},{url:"images/icons/icon-72x72.png",revision:"919cb6b3e8a1b5d0c963921dba0e4388"},{url:"images/icons/icon-96x96.png",revision:"5547ad1a33334c0f5c04f6de1f6d2c52"},{url:"images/patreon.png",revision:"138534b06fe107c864e576d63273cf75"},{url:"images/profile-icon.png",revision:"b4e6fa3d09388123298958c47aeb13ca"},{url:"images/rss-feed.png",revision:"fa5663a3878814bb9820de6b29005169"},{url:"images/zuix-logo.svg",revision:"48e6defd57440a6d0f0d12241ff9d6c5"}],{}),e.registerRoute(/\.(?:png|jpg|jpeg|svg)$/,new e.CacheFirst({cacheName:"images",plugins:[new e.ExpirationPlugin({maxEntries:50})]}),"GET"),e.registerRoute(/\.(?:html|json|js|css)$/,new e.CacheFirst({cacheName:"default",plugins:[new e.ExpirationPlugin({maxEntries:50})]}),"GET")}));
+if(!self.define){let e,i={};const a=(a,n)=>(a=new URL(a+".js",n).href,i[a]||new Promise((i=>{if("document"in self){const e=document.createElement("script");e.src=a,e.onload=i,document.head.appendChild(e)}else e=a,importScripts(a),i()})).then((()=>{let e=i[a];if(!e)throw new Error(`Module ${a} didn’t register its module`);return e})));self.define=(n,c)=>{const s=e||("document"in self?document.currentScript.src:"")||location.href;if(i[s])return;let d={};const o=e=>a(e,s),r={module:{uri:s},exports:d,require:o};i[s]=Promise.all(n.map((e=>r[e]||o(e)))).then((e=>(c(...e),d)))}}define(["./workbox-15047ba7"],(function(e){"use strict";self.addEventListener("message",(e=>{e.data&&"SKIP_WAITING"===e.data.type&&self.skipWaiting()})),e.precacheAndRoute([{url:"app/content/docs/examples/alice/ch_1.html",revision:"7bdba3c49c7bb2e4cc412e7791c6e771"},{url:"app/content/docs/examples/alice/ch_2.html",revision:"ccfe438dd4542451bcdabf93ec332847"},{url:"app/content/docs/examples/alice/ch_3.html",revision:"eb43ef576cd0d1c6a85e2413870f34dc"},{url:"app/content/docs/examples/links.css",revision:"300f68df4ae2415d93a52a566b256dbf"},{url:"app/content/docs/examples/links.html",revision:"cbd247603f5f438b7c760f4fdc77cf50"},{url:"app/controllers/component-test.es5.js",revision:"4315ce75c388c30d6e5b42520e5eb6eb"},{url:"app/examples/custom-elements-01.css",revision:"d9d625f90e36313e16428a7f182dbedb"},{url:"app/examples/custom-elements-01.html",revision:"68a64fc6d107c1ce892ec39a4a079768"},{url:"app/examples/custom-elements-01.js",revision:"3bda6a343eb5a68b88ced3007b4a0072"},{url:"app/examples/custom-elements-02.css",revision:"c3c565061953830904559b9616dea61c"},{url:"app/examples/custom-elements-02.html",revision:"38be43f8d48cbf1dc9cb31300c343ae9"},{url:"app/examples/custom-elements-02.js",revision:"f15a071167478bcdba0420f3f789edf7"},{url:"app/examples/default-component.css",revision:"fab25e621a552f6009b17f494305f723"},{url:"app/examples/default-component.html",revision:"aa5ff0eb86ede6142c6a4f4933a928f8"},{url:"app/examples/default-component.js",revision:"4bd425e89334935df53a1789a4dd6e78"},{url:"app/examples/new-component.css",revision:"2cc0fbc0683255a885678944443c7485"},{url:"app/examples/new-component.html",revision:"613d5e1a637a85199e1fef8017b38ca9"},{url:"app/examples/new-component.js",revision:"f99ff997e1d113ca735299fb5f936553"},{url:"app/templates/mdl_card.css",revision:"e3fe0daa1c045731171a498dc922f092"},{url:"app/templates/mdl_card.html",revision:"8f4162c548d4eb34d2e592c499f31aa0"},{url:"app/templates/mdl-card.css",revision:"e3fe0daa1c045731171a498dc922f092"},{url:"app/templates/mdl-card.html",revision:"8f4162c548d4eb34d2e592c499f31aa0"},{url:"app/widgets/analog-clock.css",revision:"c14d980e48af8e7dca858e1c80461ce9"},{url:"app/widgets/analog-clock.html",revision:"705d36dcc9859aea3435e71ee51faa9c"},{url:"app/widgets/analog-clock.js",revision:"31f7d503d0db768a3e9d5a1665776365"},{url:"app/widgets/analog-clock.module.js",revision:"b2931cb52a3efcecea449b51e636ac7e"},{url:"app/widgets/time-clock.css",revision:"187e7e955c1e4009eb97f280ce082bcc"},{url:"app/widgets/time-clock.html",revision:"921217aece98231bb9b573093065faa2"},{url:"app/widgets/time-clock.js",revision:"6a322e9270fdf2173ee183543e8d9ada"},{url:"app/widgets/time-clock.module.js",revision:"f5e1725788c2a89c8ccb4be0921f77ae"},{url:"config.js",revision:"fd12f789d7bdc02c57a5de658862294c"},{url:"css/animate.min.css",revision:"c0be8e53226ac34833fd9b5dbc01ebc5"},{url:"css/fla/flex-layout-attribute.css",revision:"c9bc58fccb5b4c9d1d7a6e76edddffa7"},{url:"css/fla/flex-layout-attribute.min.css",revision:"c55488315343d9afb4d13ebf9cc8f97b"},{url:"css/prism.css",revision:"8957823dd78e6a4fb2110dd7e605029a"},{url:"index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"index.html",revision:"a8fb9ae6aa80559b3004589f3ccb2b3b"},{url:"js/fuse/fuse.basic.common.js",revision:"ab3ef0028c8992d0098b5b836874291a"},{url:"js/fuse/fuse.basic.esm.js",revision:"0cd240af452625e49deed3ee2445aba6"},{url:"js/fuse/fuse.basic.esm.min.js",revision:"f79f602fa4572cd580786923ce942b6c"},{url:"js/fuse/fuse.basic.js",revision:"6c4923a67225dd64e42600c578d8ff0f"},{url:"js/fuse/fuse.basic.min.js",revision:"62465d50492b6d1bfbbd0e5f9a09b222"},{url:"js/fuse/fuse.common.js",revision:"ddbe097989e19bf1872f533cbc363f1b"},{url:"js/fuse/fuse.esm.js",revision:"82bbf2ed8ece715c58afe6c75977795f"},{url:"js/fuse/fuse.esm.min.js",revision:"589223b029350d512db61a8f323ce0fe"},{url:"js/fuse/fuse.js",revision:"7e19f88c4b2a7c038943bf3b4a17986f"},{url:"js/fuse/fuse.min.js",revision:"de7d60e4a6881074275feca14b84a49d"},{url:"js/mdl/material.custom-theme.min.css",revision:"2225850a6b445fd37acf50466f50c4b5"},{url:"js/mdl/material.min.css",revision:"9ab85b48144d24908b4e455c2afb648c"},{url:"js/mdl/material.min.js",revision:"8dbb84e1d015cd5c2f5be1064eb924b3"},{url:"js/zuix/zuix-bundler.js",revision:"00ed03895f615ebd2fb0b3f0bec994d8"},{url:"js/zuix/zuix-bundler.min.js",revision:"df3c39916f2fe1f0fab80b2f5c479695"},{url:"js/zuix/zuix-bundler.module.js",revision:"134de25f07b5a2fb77bd9a963e86b163"},{url:"js/zuix/zuix-bundler.module.min.js",revision:"654a4693e5471230795a0fbbfdab68c7"},{url:"js/zuix/zuix.js",revision:"2d6f8180b7c355b2c86be58bbf0a16c4"},{url:"js/zuix/zuix.min.js",revision:"2894acdf05ed5e20dcfb25bb8281ea6a"},{url:"js/zuix/zuix.module.js",revision:"ce65c583131528332c7e928d1b0dacd8"},{url:"js/zuix/zuix.module.min.js",revision:"33370a07f10a6afd26ee774ad214a334"},{url:"js/zuix/zx-context.module.js",revision:"8d5f2cabaa0dd997e0493f1d475daa9a"},{url:"manifest.json",revision:"62a5b876bebcc21a7bccd711f8fc6063"},{url:"pages/documentation/about/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/about/index.bundle.js",revision:"093e6602e60179ecba282cbca46d9b68"},{url:"pages/documentation/about/index.html",revision:"69a4879dbf279021f320e6d8e6b26973"},{url:"pages/documentation/active_refresh/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/active_refresh/index.bundle.js",revision:"5da77ec8c5ba0e4ea8f73e7a54ce42d5"},{url:"pages/documentation/active_refresh/index.html",revision:"5ec14ce6f64197f84e978c8e0d5bcea7"},{url:"pages/documentation/api/helpers/Logger/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/api/helpers/Logger/index.bundle.js",revision:"093e6602e60179ecba282cbca46d9b68"},{url:"pages/documentation/api/helpers/Logger/index.html",revision:"b0814e97e261091dd8726fe1a3421e72"},{url:"pages/documentation/api/helpers/TaskQueue/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/api/helpers/TaskQueue/index.bundle.js",revision:"093e6602e60179ecba282cbca46d9b68"},{url:"pages/documentation/api/helpers/TaskQueue/index.html",revision:"d8da6d8e79150db384e0a0c1b592a244"},{url:"pages/documentation/api/helpers/Utils_dom/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/api/helpers/Utils_dom/index.bundle.js",revision:"093e6602e60179ecba282cbca46d9b68"},{url:"pages/documentation/api/helpers/Utils_dom/index.html",revision:"68895ed2109e8135ede3edaccd176219"},{url:"pages/documentation/api/helpers/Utils.dom/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/api/helpers/Utils.dom/index.bundle.js",revision:"093e6602e60179ecba282cbca46d9b68"},{url:"pages/documentation/api/helpers/Utils.dom/index.html",revision:"18fe51873203406b71b1103ec7392f85"},{url:"pages/documentation/api/helpers/Utils/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/api/helpers/Utils/index.bundle.js",revision:"093e6602e60179ecba282cbca46d9b68"},{url:"pages/documentation/api/helpers/Utils/index.html",revision:"8154fa8dbcbd348cd34fc6b855e8c11d"},{url:"pages/documentation/api/helpers/ZxQuery/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/api/helpers/ZxQuery/index.bundle.js",revision:"093e6602e60179ecba282cbca46d9b68"},{url:"pages/documentation/api/helpers/ZxQuery/index.html",revision:"2290fc7ba07bb6f4924f1f141e2f62b4"},{url:"pages/documentation/api/helpers/ZxQueryStatic/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/api/helpers/ZxQueryStatic/index.bundle.js",revision:"093e6602e60179ecba282cbca46d9b68"},{url:"pages/documentation/api/helpers/ZxQueryStatic/index.html",revision:"1892989bfd8a96b975c3ed9c6421704f"},{url:"pages/documentation/api/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/api/index.bundle.js",revision:"093e6602e60179ecba282cbca46d9b68"},{url:"pages/documentation/api/index.html",revision:"ef8a41a21016b450e06b89d2e49d6b5b"},{url:"pages/documentation/api/localizer/Localizer/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/api/localizer/Localizer/index.bundle.js",revision:"093e6602e60179ecba282cbca46d9b68"},{url:"pages/documentation/api/localizer/Localizer/index.html",revision:"749eac40adb8c8301aeb4e06188c8c9c"},{url:"pages/documentation/api/observable/ObjectObserver/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/api/observable/ObjectObserver/index.bundle.js",revision:"093e6602e60179ecba282cbca46d9b68"},{url:"pages/documentation/api/observable/ObjectObserver/index.html",revision:"637685fd69170108706ba472b6ce973e"},{url:"pages/documentation/api/observable/ObservableListener/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/api/observable/ObservableListener/index.bundle.js",revision:"093e6602e60179ecba282cbca46d9b68"},{url:"pages/documentation/api/observable/ObservableListener/index.html",revision:"c7fab9c9417dd47d924c415d9d8ff72a"},{url:"pages/documentation/api/observable/ObservableObject/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/api/observable/ObservableObject/index.bundle.js",revision:"093e6602e60179ecba282cbca46d9b68"},{url:"pages/documentation/api/observable/ObservableObject/index.html",revision:"c78c3723487d6f26d79e9e6be0b8c7f7"},{url:"pages/documentation/api/zuix/ActiveRefresh/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/api/zuix/ActiveRefresh/index.bundle.js",revision:"093e6602e60179ecba282cbca46d9b68"},{url:"pages/documentation/api/zuix/ActiveRefresh/index.html",revision:"9a85aec93c715fb340978a45dc7ca0d2"},{url:"pages/documentation/api/zuix/ComponentContext/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/api/zuix/ComponentContext/index.bundle.js",revision:"093e6602e60179ecba282cbca46d9b68"},{url:"pages/documentation/api/zuix/ComponentContext/index.html",revision:"e8dfbe453cbb1d1e94ea5937759e3234"},{url:"pages/documentation/api/zuix/Componentizer/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/api/zuix/Componentizer/index.bundle.js",revision:"093e6602e60179ecba282cbca46d9b68"},{url:"pages/documentation/api/zuix/Componentizer/index.html",revision:"9f029851e07bc03fa057e717769d2597"},{url:"pages/documentation/api/zuix/ContextController/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/api/zuix/ContextController/index.bundle.js",revision:"093e6602e60179ecba282cbca46d9b68"},{url:"pages/documentation/api/zuix/ContextController/index.html",revision:"8006746eee5cc37a6ae10ff6d5eb2d58"},{url:"pages/documentation/api/zuix/ControllerInstance/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/api/zuix/ControllerInstance/index.bundle.js",revision:"093e6602e60179ecba282cbca46d9b68"},{url:"pages/documentation/api/zuix/ControllerInstance/index.html",revision:"bbf11d291acdb377f5486d2678b7f490"},{url:"pages/documentation/api/zuix/ViewObserver/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/api/zuix/ViewObserver/index.bundle.js",revision:"093e6602e60179ecba282cbca46d9b68"},{url:"pages/documentation/api/zuix/ViewObserver/index.html",revision:"7e47d302a36743313c7ed43ea4ce6f61"},{url:"pages/documentation/api/zuix/Zuix/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/api/zuix/Zuix/index.bundle.js",revision:"ca0e03f95e17178eb6e880324fc79124"},{url:"pages/documentation/api/zuix/Zuix/index.html",revision:"8a724dddbf48267b8fe452ca7f236d5b"},{url:"pages/documentation/basic_concepts/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/basic_concepts/index.bundle.js",revision:"093e6602e60179ecba282cbca46d9b68"},{url:"pages/documentation/basic_concepts/index.html",revision:"894f9145f6c8617cf770758df96aef12"},{url:"pages/documentation/cli/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/cli/index.bundle.js",revision:"093e6602e60179ecba282cbca46d9b68"},{url:"pages/documentation/cli/index.html",revision:"23816c724223f33d1261e8de3c9ce1db"},{url:"pages/documentation/component/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/component/index.bundle.js",revision:"a04a536692ef1c77c49124c772a62c73"},{url:"pages/documentation/component/index.html",revision:"e4df71695c630d07e31da203418c2ec3"},{url:"pages/documentation/context_options/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/context_options/index.bundle.js",revision:"27881f7c5b192f1f8f19bd164fd85fce"},{url:"pages/documentation/context_options/index.html",revision:"922e6488ad37673056ab1a85e14d730d"},{url:"pages/documentation/controller/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/controller/index.bundle.js",revision:"7b426c745ae0d77a5acca1649b37cda5"},{url:"pages/documentation/controller/index.html",revision:"ade3b3961232fcc2b6e50dfab3e88849"},{url:"pages/documentation/getting_started/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/getting_started/index.bundle.js",revision:"093e6602e60179ecba282cbca46d9b68"},{url:"pages/documentation/getting_started/index.html",revision:"34e58cac164a3aff35249602fcb7612b"},{url:"pages/documentation/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/index.bundle.js",revision:"093e6602e60179ecba282cbca46d9b68"},{url:"pages/documentation/index.html",revision:"9122e60886cbcf9fa9dc8e4d683b7b92"},{url:"pages/documentation/view/CheckValidityBehavior.js",revision:"ab85e19fbf7c513b7d6bf2d2f756eff0"},{url:"pages/documentation/view/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"pages/documentation/view/index.bundle.js",revision:"85c38c2041f7f75785ad5209aedb30b7"},{url:"pages/documentation/view/index.html",revision:"4f4cd17f64b56a715ab20a6cda018624"},{url:"pages/documentation/view/ViewSwitchBehavior.js",revision:"6568e13a81727f9347b65a41952a3b84"},{url:"playground/index.bundle.ext.js",revision:"9f0b532d7d1c21c1a62aa00b3224fdc0"},{url:"playground/index.bundle.js",revision:"12005f5d3fbfc1a05ec39fdfd3db2d1b"},{url:"playground/index.html",revision:"04c5debb69c5d5d601d45477e3eb61cc"},{url:"search-index.json",revision:"86f5fde47c41af20ddaf60f8ccd02e1b"},{url:"search-list.json",revision:"41a4b039c66d3bf318985558799253f9"},{url:"search/index.bundle.ext.js",revision:"044b01ed45a9d7e3af77f49975e8f0ec"},{url:"search/index.bundle.js",revision:"92329ec58632a4d18110265a9a696d05"},{url:"search/index.html",revision:"a91aaa4f5dd183c3e5ac87cdcaba02b5"},{url:"app/content/docs/examples/alice/img/ch_1_1.png",revision:"f13e634f4f4767f426a791ddf85ba9b0"},{url:"app/content/docs/examples/alice/img/ch_1_2.png",revision:"a40e24033ce25edb5169d5f50a1783d7"},{url:"app/content/docs/examples/alice/img/ch_1_3.png",revision:"9325671498a60f3e05c6bfdcb6001bac"},{url:"app/content/docs/examples/alice/img/ch_2_1.png",revision:"ffd9b2ce17eb5cf4b6e0c2e88128e7bc"},{url:"app/content/docs/examples/alice/img/ch_2_2.png",revision:"c0aa4864727b53a82614fb098c286bca"},{url:"app/content/docs/examples/alice/img/ch_2_3.png",revision:"45b8f2b32fa463cbbf478693354bb676"},{url:"app/content/docs/examples/alice/img/ch_2_4.png",revision:"5175980071714ec946d815b4180b23bc"},{url:"app/content/docs/examples/alice/img/ch_3_1.png",revision:"0b58afb90669a0c00dd796f64872b141"},{url:"app/content/docs/examples/alice/img/ch_3_2.png",revision:"6f21a396f2c8b7f3a5a884dc9a8932c0"},{url:"app/content/docs/examples/images/avatar_00.png",revision:"1a565667c6cf7310db22762e8385f396"},{url:"app/content/docs/examples/images/avatar_01.png",revision:"8b86e5f8249828163a0d7e9f6d315dce"},{url:"app/content/docs/examples/images/avatar_02.png",revision:"8a011d6e36c3b968241ac4331cd03aad"},{url:"app/content/docs/examples/images/avatar_03.png",revision:"57f804786860e3d1166d0905651efed2"},{url:"app/content/docs/examples/images/card_cover_2.jpg",revision:"36c8155fd8a8504c3c49aecc3a2f1426"},{url:"app/content/docs/examples/images/card_cover_3.jpg",revision:"018aa09363578ced3cac25fc174e2d97"},{url:"app/content/docs/examples/images/card_cover_4.jpg",revision:"17458ae6c0f602d385272776d07e2b79"},{url:"app/content/docs/examples/images/card_cover.jpg",revision:"056b0eb64ac30441bd6aca8e3798286b"},{url:"app/content/docs/examples/images/card_placeholder.jpg",revision:"d4969877fffc05adb98477330588dfb4"},{url:"app/content/docs/examples/images/cover_javascript.jpg",revision:"210c83cdaafae6be05c8fbb4cb4accc3"},{url:"app/content/docs/examples/images/cover_recipes.jpg",revision:"6b19a1781bc4e0ca2d71e843ec7ad38e"},{url:"images/examples/clock.png",revision:"ed8359352f4562f7b229ccc5e544fa4e"},{url:"images/github-mark-light.png",revision:"eb94bb97c3410733ce017b184d314723"},{url:"images/github-mark.png",revision:"add1026fb07009c6879400cbcf145301"},{url:"images/icons/desktop/android-chrome-192x192.png",revision:"93d5e77e9ee1e9c6975f3c0bd1a21574"},{url:"images/icons/desktop/android-chrome-512x512.png",revision:"6df83c6c13be17a2ea70d29e340c5ddb"},{url:"images/icons/desktop/apple-touch-icon.png",revision:"2b78ed332644d19d9779c069c5842538"},{url:"images/icons/desktop/favicon-16x16.png",revision:"6c047cdbd3d5c4c962a3a692a5025d27"},{url:"images/icons/desktop/favicon-32x32.png",revision:"7413528d5e59c22af1ccf38187bc950b"},{url:"images/icons/desktop/mstile-150x150.png",revision:"540caa78f56655281b2d4b17ad52f2ce"},{url:"images/icons/desktop/safari-pinned-tab.svg",revision:"a0ab2c612c6a5019b3e4ae7c38043b98"},{url:"images/icons/icon-128x128.png",revision:"69f3f1f3f956bb71f35ce66b7717e1a0"},{url:"images/icons/icon-144x144.png",revision:"45e24db8671c41ca95c440df0cadf2a3"},{url:"images/icons/icon-152x152.png",revision:"e0867fd6e9bc25afd831b1eabdd83f8d"},{url:"images/icons/icon-192x192.png",revision:"cf383c3d4500d31884326cc9d53a8c3a"},{url:"images/icons/icon-384x384.png",revision:"31fd304cf6c5ff72928b7a91fbd68343"},{url:"images/icons/icon-512x512.png",revision:"47d9af0508ab29138dcb8ca6a4664cf2"},{url:"images/icons/icon-72x72.png",revision:"919cb6b3e8a1b5d0c963921dba0e4388"},{url:"images/icons/icon-96x96.png",revision:"5547ad1a33334c0f5c04f6de1f6d2c52"},{url:"images/patreon.png",revision:"138534b06fe107c864e576d63273cf75"},{url:"images/profile-icon.png",revision:"b4e6fa3d09388123298958c47aeb13ca"},{url:"images/rss-feed.png",revision:"fa5663a3878814bb9820de6b29005169"},{url:"images/zuix-logo.svg",revision:"48e6defd57440a6d0f0d12241ff9d6c5"}],{}),e.registerRoute(/\.(?:png|jpg|jpeg|svg)$/,new e.CacheFirst({cacheName:"images",plugins:[new e.ExpirationPlugin({maxEntries:50})]}),"GET"),e.registerRoute(/\.(?:html|json|js|css)$/,new e.CacheFirst({cacheName:"default",plugins:[new e.ExpirationPlugin({maxEntries:50})]}),"GET")}));
 //# sourceMappingURL=service-worker.js.map
diff --git a/docs/service-worker.js.map b/docs/service-worker.js.map
index b188eb3..f533c74 100644
--- a/docs/service-worker.js.map
+++ b/docs/service-worker.js.map
@@ -1 +1 @@
-{"version":3,"file":"service-worker.js","sources":["../../../../../../../tmp/78b6b6a89b989817458859a26f0a167b/service-worker.js"],"sourcesContent":["import {registerRoute as workbox_routing_registerRoute} from '/media/gene/Archie/work/repositories/zuix/zuixjs.org/node_modules/workbox-routing/registerRoute.mjs';\nimport {ExpirationPlugin as workbox_expiration_ExpirationPlugin} from '/media/gene/Archie/work/repositories/zuix/zuixjs.org/node_modules/workbox-expiration/ExpirationPlugin.mjs';\nimport {CacheFirst as workbox_strategies_CacheFirst} from '/media/gene/Archie/work/repositories/zuix/zuixjs.org/node_modules/workbox-strategies/CacheFirst.mjs';\nimport {precacheAndRoute as workbox_precaching_precacheAndRoute} from '/media/gene/Archie/work/repositories/zuix/zuixjs.org/node_modules/workbox-precaching/precacheAndRoute.mjs';/**\n * Welcome to your Workbox-powered service worker!\n *\n * You'll need to register this file in your web app.\n * See https://goo.gl/nhQhGp\n *\n * The rest of the code is auto-generated. Please don't update this file\n * directly; instead, make changes to your Workbox build configuration\n * and re-run your build process.\n * See https://goo.gl/2aRDsh\n */\n\n\n\n\n\n\n\n\nself.addEventListener('message', (event) => {\n  if (event.data && event.data.type === 'SKIP_WAITING') {\n    self.skipWaiting();\n  }\n});\n\n\n\n\n/**\n * The precacheAndRoute() method efficiently caches and responds to\n * requests for URLs in the manifest.\n * See https://goo.gl/S9QRab\n */\nworkbox_precaching_precacheAndRoute([\n  {\n    \"url\": \"app/content/docs/examples/alice/ch_1.html\",\n    \"revision\": \"7bdba3c49c7bb2e4cc412e7791c6e771\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/alice/ch_2.html\",\n    \"revision\": \"ccfe438dd4542451bcdabf93ec332847\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/alice/ch_3.html\",\n    \"revision\": \"eb43ef576cd0d1c6a85e2413870f34dc\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/links.css\",\n    \"revision\": \"300f68df4ae2415d93a52a566b256dbf\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/links.html\",\n    \"revision\": \"cbd247603f5f438b7c760f4fdc77cf50\"\n  },\n  {\n    \"url\": \"app/controllers/component-test.es5.js\",\n    \"revision\": \"4315ce75c388c30d6e5b42520e5eb6eb\"\n  },\n  {\n    \"url\": \"app/examples/custom-elements-01.css\",\n    \"revision\": \"d9d625f90e36313e16428a7f182dbedb\"\n  },\n  {\n    \"url\": \"app/examples/custom-elements-01.html\",\n    \"revision\": \"68a64fc6d107c1ce892ec39a4a079768\"\n  },\n  {\n    \"url\": \"app/examples/custom-elements-01.js\",\n    \"revision\": \"3bda6a343eb5a68b88ced3007b4a0072\"\n  },\n  {\n    \"url\": \"app/examples/custom-elements-02.css\",\n    \"revision\": \"c3c565061953830904559b9616dea61c\"\n  },\n  {\n    \"url\": \"app/examples/custom-elements-02.html\",\n    \"revision\": \"38be43f8d48cbf1dc9cb31300c343ae9\"\n  },\n  {\n    \"url\": \"app/examples/custom-elements-02.js\",\n    \"revision\": \"f15a071167478bcdba0420f3f789edf7\"\n  },\n  {\n    \"url\": \"app/examples/default-component.css\",\n    \"revision\": \"fab25e621a552f6009b17f494305f723\"\n  },\n  {\n    \"url\": \"app/examples/default-component.html\",\n    \"revision\": \"aa5ff0eb86ede6142c6a4f4933a928f8\"\n  },\n  {\n    \"url\": \"app/examples/default-component.js\",\n    \"revision\": \"4bd425e89334935df53a1789a4dd6e78\"\n  },\n  {\n    \"url\": \"app/examples/new-component.css\",\n    \"revision\": \"2cc0fbc0683255a885678944443c7485\"\n  },\n  {\n    \"url\": \"app/examples/new-component.html\",\n    \"revision\": \"613d5e1a637a85199e1fef8017b38ca9\"\n  },\n  {\n    \"url\": \"app/examples/new-component.js\",\n    \"revision\": \"f99ff997e1d113ca735299fb5f936553\"\n  },\n  {\n    \"url\": \"app/templates/mdl_card.css\",\n    \"revision\": \"e3fe0daa1c045731171a498dc922f092\"\n  },\n  {\n    \"url\": \"app/templates/mdl_card.html\",\n    \"revision\": \"8f4162c548d4eb34d2e592c499f31aa0\"\n  },\n  {\n    \"url\": \"app/templates/mdl-card.css\",\n    \"revision\": \"e3fe0daa1c045731171a498dc922f092\"\n  },\n  {\n    \"url\": \"app/templates/mdl-card.html\",\n    \"revision\": \"8f4162c548d4eb34d2e592c499f31aa0\"\n  },\n  {\n    \"url\": \"app/widgets/analog-clock.css\",\n    \"revision\": \"c14d980e48af8e7dca858e1c80461ce9\"\n  },\n  {\n    \"url\": \"app/widgets/analog-clock.html\",\n    \"revision\": \"705d36dcc9859aea3435e71ee51faa9c\"\n  },\n  {\n    \"url\": \"app/widgets/analog-clock.js\",\n    \"revision\": \"31f7d503d0db768a3e9d5a1665776365\"\n  },\n  {\n    \"url\": \"app/widgets/analog-clock.module.js\",\n    \"revision\": \"b2931cb52a3efcecea449b51e636ac7e\"\n  },\n  {\n    \"url\": \"app/widgets/time-clock.css\",\n    \"revision\": \"187e7e955c1e4009eb97f280ce082bcc\"\n  },\n  {\n    \"url\": \"app/widgets/time-clock.html\",\n    \"revision\": \"921217aece98231bb9b573093065faa2\"\n  },\n  {\n    \"url\": \"app/widgets/time-clock.js\",\n    \"revision\": \"6a322e9270fdf2173ee183543e8d9ada\"\n  },\n  {\n    \"url\": \"app/widgets/time-clock.module.js\",\n    \"revision\": \"f5e1725788c2a89c8ccb4be0921f77ae\"\n  },\n  {\n    \"url\": \"config.js\",\n    \"revision\": \"fd12f789d7bdc02c57a5de658862294c\"\n  },\n  {\n    \"url\": \"css/animate.min.css\",\n    \"revision\": \"c0be8e53226ac34833fd9b5dbc01ebc5\"\n  },\n  {\n    \"url\": \"css/fla/flex-layout-attribute.css\",\n    \"revision\": \"c9bc58fccb5b4c9d1d7a6e76edddffa7\"\n  },\n  {\n    \"url\": \"css/fla/flex-layout-attribute.min.css\",\n    \"revision\": \"c55488315343d9afb4d13ebf9cc8f97b\"\n  },\n  {\n    \"url\": \"css/prism.css\",\n    \"revision\": \"8957823dd78e6a4fb2110dd7e605029a\"\n  },\n  {\n    \"url\": \"index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"index.html\",\n    \"revision\": \"a8fb9ae6aa80559b3004589f3ccb2b3b\"\n  },\n  {\n    \"url\": \"js/fuse/fuse.basic.common.js\",\n    \"revision\": \"ab3ef0028c8992d0098b5b836874291a\"\n  },\n  {\n    \"url\": \"js/fuse/fuse.basic.esm.js\",\n    \"revision\": \"0cd240af452625e49deed3ee2445aba6\"\n  },\n  {\n    \"url\": \"js/fuse/fuse.basic.esm.min.js\",\n    \"revision\": \"f79f602fa4572cd580786923ce942b6c\"\n  },\n  {\n    \"url\": \"js/fuse/fuse.basic.js\",\n    \"revision\": \"6c4923a67225dd64e42600c578d8ff0f\"\n  },\n  {\n    \"url\": \"js/fuse/fuse.basic.min.js\",\n    \"revision\": \"62465d50492b6d1bfbbd0e5f9a09b222\"\n  },\n  {\n    \"url\": \"js/fuse/fuse.common.js\",\n    \"revision\": \"ddbe097989e19bf1872f533cbc363f1b\"\n  },\n  {\n    \"url\": \"js/fuse/fuse.esm.js\",\n    \"revision\": \"82bbf2ed8ece715c58afe6c75977795f\"\n  },\n  {\n    \"url\": \"js/fuse/fuse.esm.min.js\",\n    \"revision\": \"589223b029350d512db61a8f323ce0fe\"\n  },\n  {\n    \"url\": \"js/fuse/fuse.js\",\n    \"revision\": \"7e19f88c4b2a7c038943bf3b4a17986f\"\n  },\n  {\n    \"url\": \"js/fuse/fuse.min.js\",\n    \"revision\": \"de7d60e4a6881074275feca14b84a49d\"\n  },\n  {\n    \"url\": \"js/mdl/material.custom-theme.min.css\",\n    \"revision\": \"2225850a6b445fd37acf50466f50c4b5\"\n  },\n  {\n    \"url\": \"js/mdl/material.min.css\",\n    \"revision\": \"9ab85b48144d24908b4e455c2afb648c\"\n  },\n  {\n    \"url\": \"js/mdl/material.min.js\",\n    \"revision\": \"8dbb84e1d015cd5c2f5be1064eb924b3\"\n  },\n  {\n    \"url\": \"js/zuix/zuix-bundler.js\",\n    \"revision\": \"00ed03895f615ebd2fb0b3f0bec994d8\"\n  },\n  {\n    \"url\": \"js/zuix/zuix-bundler.min.js\",\n    \"revision\": \"df3c39916f2fe1f0fab80b2f5c479695\"\n  },\n  {\n    \"url\": \"js/zuix/zuix-bundler.module.js\",\n    \"revision\": \"134de25f07b5a2fb77bd9a963e86b163\"\n  },\n  {\n    \"url\": \"js/zuix/zuix-bundler.module.min.js\",\n    \"revision\": \"654a4693e5471230795a0fbbfdab68c7\"\n  },\n  {\n    \"url\": \"js/zuix/zuix.js\",\n    \"revision\": \"2d6f8180b7c355b2c86be58bbf0a16c4\"\n  },\n  {\n    \"url\": \"js/zuix/zuix.min.js\",\n    \"revision\": \"2894acdf05ed5e20dcfb25bb8281ea6a\"\n  },\n  {\n    \"url\": \"js/zuix/zuix.module.js\",\n    \"revision\": \"ce65c583131528332c7e928d1b0dacd8\"\n  },\n  {\n    \"url\": \"js/zuix/zuix.module.min.js\",\n    \"revision\": \"33370a07f10a6afd26ee774ad214a334\"\n  },\n  {\n    \"url\": \"js/zuix/zx-context.module.js\",\n    \"revision\": \"8d5f2cabaa0dd997e0493f1d475daa9a\"\n  },\n  {\n    \"url\": \"manifest.json\",\n    \"revision\": \"62a5b876bebcc21a7bccd711f8fc6063\"\n  },\n  {\n    \"url\": \"pages/documentation/about/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/about/index.bundle.js\",\n    \"revision\": \"093e6602e60179ecba282cbca46d9b68\"\n  },\n  {\n    \"url\": \"pages/documentation/about/index.html\",\n    \"revision\": \"0313acf09b6d271c8a4249b170b6ee3b\"\n  },\n  {\n    \"url\": \"pages/documentation/active_refresh/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/active_refresh/index.bundle.js\",\n    \"revision\": \"5da77ec8c5ba0e4ea8f73e7a54ce42d5\"\n  },\n  {\n    \"url\": \"pages/documentation/active_refresh/index.html\",\n    \"revision\": \"5842796f08bc657c09a99427e9398a90\"\n  },\n  {\n    \"url\": \"pages/documentation/api/helpers/Logger/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/api/helpers/Logger/index.bundle.js\",\n    \"revision\": \"093e6602e60179ecba282cbca46d9b68\"\n  },\n  {\n    \"url\": \"pages/documentation/api/helpers/Logger/index.html\",\n    \"revision\": \"26d2e5cd2764c88a5cb88081e55f5a2f\"\n  },\n  {\n    \"url\": \"pages/documentation/api/helpers/TaskQueue/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/api/helpers/TaskQueue/index.bundle.js\",\n    \"revision\": \"093e6602e60179ecba282cbca46d9b68\"\n  },\n  {\n    \"url\": \"pages/documentation/api/helpers/TaskQueue/index.html\",\n    \"revision\": \"46717f5f8ba841ee77cc4017b3eab009\"\n  },\n  {\n    \"url\": \"pages/documentation/api/helpers/Utils_dom/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/api/helpers/Utils_dom/index.bundle.js\",\n    \"revision\": \"093e6602e60179ecba282cbca46d9b68\"\n  },\n  {\n    \"url\": \"pages/documentation/api/helpers/Utils_dom/index.html\",\n    \"revision\": \"b1a7e78b9f7d2d32c0418e521f8c6bbd\"\n  },\n  {\n    \"url\": \"pages/documentation/api/helpers/Utils.dom/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/api/helpers/Utils.dom/index.bundle.js\",\n    \"revision\": \"093e6602e60179ecba282cbca46d9b68\"\n  },\n  {\n    \"url\": \"pages/documentation/api/helpers/Utils.dom/index.html\",\n    \"revision\": \"e34b765eb91b0cbf881dc9ef9127256f\"\n  },\n  {\n    \"url\": \"pages/documentation/api/helpers/Utils/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/api/helpers/Utils/index.bundle.js\",\n    \"revision\": \"093e6602e60179ecba282cbca46d9b68\"\n  },\n  {\n    \"url\": \"pages/documentation/api/helpers/Utils/index.html\",\n    \"revision\": \"cdca49148d8084f874baaaf9ca557441\"\n  },\n  {\n    \"url\": \"pages/documentation/api/helpers/ZxQuery/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/api/helpers/ZxQuery/index.bundle.js\",\n    \"revision\": \"093e6602e60179ecba282cbca46d9b68\"\n  },\n  {\n    \"url\": \"pages/documentation/api/helpers/ZxQuery/index.html\",\n    \"revision\": \"179355336bc07cc0ee3111d5f599bc1f\"\n  },\n  {\n    \"url\": \"pages/documentation/api/helpers/ZxQueryStatic/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/api/helpers/ZxQueryStatic/index.bundle.js\",\n    \"revision\": \"093e6602e60179ecba282cbca46d9b68\"\n  },\n  {\n    \"url\": \"pages/documentation/api/helpers/ZxQueryStatic/index.html\",\n    \"revision\": \"f951c0a634d9ee44b53cc90421e32811\"\n  },\n  {\n    \"url\": \"pages/documentation/api/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/api/index.bundle.js\",\n    \"revision\": \"093e6602e60179ecba282cbca46d9b68\"\n  },\n  {\n    \"url\": \"pages/documentation/api/index.html\",\n    \"revision\": \"5b10021c2f0b0716b7f180d643409f95\"\n  },\n  {\n    \"url\": \"pages/documentation/api/localizer/Localizer/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/api/localizer/Localizer/index.bundle.js\",\n    \"revision\": \"093e6602e60179ecba282cbca46d9b68\"\n  },\n  {\n    \"url\": \"pages/documentation/api/localizer/Localizer/index.html\",\n    \"revision\": \"f1aa9a7f39d28731fbf5f3565bb957b8\"\n  },\n  {\n    \"url\": \"pages/documentation/api/observable/ObjectObserver/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/api/observable/ObjectObserver/index.bundle.js\",\n    \"revision\": \"093e6602e60179ecba282cbca46d9b68\"\n  },\n  {\n    \"url\": \"pages/documentation/api/observable/ObjectObserver/index.html\",\n    \"revision\": \"814f1638867204afd423d293302d3be6\"\n  },\n  {\n    \"url\": \"pages/documentation/api/observable/ObservableListener/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/api/observable/ObservableListener/index.bundle.js\",\n    \"revision\": \"093e6602e60179ecba282cbca46d9b68\"\n  },\n  {\n    \"url\": \"pages/documentation/api/observable/ObservableListener/index.html\",\n    \"revision\": \"0d1348963aa62b91188ebe3edc71e128\"\n  },\n  {\n    \"url\": \"pages/documentation/api/observable/ObservableObject/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/api/observable/ObservableObject/index.bundle.js\",\n    \"revision\": \"093e6602e60179ecba282cbca46d9b68\"\n  },\n  {\n    \"url\": \"pages/documentation/api/observable/ObservableObject/index.html\",\n    \"revision\": \"aeb6196214419405756f208771d5e5b6\"\n  },\n  {\n    \"url\": \"pages/documentation/api/zuix/ActiveRefresh/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/api/zuix/ActiveRefresh/index.bundle.js\",\n    \"revision\": \"093e6602e60179ecba282cbca46d9b68\"\n  },\n  {\n    \"url\": \"pages/documentation/api/zuix/ActiveRefresh/index.html\",\n    \"revision\": \"0b09da9b4069ad6ce66cde6e31ed6b42\"\n  },\n  {\n    \"url\": \"pages/documentation/api/zuix/ComponentContext/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/api/zuix/ComponentContext/index.bundle.js\",\n    \"revision\": \"093e6602e60179ecba282cbca46d9b68\"\n  },\n  {\n    \"url\": \"pages/documentation/api/zuix/ComponentContext/index.html\",\n    \"revision\": \"3ad4d6e93aae719a9e20393a4dc0f84c\"\n  },\n  {\n    \"url\": \"pages/documentation/api/zuix/Componentizer/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/api/zuix/Componentizer/index.bundle.js\",\n    \"revision\": \"093e6602e60179ecba282cbca46d9b68\"\n  },\n  {\n    \"url\": \"pages/documentation/api/zuix/Componentizer/index.html\",\n    \"revision\": \"e27ddf7b6f7be86f8c93852111173135\"\n  },\n  {\n    \"url\": \"pages/documentation/api/zuix/ContextController/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/api/zuix/ContextController/index.bundle.js\",\n    \"revision\": \"093e6602e60179ecba282cbca46d9b68\"\n  },\n  {\n    \"url\": \"pages/documentation/api/zuix/ContextController/index.html\",\n    \"revision\": \"a57e510002514660dbc59b41e0cc9a88\"\n  },\n  {\n    \"url\": \"pages/documentation/api/zuix/ControllerInstance/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/api/zuix/ControllerInstance/index.bundle.js\",\n    \"revision\": \"093e6602e60179ecba282cbca46d9b68\"\n  },\n  {\n    \"url\": \"pages/documentation/api/zuix/ControllerInstance/index.html\",\n    \"revision\": \"407c3fe05925325a9938b9ddf248f09b\"\n  },\n  {\n    \"url\": \"pages/documentation/api/zuix/ViewObserver/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/api/zuix/ViewObserver/index.bundle.js\",\n    \"revision\": \"093e6602e60179ecba282cbca46d9b68\"\n  },\n  {\n    \"url\": \"pages/documentation/api/zuix/ViewObserver/index.html\",\n    \"revision\": \"80408a86bbefd13905a7533cf6b7403d\"\n  },\n  {\n    \"url\": \"pages/documentation/api/zuix/Zuix/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/api/zuix/Zuix/index.bundle.js\",\n    \"revision\": \"ca0e03f95e17178eb6e880324fc79124\"\n  },\n  {\n    \"url\": \"pages/documentation/api/zuix/Zuix/index.html\",\n    \"revision\": \"6e3753fb72ffc6abe280dafea4de1604\"\n  },\n  {\n    \"url\": \"pages/documentation/basic_concepts/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/basic_concepts/index.bundle.js\",\n    \"revision\": \"093e6602e60179ecba282cbca46d9b68\"\n  },\n  {\n    \"url\": \"pages/documentation/basic_concepts/index.html\",\n    \"revision\": \"e30d0d1c473011009e39c22a031c898c\"\n  },\n  {\n    \"url\": \"pages/documentation/cli/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/cli/index.bundle.js\",\n    \"revision\": \"093e6602e60179ecba282cbca46d9b68\"\n  },\n  {\n    \"url\": \"pages/documentation/cli/index.html\",\n    \"revision\": \"c1f2119533328b521643d260e8f4c17b\"\n  },\n  {\n    \"url\": \"pages/documentation/component/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/component/index.bundle.js\",\n    \"revision\": \"a04a536692ef1c77c49124c772a62c73\"\n  },\n  {\n    \"url\": \"pages/documentation/component/index.html\",\n    \"revision\": \"4881308501fdfd6e59df8aab9bb2f53e\"\n  },\n  {\n    \"url\": \"pages/documentation/context_options/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/context_options/index.bundle.js\",\n    \"revision\": \"27881f7c5b192f1f8f19bd164fd85fce\"\n  },\n  {\n    \"url\": \"pages/documentation/context_options/index.html\",\n    \"revision\": \"16f879008f97f3331615a40e00005802\"\n  },\n  {\n    \"url\": \"pages/documentation/controller/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/controller/index.bundle.js\",\n    \"revision\": \"7b426c745ae0d77a5acca1649b37cda5\"\n  },\n  {\n    \"url\": \"pages/documentation/controller/index.html\",\n    \"revision\": \"1502d80105e7f0227b599c656d21d284\"\n  },\n  {\n    \"url\": \"pages/documentation/getting_started/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/getting_started/index.bundle.js\",\n    \"revision\": \"093e6602e60179ecba282cbca46d9b68\"\n  },\n  {\n    \"url\": \"pages/documentation/getting_started/index.html\",\n    \"revision\": \"d6c48b41efc5c04a9fbaee5c37a48a0b\"\n  },\n  {\n    \"url\": \"pages/documentation/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/index.bundle.js\",\n    \"revision\": \"093e6602e60179ecba282cbca46d9b68\"\n  },\n  {\n    \"url\": \"pages/documentation/index.html\",\n    \"revision\": \"8accf3a6321808e678901fcc0e8091eb\"\n  },\n  {\n    \"url\": \"pages/documentation/view/CheckValidityBehavior.js\",\n    \"revision\": \"ab85e19fbf7c513b7d6bf2d2f756eff0\"\n  },\n  {\n    \"url\": \"pages/documentation/view/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/view/index.bundle.js\",\n    \"revision\": \"85c38c2041f7f75785ad5209aedb30b7\"\n  },\n  {\n    \"url\": \"pages/documentation/view/index.html\",\n    \"revision\": \"21e2b06cdec6c1843856a18576728e87\"\n  },\n  {\n    \"url\": \"pages/documentation/view/ViewSwitchBehavior.js\",\n    \"revision\": \"6568e13a81727f9347b65a41952a3b84\"\n  },\n  {\n    \"url\": \"playground/index.bundle.ext.js\",\n    \"revision\": \"9f0b532d7d1c21c1a62aa00b3224fdc0\"\n  },\n  {\n    \"url\": \"playground/index.bundle.js\",\n    \"revision\": \"12005f5d3fbfc1a05ec39fdfd3db2d1b\"\n  },\n  {\n    \"url\": \"playground/index.html\",\n    \"revision\": \"214554fe06e6cee5b383966024e91376\"\n  },\n  {\n    \"url\": \"search-index.json\",\n    \"revision\": \"f81dd48b7ff84a73cd119c36e10499a9\"\n  },\n  {\n    \"url\": \"search-list.json\",\n    \"revision\": \"6dc7c00e053b034fbd9e7b4c8bf0f68f\"\n  },\n  {\n    \"url\": \"search/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"search/index.bundle.js\",\n    \"revision\": \"92329ec58632a4d18110265a9a696d05\"\n  },\n  {\n    \"url\": \"search/index.html\",\n    \"revision\": \"f45c1f8f18267d511b1a48c8da3cb3b8\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/alice/img/ch_1_1.png\",\n    \"revision\": \"f13e634f4f4767f426a791ddf85ba9b0\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/alice/img/ch_1_2.png\",\n    \"revision\": \"a40e24033ce25edb5169d5f50a1783d7\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/alice/img/ch_1_3.png\",\n    \"revision\": \"9325671498a60f3e05c6bfdcb6001bac\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/alice/img/ch_2_1.png\",\n    \"revision\": \"ffd9b2ce17eb5cf4b6e0c2e88128e7bc\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/alice/img/ch_2_2.png\",\n    \"revision\": \"c0aa4864727b53a82614fb098c286bca\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/alice/img/ch_2_3.png\",\n    \"revision\": \"45b8f2b32fa463cbbf478693354bb676\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/alice/img/ch_2_4.png\",\n    \"revision\": \"5175980071714ec946d815b4180b23bc\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/alice/img/ch_3_1.png\",\n    \"revision\": \"0b58afb90669a0c00dd796f64872b141\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/alice/img/ch_3_2.png\",\n    \"revision\": \"6f21a396f2c8b7f3a5a884dc9a8932c0\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/images/avatar_00.png\",\n    \"revision\": \"1a565667c6cf7310db22762e8385f396\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/images/avatar_01.png\",\n    \"revision\": \"8b86e5f8249828163a0d7e9f6d315dce\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/images/avatar_02.png\",\n    \"revision\": \"8a011d6e36c3b968241ac4331cd03aad\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/images/avatar_03.png\",\n    \"revision\": \"57f804786860e3d1166d0905651efed2\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/images/card_cover_2.jpg\",\n    \"revision\": \"36c8155fd8a8504c3c49aecc3a2f1426\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/images/card_cover_3.jpg\",\n    \"revision\": \"018aa09363578ced3cac25fc174e2d97\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/images/card_cover_4.jpg\",\n    \"revision\": \"17458ae6c0f602d385272776d07e2b79\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/images/card_cover.jpg\",\n    \"revision\": \"056b0eb64ac30441bd6aca8e3798286b\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/images/card_placeholder.jpg\",\n    \"revision\": \"d4969877fffc05adb98477330588dfb4\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/images/cover_javascript.jpg\",\n    \"revision\": \"210c83cdaafae6be05c8fbb4cb4accc3\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/images/cover_recipes.jpg\",\n    \"revision\": \"6b19a1781bc4e0ca2d71e843ec7ad38e\"\n  },\n  {\n    \"url\": \"images/examples/clock.png\",\n    \"revision\": \"ed8359352f4562f7b229ccc5e544fa4e\"\n  },\n  {\n    \"url\": \"images/github-mark-light.png\",\n    \"revision\": \"eb94bb97c3410733ce017b184d314723\"\n  },\n  {\n    \"url\": \"images/github-mark.png\",\n    \"revision\": \"add1026fb07009c6879400cbcf145301\"\n  },\n  {\n    \"url\": \"images/icons/desktop/android-chrome-192x192.png\",\n    \"revision\": \"93d5e77e9ee1e9c6975f3c0bd1a21574\"\n  },\n  {\n    \"url\": \"images/icons/desktop/android-chrome-512x512.png\",\n    \"revision\": \"6df83c6c13be17a2ea70d29e340c5ddb\"\n  },\n  {\n    \"url\": \"images/icons/desktop/apple-touch-icon.png\",\n    \"revision\": \"2b78ed332644d19d9779c069c5842538\"\n  },\n  {\n    \"url\": \"images/icons/desktop/favicon-16x16.png\",\n    \"revision\": \"6c047cdbd3d5c4c962a3a692a5025d27\"\n  },\n  {\n    \"url\": \"images/icons/desktop/favicon-32x32.png\",\n    \"revision\": \"7413528d5e59c22af1ccf38187bc950b\"\n  },\n  {\n    \"url\": \"images/icons/desktop/mstile-150x150.png\",\n    \"revision\": \"540caa78f56655281b2d4b17ad52f2ce\"\n  },\n  {\n    \"url\": \"images/icons/desktop/safari-pinned-tab.svg\",\n    \"revision\": \"a0ab2c612c6a5019b3e4ae7c38043b98\"\n  },\n  {\n    \"url\": \"images/icons/icon-128x128.png\",\n    \"revision\": \"69f3f1f3f956bb71f35ce66b7717e1a0\"\n  },\n  {\n    \"url\": \"images/icons/icon-144x144.png\",\n    \"revision\": \"45e24db8671c41ca95c440df0cadf2a3\"\n  },\n  {\n    \"url\": \"images/icons/icon-152x152.png\",\n    \"revision\": \"e0867fd6e9bc25afd831b1eabdd83f8d\"\n  },\n  {\n    \"url\": \"images/icons/icon-192x192.png\",\n    \"revision\": \"cf383c3d4500d31884326cc9d53a8c3a\"\n  },\n  {\n    \"url\": \"images/icons/icon-384x384.png\",\n    \"revision\": \"31fd304cf6c5ff72928b7a91fbd68343\"\n  },\n  {\n    \"url\": \"images/icons/icon-512x512.png\",\n    \"revision\": \"47d9af0508ab29138dcb8ca6a4664cf2\"\n  },\n  {\n    \"url\": \"images/icons/icon-72x72.png\",\n    \"revision\": \"919cb6b3e8a1b5d0c963921dba0e4388\"\n  },\n  {\n    \"url\": \"images/icons/icon-96x96.png\",\n    \"revision\": \"5547ad1a33334c0f5c04f6de1f6d2c52\"\n  },\n  {\n    \"url\": \"images/patreon.png\",\n    \"revision\": \"138534b06fe107c864e576d63273cf75\"\n  },\n  {\n    \"url\": \"images/profile-icon.png\",\n    \"revision\": \"b4e6fa3d09388123298958c47aeb13ca\"\n  },\n  {\n    \"url\": \"images/rss-feed.png\",\n    \"revision\": \"fa5663a3878814bb9820de6b29005169\"\n  },\n  {\n    \"url\": \"images/zuix-logo.svg\",\n    \"revision\": \"48e6defd57440a6d0f0d12241ff9d6c5\"\n  }\n], {});\n\n\n\n\nworkbox_routing_registerRoute(/\\.(?:png|jpg|jpeg|svg)$/, new workbox_strategies_CacheFirst({ \"cacheName\":\"images\", plugins: [new workbox_expiration_ExpirationPlugin({ maxEntries: 50 })] }), 'GET');\nworkbox_routing_registerRoute(/\\.(?:html|json|js|css)$/, new workbox_strategies_CacheFirst({ \"cacheName\":\"default\", plugins: [new workbox_expiration_ExpirationPlugin({ maxEntries: 50 })] }), 'GET');\n\n\n\n\n"],"names":["self","addEventListener","event","data","type","skipWaiting","workbox_precaching_precacheAndRoute","url","revision","workbox_routing_registerRoute","workbox_strategies_CacheFirst","cacheName","plugins","workbox_expiration_ExpirationPlugin","maxEntries"],"mappings":"0nBAsBAA,KAAKC,iBAAiB,WAAYC,IAC5BA,EAAMC,MAA4B,iBAApBD,EAAMC,KAAKC,MAC3BJ,KAAKK,aACP,IAWFC,EAAAA,iBAAoC,CAClC,CACEC,IAAO,4CACPC,SAAY,oCAEd,CACED,IAAO,4CACPC,SAAY,oCAEd,CACED,IAAO,4CACPC,SAAY,oCAEd,CACED,IAAO,sCACPC,SAAY,oCAEd,CACED,IAAO,uCACPC,SAAY,oCAEd,CACED,IAAO,wCACPC,SAAY,oCAEd,CACED,IAAO,sCACPC,SAAY,oCAEd,CACED,IAAO,uCACPC,SAAY,oCAEd,CACED,IAAO,qCACPC,SAAY,oCAEd,CACED,IAAO,sCACPC,SAAY,oCAEd,CACED,IAAO,uCACPC,SAAY,oCAEd,CACED,IAAO,qCACPC,SAAY,oCAEd,CACED,IAAO,qCACPC,SAAY,oCAEd,CACED,IAAO,sCACPC,SAAY,oCAEd,CACED,IAAO,oCACPC,SAAY,oCAEd,CACED,IAAO,iCACPC,SAAY,oCAEd,CACED,IAAO,kCACPC,SAAY,oCAEd,CACED,IAAO,gCACPC,SAAY,oCAEd,CACED,IAAO,6BACPC,SAAY,oCAEd,CACED,IAAO,8BACPC,SAAY,oCAEd,CACED,IAAO,6BACPC,SAAY,oCAEd,CACED,IAAO,8BACPC,SAAY,oCAEd,CACED,IAAO,+BACPC,SAAY,oCAEd,CACED,IAAO,gCACPC,SAAY,oCAEd,CACED,IAAO,8BACPC,SAAY,oCAEd,CACED,IAAO,qCACPC,SAAY,oCAEd,CACED,IAAO,6BACPC,SAAY,oCAEd,CACED,IAAO,8BACPC,SAAY,oCAEd,CACED,IAAO,4BACPC,SAAY,oCAEd,CACED,IAAO,mCACPC,SAAY,oCAEd,CACED,IAAO,YACPC,SAAY,oCAEd,CACED,IAAO,sBACPC,SAAY,oCAEd,CACED,IAAO,oCACPC,SAAY,oCAEd,CACED,IAAO,wCACPC,SAAY,oCAEd,CACED,IAAO,gBACPC,SAAY,oCAEd,CACED,IAAO,sBACPC,SAAY,oCAEd,CACED,IAAO,aACPC,SAAY,oCAEd,CACED,IAAO,+BACPC,SAAY,oCAEd,CACED,IAAO,4BACPC,SAAY,oCAEd,CACED,IAAO,gCACPC,SAAY,oCAEd,CACED,IAAO,wBACPC,SAAY,oCAEd,CACED,IAAO,4BACPC,SAAY,oCAEd,CACED,IAAO,yBACPC,SAAY,oCAEd,CACED,IAAO,sBACPC,SAAY,oCAEd,CACED,IAAO,0BACPC,SAAY,oCAEd,CACED,IAAO,kBACPC,SAAY,oCAEd,CACED,IAAO,sBACPC,SAAY,oCAEd,CACED,IAAO,uCACPC,SAAY,oCAEd,CACED,IAAO,0BACPC,SAAY,oCAEd,CACED,IAAO,yBACPC,SAAY,oCAEd,CACED,IAAO,0BACPC,SAAY,oCAEd,CACED,IAAO,8BACPC,SAAY,oCAEd,CACED,IAAO,iCACPC,SAAY,oCAEd,CACED,IAAO,qCACPC,SAAY,oCAEd,CACED,IAAO,kBACPC,SAAY,oCAEd,CACED,IAAO,sBACPC,SAAY,oCAEd,CACED,IAAO,yBACPC,SAAY,oCAEd,CACED,IAAO,6BACPC,SAAY,oCAEd,CACED,IAAO,+BACPC,SAAY,oCAEd,CACED,IAAO,gBACPC,SAAY,oCAEd,CACED,IAAO,gDACPC,SAAY,oCAEd,CACED,IAAO,4CACPC,SAAY,oCAEd,CACED,IAAO,uCACPC,SAAY,oCAEd,CACED,IAAO,yDACPC,SAAY,oCAEd,CACED,IAAO,qDACPC,SAAY,oCAEd,CACED,IAAO,gDACPC,SAAY,oCAEd,CACED,IAAO,6DACPC,SAAY,oCAEd,CACED,IAAO,yDACPC,SAAY,oCAEd,CACED,IAAO,oDACPC,SAAY,oCAEd,CACED,IAAO,gEACPC,SAAY,oCAEd,CACED,IAAO,4DACPC,SAAY,oCAEd,CACED,IAAO,uDACPC,SAAY,oCAEd,CACED,IAAO,gEACPC,SAAY,oCAEd,CACED,IAAO,4DACPC,SAAY,oCAEd,CACED,IAAO,uDACPC,SAAY,oCAEd,CACED,IAAO,gEACPC,SAAY,oCAEd,CACED,IAAO,4DACPC,SAAY,oCAEd,CACED,IAAO,uDACPC,SAAY,oCAEd,CACED,IAAO,4DACPC,SAAY,oCAEd,CACED,IAAO,wDACPC,SAAY,oCAEd,CACED,IAAO,mDACPC,SAAY,oCAEd,CACED,IAAO,8DACPC,SAAY,oCAEd,CACED,IAAO,0DACPC,SAAY,oCAEd,CACED,IAAO,qDACPC,SAAY,oCAEd,CACED,IAAO,oEACPC,SAAY,oCAEd,CACED,IAAO,gEACPC,SAAY,oCAEd,CACED,IAAO,2DACPC,SAAY,oCAEd,CACED,IAAO,8CACPC,SAAY,oCAEd,CACED,IAAO,0CACPC,SAAY,oCAEd,CACED,IAAO,qCACPC,SAAY,oCAEd,CACED,IAAO,kEACPC,SAAY,oCAEd,CACED,IAAO,8DACPC,SAAY,oCAEd,CACED,IAAO,yDACPC,SAAY,oCAEd,CACED,IAAO,wEACPC,SAAY,oCAEd,CACED,IAAO,oEACPC,SAAY,oCAEd,CACED,IAAO,+DACPC,SAAY,oCAEd,CACED,IAAO,4EACPC,SAAY,oCAEd,CACED,IAAO,wEACPC,SAAY,oCAEd,CACED,IAAO,mEACPC,SAAY,oCAEd,CACED,IAAO,0EACPC,SAAY,oCAEd,CACED,IAAO,sEACPC,SAAY,oCAEd,CACED,IAAO,iEACPC,SAAY,oCAEd,CACED,IAAO,iEACPC,SAAY,oCAEd,CACED,IAAO,6DACPC,SAAY,oCAEd,CACED,IAAO,wDACPC,SAAY,oCAEd,CACED,IAAO,oEACPC,SAAY,oCAEd,CACED,IAAO,gEACPC,SAAY,oCAEd,CACED,IAAO,2DACPC,SAAY,oCAEd,CACED,IAAO,iEACPC,SAAY,oCAEd,CACED,IAAO,6DACPC,SAAY,oCAEd,CACED,IAAO,wDACPC,SAAY,oCAEd,CACED,IAAO,qEACPC,SAAY,oCAEd,CACED,IAAO,iEACPC,SAAY,oCAEd,CACED,IAAO,4DACPC,SAAY,oCAEd,CACED,IAAO,sEACPC,SAAY,oCAEd,CACED,IAAO,kEACPC,SAAY,oCAEd,CACED,IAAO,6DACPC,SAAY,oCAEd,CACED,IAAO,gEACPC,SAAY,oCAEd,CACED,IAAO,4DACPC,SAAY,oCAEd,CACED,IAAO,uDACPC,SAAY,oCAEd,CACED,IAAO,wDACPC,SAAY,oCAEd,CACED,IAAO,oDACPC,SAAY,oCAEd,CACED,IAAO,+CACPC,SAAY,oCAEd,CACED,IAAO,yDACPC,SAAY,oCAEd,CACED,IAAO,qDACPC,SAAY,oCAEd,CACED,IAAO,gDACPC,SAAY,oCAEd,CACED,IAAO,8CACPC,SAAY,oCAEd,CACED,IAAO,0CACPC,SAAY,oCAEd,CACED,IAAO,qCACPC,SAAY,oCAEd,CACED,IAAO,oDACPC,SAAY,oCAEd,CACED,IAAO,gDACPC,SAAY,oCAEd,CACED,IAAO,2CACPC,SAAY,oCAEd,CACED,IAAO,0DACPC,SAAY,oCAEd,CACED,IAAO,sDACPC,SAAY,oCAEd,CACED,IAAO,iDACPC,SAAY,oCAEd,CACED,IAAO,qDACPC,SAAY,oCAEd,CACED,IAAO,iDACPC,SAAY,oCAEd,CACED,IAAO,4CACPC,SAAY,oCAEd,CACED,IAAO,0DACPC,SAAY,oCAEd,CACED,IAAO,sDACPC,SAAY,oCAEd,CACED,IAAO,iDACPC,SAAY,oCAEd,CACED,IAAO,0CACPC,SAAY,oCAEd,CACED,IAAO,sCACPC,SAAY,oCAEd,CACED,IAAO,iCACPC,SAAY,oCAEd,CACED,IAAO,oDACPC,SAAY,oCAEd,CACED,IAAO,+CACPC,SAAY,oCAEd,CACED,IAAO,2CACPC,SAAY,oCAEd,CACED,IAAO,sCACPC,SAAY,oCAEd,CACED,IAAO,iDACPC,SAAY,oCAEd,CACED,IAAO,iCACPC,SAAY,oCAEd,CACED,IAAO,6BACPC,SAAY,oCAEd,CACED,IAAO,wBACPC,SAAY,oCAEd,CACED,IAAO,oBACPC,SAAY,oCAEd,CACED,IAAO,mBACPC,SAAY,oCAEd,CACED,IAAO,6BACPC,SAAY,oCAEd,CACED,IAAO,yBACPC,SAAY,oCAEd,CACED,IAAO,oBACPC,SAAY,oCAEd,CACED,IAAO,iDACPC,SAAY,oCAEd,CACED,IAAO,iDACPC,SAAY,oCAEd,CACED,IAAO,iDACPC,SAAY,oCAEd,CACED,IAAO,iDACPC,SAAY,oCAEd,CACED,IAAO,iDACPC,SAAY,oCAEd,CACED,IAAO,iDACPC,SAAY,oCAEd,CACED,IAAO,iDACPC,SAAY,oCAEd,CACED,IAAO,iDACPC,SAAY,oCAEd,CACED,IAAO,iDACPC,SAAY,oCAEd,CACED,IAAO,iDACPC,SAAY,oCAEd,CACED,IAAO,iDACPC,SAAY,oCAEd,CACED,IAAO,iDACPC,SAAY,oCAEd,CACED,IAAO,iDACPC,SAAY,oCAEd,CACED,IAAO,oDACPC,SAAY,oCAEd,CACED,IAAO,oDACPC,SAAY,oCAEd,CACED,IAAO,oDACPC,SAAY,oCAEd,CACED,IAAO,kDACPC,SAAY,oCAEd,CACED,IAAO,wDACPC,SAAY,oCAEd,CACED,IAAO,wDACPC,SAAY,oCAEd,CACED,IAAO,qDACPC,SAAY,oCAEd,CACED,IAAO,4BACPC,SAAY,oCAEd,CACED,IAAO,+BACPC,SAAY,oCAEd,CACED,IAAO,yBACPC,SAAY,oCAEd,CACED,IAAO,kDACPC,SAAY,oCAEd,CACED,IAAO,kDACPC,SAAY,oCAEd,CACED,IAAO,4CACPC,SAAY,oCAEd,CACED,IAAO,yCACPC,SAAY,oCAEd,CACED,IAAO,yCACPC,SAAY,oCAEd,CACED,IAAO,0CACPC,SAAY,oCAEd,CACED,IAAO,6CACPC,SAAY,oCAEd,CACED,IAAO,gCACPC,SAAY,oCAEd,CACED,IAAO,gCACPC,SAAY,oCAEd,CACED,IAAO,gCACPC,SAAY,oCAEd,CACED,IAAO,gCACPC,SAAY,oCAEd,CACED,IAAO,gCACPC,SAAY,oCAEd,CACED,IAAO,gCACPC,SAAY,oCAEd,CACED,IAAO,8BACPC,SAAY,oCAEd,CACED,IAAO,8BACPC,SAAY,oCAEd,CACED,IAAO,qBACPC,SAAY,oCAEd,CACED,IAAO,0BACPC,SAAY,oCAEd,CACED,IAAO,sBACPC,SAAY,oCAEd,CACED,IAAO,uBACPC,SAAY,qCAEb,CAAE,GAKLC,EAAAA,cAA8B,0BAA2B,IAAIC,aAA8B,CAAEC,UAAY,SAAUC,QAAS,CAAC,IAAIC,mBAAoC,CAAEC,WAAY,QAAW,OAC9LL,EAAAA,cAA8B,0BAA2B,IAAIC,aAA8B,CAAEC,UAAY,UAAWC,QAAS,CAAC,IAAIC,mBAAoC,CAAEC,WAAY,QAAW"}
\ No newline at end of file
+{"version":3,"file":"service-worker.js","sources":["../../../../../../../tmp/e1abdcaddedcfcc0f3a42745a04a3560/service-worker.js"],"sourcesContent":["import {registerRoute as workbox_routing_registerRoute} from '/media/gene/Archie/work/repositories/zuix/zuixjs.org/node_modules/workbox-routing/registerRoute.mjs';\nimport {ExpirationPlugin as workbox_expiration_ExpirationPlugin} from '/media/gene/Archie/work/repositories/zuix/zuixjs.org/node_modules/workbox-expiration/ExpirationPlugin.mjs';\nimport {CacheFirst as workbox_strategies_CacheFirst} from '/media/gene/Archie/work/repositories/zuix/zuixjs.org/node_modules/workbox-strategies/CacheFirst.mjs';\nimport {precacheAndRoute as workbox_precaching_precacheAndRoute} from '/media/gene/Archie/work/repositories/zuix/zuixjs.org/node_modules/workbox-precaching/precacheAndRoute.mjs';/**\n * Welcome to your Workbox-powered service worker!\n *\n * You'll need to register this file in your web app.\n * See https://goo.gl/nhQhGp\n *\n * The rest of the code is auto-generated. Please don't update this file\n * directly; instead, make changes to your Workbox build configuration\n * and re-run your build process.\n * See https://goo.gl/2aRDsh\n */\n\n\n\n\n\n\n\n\nself.addEventListener('message', (event) => {\n  if (event.data && event.data.type === 'SKIP_WAITING') {\n    self.skipWaiting();\n  }\n});\n\n\n\n\n/**\n * The precacheAndRoute() method efficiently caches and responds to\n * requests for URLs in the manifest.\n * See https://goo.gl/S9QRab\n */\nworkbox_precaching_precacheAndRoute([\n  {\n    \"url\": \"app/content/docs/examples/alice/ch_1.html\",\n    \"revision\": \"7bdba3c49c7bb2e4cc412e7791c6e771\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/alice/ch_2.html\",\n    \"revision\": \"ccfe438dd4542451bcdabf93ec332847\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/alice/ch_3.html\",\n    \"revision\": \"eb43ef576cd0d1c6a85e2413870f34dc\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/links.css\",\n    \"revision\": \"300f68df4ae2415d93a52a566b256dbf\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/links.html\",\n    \"revision\": \"cbd247603f5f438b7c760f4fdc77cf50\"\n  },\n  {\n    \"url\": \"app/controllers/component-test.es5.js\",\n    \"revision\": \"4315ce75c388c30d6e5b42520e5eb6eb\"\n  },\n  {\n    \"url\": \"app/examples/custom-elements-01.css\",\n    \"revision\": \"d9d625f90e36313e16428a7f182dbedb\"\n  },\n  {\n    \"url\": \"app/examples/custom-elements-01.html\",\n    \"revision\": \"68a64fc6d107c1ce892ec39a4a079768\"\n  },\n  {\n    \"url\": \"app/examples/custom-elements-01.js\",\n    \"revision\": \"3bda6a343eb5a68b88ced3007b4a0072\"\n  },\n  {\n    \"url\": \"app/examples/custom-elements-02.css\",\n    \"revision\": \"c3c565061953830904559b9616dea61c\"\n  },\n  {\n    \"url\": \"app/examples/custom-elements-02.html\",\n    \"revision\": \"38be43f8d48cbf1dc9cb31300c343ae9\"\n  },\n  {\n    \"url\": \"app/examples/custom-elements-02.js\",\n    \"revision\": \"f15a071167478bcdba0420f3f789edf7\"\n  },\n  {\n    \"url\": \"app/examples/default-component.css\",\n    \"revision\": \"fab25e621a552f6009b17f494305f723\"\n  },\n  {\n    \"url\": \"app/examples/default-component.html\",\n    \"revision\": \"aa5ff0eb86ede6142c6a4f4933a928f8\"\n  },\n  {\n    \"url\": \"app/examples/default-component.js\",\n    \"revision\": \"4bd425e89334935df53a1789a4dd6e78\"\n  },\n  {\n    \"url\": \"app/examples/new-component.css\",\n    \"revision\": \"2cc0fbc0683255a885678944443c7485\"\n  },\n  {\n    \"url\": \"app/examples/new-component.html\",\n    \"revision\": \"613d5e1a637a85199e1fef8017b38ca9\"\n  },\n  {\n    \"url\": \"app/examples/new-component.js\",\n    \"revision\": \"f99ff997e1d113ca735299fb5f936553\"\n  },\n  {\n    \"url\": \"app/templates/mdl_card.css\",\n    \"revision\": \"e3fe0daa1c045731171a498dc922f092\"\n  },\n  {\n    \"url\": \"app/templates/mdl_card.html\",\n    \"revision\": \"8f4162c548d4eb34d2e592c499f31aa0\"\n  },\n  {\n    \"url\": \"app/templates/mdl-card.css\",\n    \"revision\": \"e3fe0daa1c045731171a498dc922f092\"\n  },\n  {\n    \"url\": \"app/templates/mdl-card.html\",\n    \"revision\": \"8f4162c548d4eb34d2e592c499f31aa0\"\n  },\n  {\n    \"url\": \"app/widgets/analog-clock.css\",\n    \"revision\": \"c14d980e48af8e7dca858e1c80461ce9\"\n  },\n  {\n    \"url\": \"app/widgets/analog-clock.html\",\n    \"revision\": \"705d36dcc9859aea3435e71ee51faa9c\"\n  },\n  {\n    \"url\": \"app/widgets/analog-clock.js\",\n    \"revision\": \"31f7d503d0db768a3e9d5a1665776365\"\n  },\n  {\n    \"url\": \"app/widgets/analog-clock.module.js\",\n    \"revision\": \"b2931cb52a3efcecea449b51e636ac7e\"\n  },\n  {\n    \"url\": \"app/widgets/time-clock.css\",\n    \"revision\": \"187e7e955c1e4009eb97f280ce082bcc\"\n  },\n  {\n    \"url\": \"app/widgets/time-clock.html\",\n    \"revision\": \"921217aece98231bb9b573093065faa2\"\n  },\n  {\n    \"url\": \"app/widgets/time-clock.js\",\n    \"revision\": \"6a322e9270fdf2173ee183543e8d9ada\"\n  },\n  {\n    \"url\": \"app/widgets/time-clock.module.js\",\n    \"revision\": \"f5e1725788c2a89c8ccb4be0921f77ae\"\n  },\n  {\n    \"url\": \"config.js\",\n    \"revision\": \"fd12f789d7bdc02c57a5de658862294c\"\n  },\n  {\n    \"url\": \"css/animate.min.css\",\n    \"revision\": \"c0be8e53226ac34833fd9b5dbc01ebc5\"\n  },\n  {\n    \"url\": \"css/fla/flex-layout-attribute.css\",\n    \"revision\": \"c9bc58fccb5b4c9d1d7a6e76edddffa7\"\n  },\n  {\n    \"url\": \"css/fla/flex-layout-attribute.min.css\",\n    \"revision\": \"c55488315343d9afb4d13ebf9cc8f97b\"\n  },\n  {\n    \"url\": \"css/prism.css\",\n    \"revision\": \"8957823dd78e6a4fb2110dd7e605029a\"\n  },\n  {\n    \"url\": \"index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"index.html\",\n    \"revision\": \"a8fb9ae6aa80559b3004589f3ccb2b3b\"\n  },\n  {\n    \"url\": \"js/fuse/fuse.basic.common.js\",\n    \"revision\": \"ab3ef0028c8992d0098b5b836874291a\"\n  },\n  {\n    \"url\": \"js/fuse/fuse.basic.esm.js\",\n    \"revision\": \"0cd240af452625e49deed3ee2445aba6\"\n  },\n  {\n    \"url\": \"js/fuse/fuse.basic.esm.min.js\",\n    \"revision\": \"f79f602fa4572cd580786923ce942b6c\"\n  },\n  {\n    \"url\": \"js/fuse/fuse.basic.js\",\n    \"revision\": \"6c4923a67225dd64e42600c578d8ff0f\"\n  },\n  {\n    \"url\": \"js/fuse/fuse.basic.min.js\",\n    \"revision\": \"62465d50492b6d1bfbbd0e5f9a09b222\"\n  },\n  {\n    \"url\": \"js/fuse/fuse.common.js\",\n    \"revision\": \"ddbe097989e19bf1872f533cbc363f1b\"\n  },\n  {\n    \"url\": \"js/fuse/fuse.esm.js\",\n    \"revision\": \"82bbf2ed8ece715c58afe6c75977795f\"\n  },\n  {\n    \"url\": \"js/fuse/fuse.esm.min.js\",\n    \"revision\": \"589223b029350d512db61a8f323ce0fe\"\n  },\n  {\n    \"url\": \"js/fuse/fuse.js\",\n    \"revision\": \"7e19f88c4b2a7c038943bf3b4a17986f\"\n  },\n  {\n    \"url\": \"js/fuse/fuse.min.js\",\n    \"revision\": \"de7d60e4a6881074275feca14b84a49d\"\n  },\n  {\n    \"url\": \"js/mdl/material.custom-theme.min.css\",\n    \"revision\": \"2225850a6b445fd37acf50466f50c4b5\"\n  },\n  {\n    \"url\": \"js/mdl/material.min.css\",\n    \"revision\": \"9ab85b48144d24908b4e455c2afb648c\"\n  },\n  {\n    \"url\": \"js/mdl/material.min.js\",\n    \"revision\": \"8dbb84e1d015cd5c2f5be1064eb924b3\"\n  },\n  {\n    \"url\": \"js/zuix/zuix-bundler.js\",\n    \"revision\": \"00ed03895f615ebd2fb0b3f0bec994d8\"\n  },\n  {\n    \"url\": \"js/zuix/zuix-bundler.min.js\",\n    \"revision\": \"df3c39916f2fe1f0fab80b2f5c479695\"\n  },\n  {\n    \"url\": \"js/zuix/zuix-bundler.module.js\",\n    \"revision\": \"134de25f07b5a2fb77bd9a963e86b163\"\n  },\n  {\n    \"url\": \"js/zuix/zuix-bundler.module.min.js\",\n    \"revision\": \"654a4693e5471230795a0fbbfdab68c7\"\n  },\n  {\n    \"url\": \"js/zuix/zuix.js\",\n    \"revision\": \"2d6f8180b7c355b2c86be58bbf0a16c4\"\n  },\n  {\n    \"url\": \"js/zuix/zuix.min.js\",\n    \"revision\": \"2894acdf05ed5e20dcfb25bb8281ea6a\"\n  },\n  {\n    \"url\": \"js/zuix/zuix.module.js\",\n    \"revision\": \"ce65c583131528332c7e928d1b0dacd8\"\n  },\n  {\n    \"url\": \"js/zuix/zuix.module.min.js\",\n    \"revision\": \"33370a07f10a6afd26ee774ad214a334\"\n  },\n  {\n    \"url\": \"js/zuix/zx-context.module.js\",\n    \"revision\": \"8d5f2cabaa0dd997e0493f1d475daa9a\"\n  },\n  {\n    \"url\": \"manifest.json\",\n    \"revision\": \"62a5b876bebcc21a7bccd711f8fc6063\"\n  },\n  {\n    \"url\": \"pages/documentation/about/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/about/index.bundle.js\",\n    \"revision\": \"093e6602e60179ecba282cbca46d9b68\"\n  },\n  {\n    \"url\": \"pages/documentation/about/index.html\",\n    \"revision\": \"69a4879dbf279021f320e6d8e6b26973\"\n  },\n  {\n    \"url\": \"pages/documentation/active_refresh/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/active_refresh/index.bundle.js\",\n    \"revision\": \"5da77ec8c5ba0e4ea8f73e7a54ce42d5\"\n  },\n  {\n    \"url\": \"pages/documentation/active_refresh/index.html\",\n    \"revision\": \"5ec14ce6f64197f84e978c8e0d5bcea7\"\n  },\n  {\n    \"url\": \"pages/documentation/api/helpers/Logger/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/api/helpers/Logger/index.bundle.js\",\n    \"revision\": \"093e6602e60179ecba282cbca46d9b68\"\n  },\n  {\n    \"url\": \"pages/documentation/api/helpers/Logger/index.html\",\n    \"revision\": \"b0814e97e261091dd8726fe1a3421e72\"\n  },\n  {\n    \"url\": \"pages/documentation/api/helpers/TaskQueue/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/api/helpers/TaskQueue/index.bundle.js\",\n    \"revision\": \"093e6602e60179ecba282cbca46d9b68\"\n  },\n  {\n    \"url\": \"pages/documentation/api/helpers/TaskQueue/index.html\",\n    \"revision\": \"d8da6d8e79150db384e0a0c1b592a244\"\n  },\n  {\n    \"url\": \"pages/documentation/api/helpers/Utils_dom/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/api/helpers/Utils_dom/index.bundle.js\",\n    \"revision\": \"093e6602e60179ecba282cbca46d9b68\"\n  },\n  {\n    \"url\": \"pages/documentation/api/helpers/Utils_dom/index.html\",\n    \"revision\": \"68895ed2109e8135ede3edaccd176219\"\n  },\n  {\n    \"url\": \"pages/documentation/api/helpers/Utils.dom/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/api/helpers/Utils.dom/index.bundle.js\",\n    \"revision\": \"093e6602e60179ecba282cbca46d9b68\"\n  },\n  {\n    \"url\": \"pages/documentation/api/helpers/Utils.dom/index.html\",\n    \"revision\": \"18fe51873203406b71b1103ec7392f85\"\n  },\n  {\n    \"url\": \"pages/documentation/api/helpers/Utils/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/api/helpers/Utils/index.bundle.js\",\n    \"revision\": \"093e6602e60179ecba282cbca46d9b68\"\n  },\n  {\n    \"url\": \"pages/documentation/api/helpers/Utils/index.html\",\n    \"revision\": \"8154fa8dbcbd348cd34fc6b855e8c11d\"\n  },\n  {\n    \"url\": \"pages/documentation/api/helpers/ZxQuery/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/api/helpers/ZxQuery/index.bundle.js\",\n    \"revision\": \"093e6602e60179ecba282cbca46d9b68\"\n  },\n  {\n    \"url\": \"pages/documentation/api/helpers/ZxQuery/index.html\",\n    \"revision\": \"2290fc7ba07bb6f4924f1f141e2f62b4\"\n  },\n  {\n    \"url\": \"pages/documentation/api/helpers/ZxQueryStatic/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/api/helpers/ZxQueryStatic/index.bundle.js\",\n    \"revision\": \"093e6602e60179ecba282cbca46d9b68\"\n  },\n  {\n    \"url\": \"pages/documentation/api/helpers/ZxQueryStatic/index.html\",\n    \"revision\": \"1892989bfd8a96b975c3ed9c6421704f\"\n  },\n  {\n    \"url\": \"pages/documentation/api/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/api/index.bundle.js\",\n    \"revision\": \"093e6602e60179ecba282cbca46d9b68\"\n  },\n  {\n    \"url\": \"pages/documentation/api/index.html\",\n    \"revision\": \"ef8a41a21016b450e06b89d2e49d6b5b\"\n  },\n  {\n    \"url\": \"pages/documentation/api/localizer/Localizer/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/api/localizer/Localizer/index.bundle.js\",\n    \"revision\": \"093e6602e60179ecba282cbca46d9b68\"\n  },\n  {\n    \"url\": \"pages/documentation/api/localizer/Localizer/index.html\",\n    \"revision\": \"749eac40adb8c8301aeb4e06188c8c9c\"\n  },\n  {\n    \"url\": \"pages/documentation/api/observable/ObjectObserver/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/api/observable/ObjectObserver/index.bundle.js\",\n    \"revision\": \"093e6602e60179ecba282cbca46d9b68\"\n  },\n  {\n    \"url\": \"pages/documentation/api/observable/ObjectObserver/index.html\",\n    \"revision\": \"637685fd69170108706ba472b6ce973e\"\n  },\n  {\n    \"url\": \"pages/documentation/api/observable/ObservableListener/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/api/observable/ObservableListener/index.bundle.js\",\n    \"revision\": \"093e6602e60179ecba282cbca46d9b68\"\n  },\n  {\n    \"url\": \"pages/documentation/api/observable/ObservableListener/index.html\",\n    \"revision\": \"c7fab9c9417dd47d924c415d9d8ff72a\"\n  },\n  {\n    \"url\": \"pages/documentation/api/observable/ObservableObject/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/api/observable/ObservableObject/index.bundle.js\",\n    \"revision\": \"093e6602e60179ecba282cbca46d9b68\"\n  },\n  {\n    \"url\": \"pages/documentation/api/observable/ObservableObject/index.html\",\n    \"revision\": \"c78c3723487d6f26d79e9e6be0b8c7f7\"\n  },\n  {\n    \"url\": \"pages/documentation/api/zuix/ActiveRefresh/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/api/zuix/ActiveRefresh/index.bundle.js\",\n    \"revision\": \"093e6602e60179ecba282cbca46d9b68\"\n  },\n  {\n    \"url\": \"pages/documentation/api/zuix/ActiveRefresh/index.html\",\n    \"revision\": \"9a85aec93c715fb340978a45dc7ca0d2\"\n  },\n  {\n    \"url\": \"pages/documentation/api/zuix/ComponentContext/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/api/zuix/ComponentContext/index.bundle.js\",\n    \"revision\": \"093e6602e60179ecba282cbca46d9b68\"\n  },\n  {\n    \"url\": \"pages/documentation/api/zuix/ComponentContext/index.html\",\n    \"revision\": \"e8dfbe453cbb1d1e94ea5937759e3234\"\n  },\n  {\n    \"url\": \"pages/documentation/api/zuix/Componentizer/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/api/zuix/Componentizer/index.bundle.js\",\n    \"revision\": \"093e6602e60179ecba282cbca46d9b68\"\n  },\n  {\n    \"url\": \"pages/documentation/api/zuix/Componentizer/index.html\",\n    \"revision\": \"9f029851e07bc03fa057e717769d2597\"\n  },\n  {\n    \"url\": \"pages/documentation/api/zuix/ContextController/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/api/zuix/ContextController/index.bundle.js\",\n    \"revision\": \"093e6602e60179ecba282cbca46d9b68\"\n  },\n  {\n    \"url\": \"pages/documentation/api/zuix/ContextController/index.html\",\n    \"revision\": \"8006746eee5cc37a6ae10ff6d5eb2d58\"\n  },\n  {\n    \"url\": \"pages/documentation/api/zuix/ControllerInstance/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/api/zuix/ControllerInstance/index.bundle.js\",\n    \"revision\": \"093e6602e60179ecba282cbca46d9b68\"\n  },\n  {\n    \"url\": \"pages/documentation/api/zuix/ControllerInstance/index.html\",\n    \"revision\": \"bbf11d291acdb377f5486d2678b7f490\"\n  },\n  {\n    \"url\": \"pages/documentation/api/zuix/ViewObserver/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/api/zuix/ViewObserver/index.bundle.js\",\n    \"revision\": \"093e6602e60179ecba282cbca46d9b68\"\n  },\n  {\n    \"url\": \"pages/documentation/api/zuix/ViewObserver/index.html\",\n    \"revision\": \"7e47d302a36743313c7ed43ea4ce6f61\"\n  },\n  {\n    \"url\": \"pages/documentation/api/zuix/Zuix/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/api/zuix/Zuix/index.bundle.js\",\n    \"revision\": \"ca0e03f95e17178eb6e880324fc79124\"\n  },\n  {\n    \"url\": \"pages/documentation/api/zuix/Zuix/index.html\",\n    \"revision\": \"8a724dddbf48267b8fe452ca7f236d5b\"\n  },\n  {\n    \"url\": \"pages/documentation/basic_concepts/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/basic_concepts/index.bundle.js\",\n    \"revision\": \"093e6602e60179ecba282cbca46d9b68\"\n  },\n  {\n    \"url\": \"pages/documentation/basic_concepts/index.html\",\n    \"revision\": \"894f9145f6c8617cf770758df96aef12\"\n  },\n  {\n    \"url\": \"pages/documentation/cli/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/cli/index.bundle.js\",\n    \"revision\": \"093e6602e60179ecba282cbca46d9b68\"\n  },\n  {\n    \"url\": \"pages/documentation/cli/index.html\",\n    \"revision\": \"23816c724223f33d1261e8de3c9ce1db\"\n  },\n  {\n    \"url\": \"pages/documentation/component/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/component/index.bundle.js\",\n    \"revision\": \"a04a536692ef1c77c49124c772a62c73\"\n  },\n  {\n    \"url\": \"pages/documentation/component/index.html\",\n    \"revision\": \"e4df71695c630d07e31da203418c2ec3\"\n  },\n  {\n    \"url\": \"pages/documentation/context_options/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/context_options/index.bundle.js\",\n    \"revision\": \"27881f7c5b192f1f8f19bd164fd85fce\"\n  },\n  {\n    \"url\": \"pages/documentation/context_options/index.html\",\n    \"revision\": \"922e6488ad37673056ab1a85e14d730d\"\n  },\n  {\n    \"url\": \"pages/documentation/controller/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/controller/index.bundle.js\",\n    \"revision\": \"7b426c745ae0d77a5acca1649b37cda5\"\n  },\n  {\n    \"url\": \"pages/documentation/controller/index.html\",\n    \"revision\": \"ade3b3961232fcc2b6e50dfab3e88849\"\n  },\n  {\n    \"url\": \"pages/documentation/getting_started/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/getting_started/index.bundle.js\",\n    \"revision\": \"093e6602e60179ecba282cbca46d9b68\"\n  },\n  {\n    \"url\": \"pages/documentation/getting_started/index.html\",\n    \"revision\": \"34e58cac164a3aff35249602fcb7612b\"\n  },\n  {\n    \"url\": \"pages/documentation/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/index.bundle.js\",\n    \"revision\": \"093e6602e60179ecba282cbca46d9b68\"\n  },\n  {\n    \"url\": \"pages/documentation/index.html\",\n    \"revision\": \"9122e60886cbcf9fa9dc8e4d683b7b92\"\n  },\n  {\n    \"url\": \"pages/documentation/view/CheckValidityBehavior.js\",\n    \"revision\": \"ab85e19fbf7c513b7d6bf2d2f756eff0\"\n  },\n  {\n    \"url\": \"pages/documentation/view/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"pages/documentation/view/index.bundle.js\",\n    \"revision\": \"85c38c2041f7f75785ad5209aedb30b7\"\n  },\n  {\n    \"url\": \"pages/documentation/view/index.html\",\n    \"revision\": \"4f4cd17f64b56a715ab20a6cda018624\"\n  },\n  {\n    \"url\": \"pages/documentation/view/ViewSwitchBehavior.js\",\n    \"revision\": \"6568e13a81727f9347b65a41952a3b84\"\n  },\n  {\n    \"url\": \"playground/index.bundle.ext.js\",\n    \"revision\": \"9f0b532d7d1c21c1a62aa00b3224fdc0\"\n  },\n  {\n    \"url\": \"playground/index.bundle.js\",\n    \"revision\": \"12005f5d3fbfc1a05ec39fdfd3db2d1b\"\n  },\n  {\n    \"url\": \"playground/index.html\",\n    \"revision\": \"04c5debb69c5d5d601d45477e3eb61cc\"\n  },\n  {\n    \"url\": \"search-index.json\",\n    \"revision\": \"86f5fde47c41af20ddaf60f8ccd02e1b\"\n  },\n  {\n    \"url\": \"search-list.json\",\n    \"revision\": \"41a4b039c66d3bf318985558799253f9\"\n  },\n  {\n    \"url\": \"search/index.bundle.ext.js\",\n    \"revision\": \"044b01ed45a9d7e3af77f49975e8f0ec\"\n  },\n  {\n    \"url\": \"search/index.bundle.js\",\n    \"revision\": \"92329ec58632a4d18110265a9a696d05\"\n  },\n  {\n    \"url\": \"search/index.html\",\n    \"revision\": \"a91aaa4f5dd183c3e5ac87cdcaba02b5\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/alice/img/ch_1_1.png\",\n    \"revision\": \"f13e634f4f4767f426a791ddf85ba9b0\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/alice/img/ch_1_2.png\",\n    \"revision\": \"a40e24033ce25edb5169d5f50a1783d7\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/alice/img/ch_1_3.png\",\n    \"revision\": \"9325671498a60f3e05c6bfdcb6001bac\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/alice/img/ch_2_1.png\",\n    \"revision\": \"ffd9b2ce17eb5cf4b6e0c2e88128e7bc\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/alice/img/ch_2_2.png\",\n    \"revision\": \"c0aa4864727b53a82614fb098c286bca\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/alice/img/ch_2_3.png\",\n    \"revision\": \"45b8f2b32fa463cbbf478693354bb676\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/alice/img/ch_2_4.png\",\n    \"revision\": \"5175980071714ec946d815b4180b23bc\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/alice/img/ch_3_1.png\",\n    \"revision\": \"0b58afb90669a0c00dd796f64872b141\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/alice/img/ch_3_2.png\",\n    \"revision\": \"6f21a396f2c8b7f3a5a884dc9a8932c0\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/images/avatar_00.png\",\n    \"revision\": \"1a565667c6cf7310db22762e8385f396\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/images/avatar_01.png\",\n    \"revision\": \"8b86e5f8249828163a0d7e9f6d315dce\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/images/avatar_02.png\",\n    \"revision\": \"8a011d6e36c3b968241ac4331cd03aad\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/images/avatar_03.png\",\n    \"revision\": \"57f804786860e3d1166d0905651efed2\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/images/card_cover_2.jpg\",\n    \"revision\": \"36c8155fd8a8504c3c49aecc3a2f1426\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/images/card_cover_3.jpg\",\n    \"revision\": \"018aa09363578ced3cac25fc174e2d97\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/images/card_cover_4.jpg\",\n    \"revision\": \"17458ae6c0f602d385272776d07e2b79\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/images/card_cover.jpg\",\n    \"revision\": \"056b0eb64ac30441bd6aca8e3798286b\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/images/card_placeholder.jpg\",\n    \"revision\": \"d4969877fffc05adb98477330588dfb4\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/images/cover_javascript.jpg\",\n    \"revision\": \"210c83cdaafae6be05c8fbb4cb4accc3\"\n  },\n  {\n    \"url\": \"app/content/docs/examples/images/cover_recipes.jpg\",\n    \"revision\": \"6b19a1781bc4e0ca2d71e843ec7ad38e\"\n  },\n  {\n    \"url\": \"images/examples/clock.png\",\n    \"revision\": \"ed8359352f4562f7b229ccc5e544fa4e\"\n  },\n  {\n    \"url\": \"images/github-mark-light.png\",\n    \"revision\": \"eb94bb97c3410733ce017b184d314723\"\n  },\n  {\n    \"url\": \"images/github-mark.png\",\n    \"revision\": \"add1026fb07009c6879400cbcf145301\"\n  },\n  {\n    \"url\": \"images/icons/desktop/android-chrome-192x192.png\",\n    \"revision\": \"93d5e77e9ee1e9c6975f3c0bd1a21574\"\n  },\n  {\n    \"url\": \"images/icons/desktop/android-chrome-512x512.png\",\n    \"revision\": \"6df83c6c13be17a2ea70d29e340c5ddb\"\n  },\n  {\n    \"url\": \"images/icons/desktop/apple-touch-icon.png\",\n    \"revision\": \"2b78ed332644d19d9779c069c5842538\"\n  },\n  {\n    \"url\": \"images/icons/desktop/favicon-16x16.png\",\n    \"revision\": \"6c047cdbd3d5c4c962a3a692a5025d27\"\n  },\n  {\n    \"url\": \"images/icons/desktop/favicon-32x32.png\",\n    \"revision\": \"7413528d5e59c22af1ccf38187bc950b\"\n  },\n  {\n    \"url\": \"images/icons/desktop/mstile-150x150.png\",\n    \"revision\": \"540caa78f56655281b2d4b17ad52f2ce\"\n  },\n  {\n    \"url\": \"images/icons/desktop/safari-pinned-tab.svg\",\n    \"revision\": \"a0ab2c612c6a5019b3e4ae7c38043b98\"\n  },\n  {\n    \"url\": \"images/icons/icon-128x128.png\",\n    \"revision\": \"69f3f1f3f956bb71f35ce66b7717e1a0\"\n  },\n  {\n    \"url\": \"images/icons/icon-144x144.png\",\n    \"revision\": \"45e24db8671c41ca95c440df0cadf2a3\"\n  },\n  {\n    \"url\": \"images/icons/icon-152x152.png\",\n    \"revision\": \"e0867fd6e9bc25afd831b1eabdd83f8d\"\n  },\n  {\n    \"url\": \"images/icons/icon-192x192.png\",\n    \"revision\": \"cf383c3d4500d31884326cc9d53a8c3a\"\n  },\n  {\n    \"url\": \"images/icons/icon-384x384.png\",\n    \"revision\": \"31fd304cf6c5ff72928b7a91fbd68343\"\n  },\n  {\n    \"url\": \"images/icons/icon-512x512.png\",\n    \"revision\": \"47d9af0508ab29138dcb8ca6a4664cf2\"\n  },\n  {\n    \"url\": \"images/icons/icon-72x72.png\",\n    \"revision\": \"919cb6b3e8a1b5d0c963921dba0e4388\"\n  },\n  {\n    \"url\": \"images/icons/icon-96x96.png\",\n    \"revision\": \"5547ad1a33334c0f5c04f6de1f6d2c52\"\n  },\n  {\n    \"url\": \"images/patreon.png\",\n    \"revision\": \"138534b06fe107c864e576d63273cf75\"\n  },\n  {\n    \"url\": \"images/profile-icon.png\",\n    \"revision\": \"b4e6fa3d09388123298958c47aeb13ca\"\n  },\n  {\n    \"url\": \"images/rss-feed.png\",\n    \"revision\": \"fa5663a3878814bb9820de6b29005169\"\n  },\n  {\n    \"url\": \"images/zuix-logo.svg\",\n    \"revision\": \"48e6defd57440a6d0f0d12241ff9d6c5\"\n  }\n], {});\n\n\n\n\nworkbox_routing_registerRoute(/\\.(?:png|jpg|jpeg|svg)$/, new workbox_strategies_CacheFirst({ \"cacheName\":\"images\", plugins: [new workbox_expiration_ExpirationPlugin({ maxEntries: 50 })] }), 'GET');\nworkbox_routing_registerRoute(/\\.(?:html|json|js|css)$/, new workbox_strategies_CacheFirst({ \"cacheName\":\"default\", plugins: [new workbox_expiration_ExpirationPlugin({ maxEntries: 50 })] }), 'GET');\n\n\n\n\n"],"names":["self","addEventListener","event","data","type","skipWaiting","workbox_precaching_precacheAndRoute","url","revision","workbox_routing_registerRoute","workbox_strategies_CacheFirst","cacheName","plugins","workbox_expiration_ExpirationPlugin","maxEntries"],"mappings":"0nBAsBAA,KAAKC,iBAAiB,WAAYC,IAC5BA,EAAMC,MAA4B,iBAApBD,EAAMC,KAAKC,MAC3BJ,KAAKK,aACP,IAWFC,EAAAA,iBAAoC,CAClC,CACEC,IAAO,4CACPC,SAAY,oCAEd,CACED,IAAO,4CACPC,SAAY,oCAEd,CACED,IAAO,4CACPC,SAAY,oCAEd,CACED,IAAO,sCACPC,SAAY,oCAEd,CACED,IAAO,uCACPC,SAAY,oCAEd,CACED,IAAO,wCACPC,SAAY,oCAEd,CACED,IAAO,sCACPC,SAAY,oCAEd,CACED,IAAO,uCACPC,SAAY,oCAEd,CACED,IAAO,qCACPC,SAAY,oCAEd,CACED,IAAO,sCACPC,SAAY,oCAEd,CACED,IAAO,uCACPC,SAAY,oCAEd,CACED,IAAO,qCACPC,SAAY,oCAEd,CACED,IAAO,qCACPC,SAAY,oCAEd,CACED,IAAO,sCACPC,SAAY,oCAEd,CACED,IAAO,oCACPC,SAAY,oCAEd,CACED,IAAO,iCACPC,SAAY,oCAEd,CACED,IAAO,kCACPC,SAAY,oCAEd,CACED,IAAO,gCACPC,SAAY,oCAEd,CACED,IAAO,6BACPC,SAAY,oCAEd,CACED,IAAO,8BACPC,SAAY,oCAEd,CACED,IAAO,6BACPC,SAAY,oCAEd,CACED,IAAO,8BACPC,SAAY,oCAEd,CACED,IAAO,+BACPC,SAAY,oCAEd,CACED,IAAO,gCACPC,SAAY,oCAEd,CACED,IAAO,8BACPC,SAAY,oCAEd,CACED,IAAO,qCACPC,SAAY,oCAEd,CACED,IAAO,6BACPC,SAAY,oCAEd,CACED,IAAO,8BACPC,SAAY,oCAEd,CACED,IAAO,4BACPC,SAAY,oCAEd,CACED,IAAO,mCACPC,SAAY,oCAEd,CACED,IAAO,YACPC,SAAY,oCAEd,CACED,IAAO,sBACPC,SAAY,oCAEd,CACED,IAAO,oCACPC,SAAY,oCAEd,CACED,IAAO,wCACPC,SAAY,oCAEd,CACED,IAAO,gBACPC,SAAY,oCAEd,CACED,IAAO,sBACPC,SAAY,oCAEd,CACED,IAAO,aACPC,SAAY,oCAEd,CACED,IAAO,+BACPC,SAAY,oCAEd,CACED,IAAO,4BACPC,SAAY,oCAEd,CACED,IAAO,gCACPC,SAAY,oCAEd,CACED,IAAO,wBACPC,SAAY,oCAEd,CACED,IAAO,4BACPC,SAAY,oCAEd,CACED,IAAO,yBACPC,SAAY,oCAEd,CACED,IAAO,sBACPC,SAAY,oCAEd,CACED,IAAO,0BACPC,SAAY,oCAEd,CACED,IAAO,kBACPC,SAAY,oCAEd,CACED,IAAO,sBACPC,SAAY,oCAEd,CACED,IAAO,uCACPC,SAAY,oCAEd,CACED,IAAO,0BACPC,SAAY,oCAEd,CACED,IAAO,yBACPC,SAAY,oCAEd,CACED,IAAO,0BACPC,SAAY,oCAEd,CACED,IAAO,8BACPC,SAAY,oCAEd,CACED,IAAO,iCACPC,SAAY,oCAEd,CACED,IAAO,qCACPC,SAAY,oCAEd,CACED,IAAO,kBACPC,SAAY,oCAEd,CACED,IAAO,sBACPC,SAAY,oCAEd,CACED,IAAO,yBACPC,SAAY,oCAEd,CACED,IAAO,6BACPC,SAAY,oCAEd,CACED,IAAO,+BACPC,SAAY,oCAEd,CACED,IAAO,gBACPC,SAAY,oCAEd,CACED,IAAO,gDACPC,SAAY,oCAEd,CACED,IAAO,4CACPC,SAAY,oCAEd,CACED,IAAO,uCACPC,SAAY,oCAEd,CACED,IAAO,yDACPC,SAAY,oCAEd,CACED,IAAO,qDACPC,SAAY,oCAEd,CACED,IAAO,gDACPC,SAAY,oCAEd,CACED,IAAO,6DACPC,SAAY,oCAEd,CACED,IAAO,yDACPC,SAAY,oCAEd,CACED,IAAO,oDACPC,SAAY,oCAEd,CACED,IAAO,gEACPC,SAAY,oCAEd,CACED,IAAO,4DACPC,SAAY,oCAEd,CACED,IAAO,uDACPC,SAAY,oCAEd,CACED,IAAO,gEACPC,SAAY,oCAEd,CACED,IAAO,4DACPC,SAAY,oCAEd,CACED,IAAO,uDACPC,SAAY,oCAEd,CACED,IAAO,gEACPC,SAAY,oCAEd,CACED,IAAO,4DACPC,SAAY,oCAEd,CACED,IAAO,uDACPC,SAAY,oCAEd,CACED,IAAO,4DACPC,SAAY,oCAEd,CACED,IAAO,wDACPC,SAAY,oCAEd,CACED,IAAO,mDACPC,SAAY,oCAEd,CACED,IAAO,8DACPC,SAAY,oCAEd,CACED,IAAO,0DACPC,SAAY,oCAEd,CACED,IAAO,qDACPC,SAAY,oCAEd,CACED,IAAO,oEACPC,SAAY,oCAEd,CACED,IAAO,gEACPC,SAAY,oCAEd,CACED,IAAO,2DACPC,SAAY,oCAEd,CACED,IAAO,8CACPC,SAAY,oCAEd,CACED,IAAO,0CACPC,SAAY,oCAEd,CACED,IAAO,qCACPC,SAAY,oCAEd,CACED,IAAO,kEACPC,SAAY,oCAEd,CACED,IAAO,8DACPC,SAAY,oCAEd,CACED,IAAO,yDACPC,SAAY,oCAEd,CACED,IAAO,wEACPC,SAAY,oCAEd,CACED,IAAO,oEACPC,SAAY,oCAEd,CACED,IAAO,+DACPC,SAAY,oCAEd,CACED,IAAO,4EACPC,SAAY,oCAEd,CACED,IAAO,wEACPC,SAAY,oCAEd,CACED,IAAO,mEACPC,SAAY,oCAEd,CACED,IAAO,0EACPC,SAAY,oCAEd,CACED,IAAO,sEACPC,SAAY,oCAEd,CACED,IAAO,iEACPC,SAAY,oCAEd,CACED,IAAO,iEACPC,SAAY,oCAEd,CACED,IAAO,6DACPC,SAAY,oCAEd,CACED,IAAO,wDACPC,SAAY,oCAEd,CACED,IAAO,oEACPC,SAAY,oCAEd,CACED,IAAO,gEACPC,SAAY,oCAEd,CACED,IAAO,2DACPC,SAAY,oCAEd,CACED,IAAO,iEACPC,SAAY,oCAEd,CACED,IAAO,6DACPC,SAAY,oCAEd,CACED,IAAO,wDACPC,SAAY,oCAEd,CACED,IAAO,qEACPC,SAAY,oCAEd,CACED,IAAO,iEACPC,SAAY,oCAEd,CACED,IAAO,4DACPC,SAAY,oCAEd,CACED,IAAO,sEACPC,SAAY,oCAEd,CACED,IAAO,kEACPC,SAAY,oCAEd,CACED,IAAO,6DACPC,SAAY,oCAEd,CACED,IAAO,gEACPC,SAAY,oCAEd,CACED,IAAO,4DACPC,SAAY,oCAEd,CACED,IAAO,uDACPC,SAAY,oCAEd,CACED,IAAO,wDACPC,SAAY,oCAEd,CACED,IAAO,oDACPC,SAAY,oCAEd,CACED,IAAO,+CACPC,SAAY,oCAEd,CACED,IAAO,yDACPC,SAAY,oCAEd,CACED,IAAO,qDACPC,SAAY,oCAEd,CACED,IAAO,gDACPC,SAAY,oCAEd,CACED,IAAO,8CACPC,SAAY,oCAEd,CACED,IAAO,0CACPC,SAAY,oCAEd,CACED,IAAO,qCACPC,SAAY,oCAEd,CACED,IAAO,oDACPC,SAAY,oCAEd,CACED,IAAO,gDACPC,SAAY,oCAEd,CACED,IAAO,2CACPC,SAAY,oCAEd,CACED,IAAO,0DACPC,SAAY,oCAEd,CACED,IAAO,sDACPC,SAAY,oCAEd,CACED,IAAO,iDACPC,SAAY,oCAEd,CACED,IAAO,qDACPC,SAAY,oCAEd,CACED,IAAO,iDACPC,SAAY,oCAEd,CACED,IAAO,4CACPC,SAAY,oCAEd,CACED,IAAO,0DACPC,SAAY,oCAEd,CACED,IAAO,sDACPC,SAAY,oCAEd,CACED,IAAO,iDACPC,SAAY,oCAEd,CACED,IAAO,0CACPC,SAAY,oCAEd,CACED,IAAO,sCACPC,SAAY,oCAEd,CACED,IAAO,iCACPC,SAAY,oCAEd,CACED,IAAO,oDACPC,SAAY,oCAEd,CACED,IAAO,+CACPC,SAAY,oCAEd,CACED,IAAO,2CACPC,SAAY,oCAEd,CACED,IAAO,sCACPC,SAAY,oCAEd,CACED,IAAO,iDACPC,SAAY,oCAEd,CACED,IAAO,iCACPC,SAAY,oCAEd,CACED,IAAO,6BACPC,SAAY,oCAEd,CACED,IAAO,wBACPC,SAAY,oCAEd,CACED,IAAO,oBACPC,SAAY,oCAEd,CACED,IAAO,mBACPC,SAAY,oCAEd,CACED,IAAO,6BACPC,SAAY,oCAEd,CACED,IAAO,yBACPC,SAAY,oCAEd,CACED,IAAO,oBACPC,SAAY,oCAEd,CACED,IAAO,iDACPC,SAAY,oCAEd,CACED,IAAO,iDACPC,SAAY,oCAEd,CACED,IAAO,iDACPC,SAAY,oCAEd,CACED,IAAO,iDACPC,SAAY,oCAEd,CACED,IAAO,iDACPC,SAAY,oCAEd,CACED,IAAO,iDACPC,SAAY,oCAEd,CACED,IAAO,iDACPC,SAAY,oCAEd,CACED,IAAO,iDACPC,SAAY,oCAEd,CACED,IAAO,iDACPC,SAAY,oCAEd,CACED,IAAO,iDACPC,SAAY,oCAEd,CACED,IAAO,iDACPC,SAAY,oCAEd,CACED,IAAO,iDACPC,SAAY,oCAEd,CACED,IAAO,iDACPC,SAAY,oCAEd,CACED,IAAO,oDACPC,SAAY,oCAEd,CACED,IAAO,oDACPC,SAAY,oCAEd,CACED,IAAO,oDACPC,SAAY,oCAEd,CACED,IAAO,kDACPC,SAAY,oCAEd,CACED,IAAO,wDACPC,SAAY,oCAEd,CACED,IAAO,wDACPC,SAAY,oCAEd,CACED,IAAO,qDACPC,SAAY,oCAEd,CACED,IAAO,4BACPC,SAAY,oCAEd,CACED,IAAO,+BACPC,SAAY,oCAEd,CACED,IAAO,yBACPC,SAAY,oCAEd,CACED,IAAO,kDACPC,SAAY,oCAEd,CACED,IAAO,kDACPC,SAAY,oCAEd,CACED,IAAO,4CACPC,SAAY,oCAEd,CACED,IAAO,yCACPC,SAAY,oCAEd,CACED,IAAO,yCACPC,SAAY,oCAEd,CACED,IAAO,0CACPC,SAAY,oCAEd,CACED,IAAO,6CACPC,SAAY,oCAEd,CACED,IAAO,gCACPC,SAAY,oCAEd,CACED,IAAO,gCACPC,SAAY,oCAEd,CACED,IAAO,gCACPC,SAAY,oCAEd,CACED,IAAO,gCACPC,SAAY,oCAEd,CACED,IAAO,gCACPC,SAAY,oCAEd,CACED,IAAO,gCACPC,SAAY,oCAEd,CACED,IAAO,8BACPC,SAAY,oCAEd,CACED,IAAO,8BACPC,SAAY,oCAEd,CACED,IAAO,qBACPC,SAAY,oCAEd,CACED,IAAO,0BACPC,SAAY,oCAEd,CACED,IAAO,sBACPC,SAAY,oCAEd,CACED,IAAO,uBACPC,SAAY,qCAEb,CAAE,GAKLC,EAAAA,cAA8B,0BAA2B,IAAIC,aAA8B,CAAEC,UAAY,SAAUC,QAAS,CAAC,IAAIC,mBAAoC,CAAEC,WAAY,QAAW,OAC9LL,EAAAA,cAA8B,0BAA2B,IAAIC,aAA8B,CAAEC,UAAY,UAAWC,QAAS,CAAC,IAAIC,mBAAoC,CAAEC,WAAY,QAAW"}
\ No newline at end of file
diff --git a/docs/sitemap.xml b/docs/sitemap.xml
index 6bfb92e..c1f21f3 100644
--- a/docs/sitemap.xml
+++ b/docs/sitemap.xml
@@ -61,10 +61,6 @@
     <loc>https://zuixjs.org//pages/documentation/api/observable/ObjectObserver/</loc>
     <lastmod>2024-03-13</lastmod>
   </url>
-  <url>
-    <loc>https://zuixjs.org//pages/documentation/active_refresh/</loc>
-    <lastmod>2024-03-13</lastmod>
-  </url>
   <url>
     <loc>https://zuixjs.org//pages/documentation/api/helpers/Utils.dom/</loc>
     <lastmod>2024-03-13</lastmod>
@@ -125,4 +121,8 @@
     <loc>https://zuixjs.org//pages/documentation/view/</loc>
     <lastmod>2024-03-13</lastmod>
   </url>
+  <url>
+    <loc>https://zuixjs.org//pages/documentation/active_refresh/</loc>
+    <lastmod>2024-10-26</lastmod>
+  </url>
 </urlset>
diff --git a/source/_inc/layouts/side_drawer.liquid b/source/_inc/layouts/side_drawer.liquid
index 686ce83..21b8d5a 100644
--- a/source/_inc/layouts/side_drawer.liquid
+++ b/source/_inc/layouts/side_drawer.liquid
@@ -65,7 +65,7 @@ date: Last Modified
                          title="zuix.js on GitHub" width="32" height="32">
                 </a>
             </div>
-            <div style="padding-left: 6px;padding-right: 6px;">
+            <div style="font-size:80%; padding-left: 6px;padding-right: 6px;">
                 JavaScript library for component-based websites and applications.
             </div>
         </div>
diff --git a/source/_inc/layouts/side_drawer/drawer.css b/source/_inc/layouts/side_drawer/drawer.css
index 403b5e5..968c16e 100644
--- a/source/_inc/layouts/side_drawer/drawer.css
+++ b/source/_inc/layouts/side_drawer/drawer.css
@@ -19,11 +19,11 @@
 
 .drawer-header .text-logo {
     font-family: "Roboto", "Open Sans", sans-serif;
-    font-size: 180%;
+    font-size: 150%;
     font-weight: 400;
 }
 .drawer-header .text-logo small {
-    font-size: 12px;
+    font-size: 10pt;
     vertical-align: middle;
     margin-left: 8px;
 }
@@ -81,6 +81,7 @@
     color: var(--primary-color);
 }
 .drawer-content li a {
+    font-weight: bold;
     color: var(--accent-color);
     position: relative;
     display: block;
diff --git a/source/_inc/layouts/side_drawer/page_navigation.liquid b/source/_inc/layouts/side_drawer/page_navigation.liquid
index 8d681b8..661e5ef 100644
--- a/source/_inc/layouts/side_drawer/page_navigation.liquid
+++ b/source/_inc/layouts/side_drawer/page_navigation.liquid
@@ -3,7 +3,7 @@
     {% assign prevPost = collections[group] | sort: 'data.pubDate' | reverse | sort: 'data.order' | getPreviousCollectionItem: page %}
     {% assign nextPost = collections[group] | sort: 'data.pubDate' | reverse | sort: 'data.order' | getNextCollectionItem: page %}
 
-    <div layout="rows center-spread" style="margin-top: 112px; gap:12px; margin-bottom: 32px; padding-left: 8px; padding-right: 8px; font-size: 140%">
+    <div layout="rows center-spread" style="margin-top: 112px; gap:12px; margin-bottom: 32px; padding-left: 8px; padding-right: 8px; font-size: 120%">
 
         {% if prevPost %}
         <a href="{{ prevPost.url |  url }}" style="text-align: center">
diff --git a/source/_inc/layouts/side_drawer/style.css b/source/_inc/layouts/side_drawer/style.css
index 2a87c92..927d458 100644
--- a/source/_inc/layouts/side_drawer/style.css
+++ b/source/_inc/layouts/side_drawer/style.css
@@ -7,7 +7,7 @@
     body {
         margin: 0;
         padding: 0;
-        font-size: 12px!important;
+        font-size: 12pt!important;
         font-family: "Roboto", "Open Sans", sans-serif;
         font-weight: 400;
         position: relative;
@@ -53,7 +53,7 @@
     }
     label {
         color: #366495;
-        font-size: 14px;
+        font-size: 12pt;
         text-transform: uppercase;
         font-weight: 600;
         margin-top: 24px;
@@ -66,7 +66,7 @@
     li {
         font-weight: 400;
         line-height: 175%;
-        font-size: 100%;
+        font-size: 105%;
         min-height: 32px;
     }
     li small {
@@ -110,7 +110,7 @@
     }
 
     code[class*=language-], pre[class*=language-] {
-        font-size: 115%;
+        font-size: 100%;
     }
     pre:not([class*="language-"]) {
         width: 100%;
@@ -179,7 +179,7 @@
         margin-bottom: 16px;
     }
     div.content > p {
-        font-size: 150% !important;
+        font-size: 110% !important;
         line-height: 170% !important;
         margin: 24px 0 24px;
     }
diff --git a/source/pages/documentation/active_refresh/index.md b/source/pages/documentation/active_refresh/index.md
index 97a12c7..b7f8a79 100644
--- a/source/pages/documentation/active_refresh/index.md
+++ b/source/pages/documentation/active_refresh/index.md
@@ -253,7 +253,7 @@ view of the component, and this can be used to customize a visible feedback of t
 </div>
 <style>
   [z-context="ready-example"] {
-    font-size: 200%;
+    font-size: 140%;
     width: 200px;
     padding: 12px;
     margin-bottom:24px;